javascript d3.js 的本地化(d3.locale 使用示例)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/24385582/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 02:42:24  来源:igfitidea点击:

Localization of d3.js (d3.locale example of usage)

javascriptd3.js

提问by Sergey Scopin

I'm trying to use d3.locale()in my app to display Russian names of months. http://jsfiddle.net/j2feJ/2/Also, I need shortMonthsvariable to be in English, because they are in English in my database.

我试图d3.locale()在我的应用程序中使用来显示月份的俄语名称。 http://jsfiddle.net/j2feJ/2/另外,我需要shortMonths变量是英文的,因为它们在我的数据库中是英文的。

var ru_RU = {
    "decimal": ",",
        "thousands": "\xa0",
        "grouping": [3],
        "currency": ["", " руб."],
        "dateTime": "%A, %e %B %Y г. %X",
        "date": "%d.%m.%Y",
        "time": "%H:%M:%S",
        "periods": ["AM", "PM"],
        "days": ["воскресенье", "понедельник", "вторник", "среда", "четверг", "пятница", "суббота"],
        "shortDays": ["вс", "пн", "вт", "ср", "чт", "пт", "сб"],
        "months": ["Январь", "Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь", "Декабрь"],
        "shortMonths": ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
}

But display is still in English. Am I using it wrong?

但是显示还是英文。我用错了吗?

回答by jshanley

Calling d3.locale()doesn't change the internal workings of d3, it just creates and returns a localization object. You need to capture this return value and store it in a variable so you can use it later. Given the object you created in your example code, you could do that like this:

调用d3.locale()不会改变 d3 的内部工作方式,它只是创建并返回一个本地化对象。您需要捕获此返回值并将其存储在变量中,以便稍后使用。鉴于您在示例代码中创建的对象,您可以这样做:

var RU = d3.locale(ru_RU);

Then when you need a value to be localized, you must call for it explicitly. In your case, you want the full month names to be displayed as x-axis labels.

然后,当您需要本地化一个值时,您必须显式调用它。在您的情况下,您希望完整的月份名称显示为 x 轴标签。

To do this, you can add a .tickFormat()to your x-axis, and specify that the format should be your localized version of a full month name.

为此,您可以.tickFormat()向 x 轴添加,并指定格式应为完整月份名称的本地化版本。

var xAxis = d3.svg.axis()
  .scale(x)
  .orient("bottom")
  .ticks(5)
  .tickPadding(8)
  .tickFormat(RU.timeFormat("%B"));

locale.timeFormat()is equivalent to d3.time.format(), except that it uses the locale that you created instead of defaulting to en_US. In this case localeis the variable RUwhich we created earlier.

locale.timeFormat()等价于d3.time.format(),不同之处在于它使用您创建的语言环境而不是默认为 en_US。在这种情况下localeRU我们之前创建的变量。

Here is the updated JSFiddle.

这是更新的JSFiddle

Remember, each time you want a localized string or value, you need to call for it explicitly. Use locale.numberFormat()in place of d3.format(), and locale.timeFormat()in place of d3.time.format(), where localeis a localization object created with d3.locale(). Hope that helps.

请记住,每次您想要一个本地化的字符串或值时,您都需要明确地调用它。使用locale.numberFormat()代替d3.format()locale.timeFormat()代替d3.time.format(), wherelocale是用d3.locale().创建的本地化对象。希望有帮助。