0

我想将小图表的 XTick 格式更改为日期。我有以下内容来自此示例：

function chart(div)
{
var testdata = loadData();
nv.addGraph(function() {

    var chart = nv.models.lineWithFocusChart();

    chart.xAxis.tickFormat(function(d) {
       var dx = testdata[0].values[d] && testdata[0].values[d].x || 0;
       return d3.time.format('%x')(new Date(dx))
     });

    chart.yAxis
        .tickFormat(d3.format(',.2f'));

   chart.y2Axis
       .tickFormat(d3.format(',.2f'));

   d3.select(div + ' svg')
       .datum(loadData())
     .transition().duration(500)
       .call(chart);

   nv.utils.windowResize(chart.update);

   return chart;
 });
 }

但迄今为止，只有大图表的格式发生了变化。

4

1 回答 1

1

有两种方法可以固定第二个 x 轴的刻度。

第一种方法是也tickFormat为第二个轴显式设置。这种设计遵循一次设置一个属性的传统范例。

var xFormat = function(d) {
   var dx = testdata[0].values[d] && testdata[0].values[d].x || 0;
   return d3.time.format('%x')(new Date(dx));
};

chart.xAxis.tickFormat(xFormat);
chart.xAxis2.tickFormat(xFormat);

第二种避免代码重复的方法是使用chartAPI 公开的特殊函数将两个轴设置在一起：

// This would set both the axis simultaneously
chart.xTickFormat(xFormat);

这个函数出现在代码中（这里介绍）正是为了这个目的。但是，由于 API 不是很稳定，以后可能会被删除。

于 2013-01-28T23:26:27.623 回答