使用d3 js创建基本气泡图的外部json文件问题

时间:2016-05-20 13:38:10

标签: javascript jquery json d3.js

我目前正在开展一个小型项目,我需要使用此博客See it here中准确描述的气泡图。我希望它的内容是动态的,所以我做的是修改它以便从json页面获取内容。在我编码时,我遇到了一个完全描述的错误Here。我按照它的解决方案,但我得到一个错误,它说" Uncaught TypeError:无法读取属性' items'未定义"。我无法评论这个问题,因为我的名声不够,所以我创建了一个新问题。

这是D3的原始代码(index.js,省略代码缩写):

$(document).ready(function () {
  var bubbleChart = new d3.svg.BubbleChart({
supportResponsive: true,
size: 600,
...
data: {
  items: [
    {text: "Java", count: "236"},
    {text: ".Net", count: "382"},
    {text: "Php", count: "170"},        
    ...
    {text: "Something", count: "170"},
  ],
  eval: function (item) {return item.count;},
  classed: function (item) {return item.text.split(" ").join("");}
},
plugins: [
  {
    ...
  },
  {
    ...
  }]  });
});

以下是我之前提到的链接中建议的更新代码:

$(document).ready(function () {
d3.json("http://json/path/", function (json) {  
var bubbleChart = new d3.svg.BubbleChart({
    supportResponsive: true,
    size: 600,
    ...
    data:json,
    plugins: [
      {
        ...
      },
      {
        ...
      }]
  });  
}); 
});

似乎错误提示是因为下面的行已被删除但是我尝试修改上面的代码以合并下面的代码,但我没有运气使其工作。似乎在bubble-chart.js中仍然需要这些代码。我已经检查了我的json字符串,它是有效的。

  eval: function (item) {return item.count;},
  classed: function (item) {return item.text.split(" ").join("");}

有没有人可以帮我解决这个问题?任何帮助,将不胜感激。谢谢! -Borj

0 个答案:

没有答案