NVD3散点图圆半径答案

【问题标题】：NVD3 Scatter Chart Circle RadiusNVD3散点图圆半径
【发布时间】：2014-02-01 22:56:50
【问题描述】：

我想知道如何在 NVD3 散点图中设置圆的最小和最大半径。

NVD3 散点图：http://nvd3.org/ghpages/scatter.html

【问题讨论】：

标签： javascript svg d3.js nvd3.js

【解决方案1】：

在您的图表对象上调用.sizeRange([minArea, maxArea])。请注意，“大小”与面积成正比，而不是半径，因此您需要使用最大/最小半径的平方（如果要精确，请调整 pi/2）。

【讨论】：

【解决方案2】：

从 1.7.1 开始，请致电 .pointRange([minArea,maxArea]) 。

【讨论】：

【解决方案3】：

nv.addGraph(function() {
  var chart = nv.models.scatterChart()
                .showDistX(true)
                .sizeRange([100, 1000]) /*** Chart Circle Range ****/
                .showDistY(true)
                .color(d3.scale.category10().range());


  chart.xAxis.tickFormat(d3.format('.02f'));
  chart.yAxis.tickFormat(d3.format('.02f'));

  d3.select('#chart svg')
      .datum(data(4,40))
      .transition().duration(500)
      .call(chart);

  nv.utils.windowResize(chart.update);

  return chart;
});

Use this this link 或将上面的代码应用到这个LINK

.sizeRange([minArea, maxArea])

示例：.sizeRange([100, 1000])

【讨论】：