Changing Moment JS locale of axis

[FunDeckHermit]

Hello,

Changing the locale does not change the locale of the axis. Could you give some pointers to where I could change these settings?

In the example below I change the locale to 'hr', Croatian. The subtitle does change but the axis stays in English.

[flrs]

This is the same issue as #21.

At the core of the resolution of this issue is that the D3.js locale has to be set to whatever locale is specified by moment.js. I think in an ideal world, we would use resources we already have (moment.js) to translate the axis labels. However, we need to find out how well this plays with D3.js.

Resolution of this conflict might go well with updating the D3.js version, I believe the locale interfaces have changed since I made visavail.js. I do not know when I will get to resolve this issue, but feel free to code up a resolution yourself. This would for sure benefit the project!

[FunDeckHermit]

Could you explain where in your code the axis is build? That would help me alot.

[FunDeckHermit]

I now have it hardcoded into the visavail.js script. It would be better if I could get the data from moment.js.

  var germanFormatters = d3.locale({
    "decimal": ",",
    "thousands": ".",
    "grouping": [3],
    "currency": ["€", ""],
    "dateTime": "%a %b %e %X %Y",
    "date": "%d.%m.%Y",
    "time": "%H:%M:%S",
    "periods": ["AM", "PM"],
    "days": ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"],
    "shortDays": ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"],
    "months": ["Jänner", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"],
    "shortMonths": ["Jän", "Feb", "Mär", "Apr", "Mai", "Jun", "Jul", "Agu", "Sep", "Okt", "Nov", "Dez"]
  });

  var customTimeFormat = germanFormatters.timeFormat.multi([
    [".%L", function(d) { return d.getMilliseconds(); }],
    [":%S", function(d) { return d.getSeconds(); }],
    ["%I:%M", function(d) { return d.getMinutes(); }],
    ["%Hh", function(d) { return d.getHours(); }],
    ["%a %d", function(d) { return d.getDay() && d.getDate() != 1; }],
    ["%b %d", function(d) { return d.getDate() != 1; }],
    ["%B", function(d) { return d.getMonth(); }],
    ["%Y", function() { return true; }]
      ]);           

  // define axes
  var xAxis = d3.svg.axis()
      .scale(xScale)
      .orient('top')
      .tickFormat(customTimeFormat);