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

nvd3/svg未使用新数据更新

nvd3.js d3.js svg jquery javascript

GoT · 技术社区 · 12 年前

我的html正文中添加了两个svg div

<div id="tag1"><svg></svg></div>
<div id="tag2"><svg></svg></div>
<body>

每次提交表单时,我都调用下面的代码来创建一个nvd3图。但是,我看到第一个调用是有效的,但是,对于后续的表单提交调用,图形不会改变(在每个表单提交上,url都不同,因此数据也不同。我已经验证了addGraph函数的数据参数是否正确填充。但是,即使addGraph函数中的数据不同,svg内容也不会重新填充。

newChart = d3.json(url, function(error, data) {
    nv.addGraph(function() {
        var chart = nv.models.discreteBarChart()
          .staggerLabels(true)
          .tooltips(true)
          .showValues(false)
          .showXAxis(false)
          .color(['#1f77b4'])

        d3.select('#tag1 svg')
          .datum(data['x])
          .transition().duration(500)
          .call(chart)
          ;

        nv.utils.windowResize(chart.update);

        return chart;
    });
    nv.addGraph(function() {
      var chart = nv.models.pieChart()
          .showLabels(true);

        d3.select("#tag2 svg")
          .datum(data['y'])
          .transition().duration(1200)
          .call(chart);

        nv.utils.windowResize(chart.update);

      return chart;
    });

1 回复 | 直到 12 年前

alaknis 11 年前

您的代码应该可以正常工作。确认您是否真的通过执行以下操作获得了不同的数据

d3.json(url, function(error, data) {
    console.log(data);
}

检查您每次提交表单时获得的内容是否不同。

另外,如果您只是从js文件中复制了这段代码,请注意第一个图表的.datum()中缺少'

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Dr.0000FF · jQuery按钮点击不显示/隐藏内容

1 年前

user28928120 · 如何在jquery中选择所有类?

1 年前

LauraNMS · 如何使用Waypoints js实现粘性元素和偏移量

1 年前

Eliable · 使点击计数器和进度条协同工作

1 年前

mlri · 从不同的onclick事件执行相同的javascript函数

1 年前

Cymro · 如何将jquery$(this)与$(document).keyup一起使用

1 年前

Jack Maessen · 在处理程序上使用时如何获取输入类型

1 年前

BlueDogRanch · 使用jQuery Datepicker和dateFormat、altFormat和altField以及$(this)

1 年前

Jameel · Jquery:未捕获SyntaxError:在参数列表后的“Node”上执行“appendChild”失败:缺失)

1 年前