5

我正在使用 D3Plus,而 D3Plus 接受任何 D3 方法。

我可以设法删除小数。我不能做的是添加一个'。作为千位分隔符而不是“,”(在西班牙语中,1.000.000 是“一百万”),这是针对说西班牙语的观众。

这是我的代码的相关部分

"number": function(number, params) {
    var formatted = d3plus.number.format(number, params);
      if (params.key === "encuentros") {
        return d3.round(number,0);
      }
      if (params.key === "poblacion") {
        return d3.round(number,0);
      }
      else {
        return formatted;
      }
  }

我确实尝试return d3.round(number,0) + d3.format('.')过,但这不起作用。

该图表是“好的”,但没有小数分隔符。

在此处输入图像描述

4

4 回答 4

9

您是否尝试过使用 d3.locale?它非常适合您的用例,因为它根据您自己的本地化规则构建格式化函数。

您可以做的是创建自定义本地化规则,以提供您的格式:

var myLocale = {
  "thousands": ".",  // specify that thousands are separated with a dot
  // .. other rules
}

然后使用这些规则来初始化您的自定义格式化程序:

var localeFormatter = d3.locale(myLocale);
// ',.2r' means grouped thousands with two significant digits. 
// By default ',' means 'thousands' but we switched that into a '.' in our custom localization
var myFormatter = localeFormatter.numberFormat(',.2r'); 
var value = myFormatter(1000000); // "1.000.000"

这是一个正在运行的示例:

// custom localization options
var myLocale = {
  "decimal": ".",
  "thousands": ".",
  "grouping": [3],
  "currency": ["$", ""],
  "dateTime": "%a %b %e %X %Y",
  "date": "%m/%d/%Y",
  "time": "%H:%M:%S",
  "periods": ["AM", "PM"],
  "days": ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
  "shortDays": ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
  "months": ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"],
  "shortMonths": ["Ene", "Feb", "Mar", "Abr", "May", "Jun", "Jul", "Ago", "Sep", "Oct", "Nov", "Dic"]

}

// create custom locale formatter from the given locale options
var localeFormatter = d3.locale(myLocale);

// create a formatter for the number (grouped thousands with two significant digits). By default ',' means 'thousands' but we switched that into a '.' in our custom localization
var numberFormat = localeFormatter.numberFormat(",.2r");

// test
console.log(numberFormat(1000000)); // "1.000.000"
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

于 2016-07-05T19:53:31.890 回答
2

D3plus 没有复杂的自定义数字格式化程序,而是内置了本地化,包括西班牙语。这不仅处理数字格式,而且还将任何界面消息翻译成该语言。您必须添加到可视化中的是:

.format("es_ES")

这是 D3plus 网站上的一个示例:http: //d3plus.org/examples/advanced/10bfe1908a200c201145/

以下是支持的本地化列表:https ://github.com/alexandersimoes/d3plus/wiki/Localization

于 2016-07-22T21:06:44.417 回答
0

查看 d3plus 的源代码,特别是数字格式库: https ://github.com/alexandersimoes/d3plus/blob/master/src/number/format.coffee

这里有一个你想要实现的例子:http: //d3plus.org/examples/advanced/7760febcda3375b39e1f/

特别是查看format()方法(第 29 - 39 行)。

于 2016-07-05T18:42:58.337 回答
0

我想你正在寻找 D3.numberFormat(",d")

于 2018-07-19T13:03:05.937 回答