Fatal编程技术网

Javascript d3用逗号替换分号

javascript d3.js

Javascript d3用逗号替换分号,javascript,d3.js,Javascript,D3.js,希望有一个比我聪明的人能很快解决这个问题。我有csv文件，带有分号分隔符。它无法阅读标题： d3.csv("file.csv", function(error, data) { data.forEach(function(d) { d.date = parseDate(d.date); d.value2 = +d.value2; d.value1 = +d.value1; }); 我尝试添加类似data.replace（/\s*；\s*/g

希望有一个比我聪明的人能很快解决这个问题。我有csv文件，带有分号分隔符。它无法阅读标题：

d3.csv("file.csv", function(error, data) {
   data.forEach(function(d) {
       d.date = parseDate(d.date);
       d.value2 = +d.value2;
       d.value1 = +d.value1;
   });
我尝试添加类似data.replace（/\s*；\s*/g，“，”）的内容，但不起作用

感谢您的帮助。

让我们将我的评论转换为答案，这样就不会没有答案了：

假设您的值由分号分隔（因此从技术上讲，它不再是CSV），您可能希望看到以下内容：

旧答案，检查最近的答案 以下代码适用于我：

d3.dsv(';')("your_file.csv", function(error, data){
   ...
}

d3.dsv（分隔符）
是一个构造函数，它返回一个与
d3.csv
函数完全相同的函数。 实际上，
d3.csv
相当于
d3.dsv（'，'）

例如，法国默认使用带有分号的
.csv
（是的，毕竟csv并不是指“逗号分隔的值”）。 DSV代表分隔符分隔的值，更一般。

D3 V3+或更高版本的工作示例 

桌子{
边界塌陷：塌陷；
边框：2个黑色实心；
字体：12px无衬线；
字体系列：“投石机MS”，Arial，Helvetica，无衬线；
宽度：100%；
}
tr：第一个孩子{
填充顶部：12px；
垫底：12px；
文本对齐：左对齐；
背景色：#4CAF50；
颜色：白色；
背景色：#4CAF50；
}
运输署{
边框：1px黑色实心；
填充物：5px；
边框：1px实心#ddd；
填充：8px；
}
tr:n子（偶数）{背景色：#f2f2；}
tr:hover{背景色：#ddd；}
d3.文本（“data.csv”，函数（数据）{
var parsedCSV=d3.dsv（“；”）.parseRows（数据）；
变量容器=d3。选择（“主体”）
.append（“表格”）
.selectAll（“tr”）
.data（parsedCSV）.enter（）
.附加（“tr”）
.selectAll（“td”）
.data（函数（d）{return d；}）.enter（）
.附加（“td”）
.text（函数（d）{return d；}）；
});
参考：

我使表格有点样式化，可读性更强。

CSV文件是否使用分号分隔符？听起来有些矛盾。也许你想看看：你试过这样替换它吗<代码>数据=数据。替换（“；”，“，”）链接似乎不再起作用了，而且在版本4中这看起来有点复杂。编辑的死链接。如果
d3.dsv（“；”）
不返回函数，这就不太合适了。事实上，您必须使用
var parser=d3.dsvFormat（“；”）
创建一个解析器，然后将其用作
parser.parse（textToParse，row）
。使用D3V5，“d3.dsv（…）不是一个函数”。 
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
            table {
                border-collapse: collapse;
                border: 2px black solid;
                font: 12px sans-serif;
                font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
                width: 100%;
            }
        tr:first-child {
          padding-top: 12px;
          padding-bottom: 12px;
          text-align: left;
          background-color: #4CAF50;
          color: white;
          background-color: #4CAF50;
         }
      
         td {
            border: 1px black solid;
            padding: 5px;
            border: 1px solid #ddd;
            padding: 8px;
            }


         tr:nth-child(even){background-color: #f2f2f2;}

         tr:hover {background-color: #ddd;}

    </style>
</head>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>

<script type="text/javascript" charset="utf-8">
            d3.text("data.csv", function(data) {
                var parsedCSV = d3.dsv(';').parseRows(data);

                var container = d3.select("body")
                    .append("table")

                    .selectAll("tr")
                        .data(parsedCSV).enter()
                        .append("tr")

                    .selectAll("td")
                        .data(function(d) { return d; }).enter()
                        .append("td")
                        .text(function(d) { return d; });
            });

</script>
</body>
</html>