【问题标题】:nvd3 legends overlapnvd3图例重叠
【发布时间】:2013-03-14 11:51:17
【问题描述】:

我的数据包含两条正确渲染的曲线,但图例重叠,因此第二条的彩色点和文本部分与第一条的文本重叠。当我单击任一点以隐藏曲线时,重叠会立即解决,并且不会返回。

代码如下。一个页面上有多个。当我省略 xAxis 线时,问题就解决了,尽管没有明显的联系。

d3.json('project_x_data.json', function(data) {
  nv.addGraph(function() {
  var chart = nv.models.lineChart()
                  .x(function(d) { return d[0] })
                  .y(function(d) { return d[1] })
                  .clipEdge(true);

  chart.xAxis.axisLabel('').tickFormat(function(d){
    return d3.time.format('%d/%m/%y')(new Date(d*1000)) });

  d3.select('#chart-project_x_data svg').datum(data)
    .call(chart);

  nv.utils.windowResize(chart.update);
  return chart;
  });
});

版本:: 浏览器:Firefox、Chrome、Ubuntu 和 OSX。相同的行为 novus/nvd3 最新,和 Advael 的当前合并。

编辑...

图表包含在引导选项卡中,默认情况下在页面加载时不显示该选项卡。当我在选择标签 IS 时调整浏览器窗口的大小(图表可见可见)时,图例会自行纠正。当我在 NOT 选择选项卡(图表隐藏)时调整浏览器窗口的大小时,然后 选择选项卡,图例并未自行更正。由于图表太……简单,问题似乎是在图表隐藏时完成了渲染。

这是否有助于激发任何​​想法?

【问题讨论】:

  • 仅供参考 - 我也有这个问题。

标签: d3.js nvd3.js


【解决方案1】:

这不再是问题。

I now render the graphs using Ajax, only when the tab has become visible.这足以使结果可靠且可重复。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-08-25
    • 2012-08-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多