代码之家  ›  专栏  ›  技术社区  ›  topiaruss

nvd3图例重叠

  •  1
  • topiaruss  · 技术社区  · 12 年前

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

    下面的代码。一页上有多个这样的。当我省略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目前的合并。

    编辑

    图表包含在引导选项卡中,默认情况下,页面加载时不会显示该选项卡。当我调整浏览器窗口的大小时 选中(图表可见),图例会自行更正。当我调整浏览器窗口的大小时 不是 选中(图表被隐藏), 然后 选择选项卡,图例尚未自行更正。既然图表太棒了。。。很简单,问题似乎是在隐藏图表的同时进行渲染。

    这有助于引发任何想法吗?

    1 回复  |  直到 12 年前
        1
  •  0
  •   topiaruss    12 年前

    这已经不是一个问题了。

    现在,我只在选项卡变为可见时才使用Ajax渲染图形。这足以使结果变得可靠和可重复。