小编Mr.*_*oto的帖子

D3 从所有圆形到不同形状的散点图

我正在尝试学习 D3,正在看这个例子:

http://bl.ocks.org/weiglemc/6185069

我现在想做的是改变点的形状,所以我想要基于数据集中谷物品牌的圆形、正方形和三角形,而不是所有圆形作为数据点。这看起来应该是一个简单的更改,但当我进行更改时,我无法显示形状。

我知道需要在这一段代码中进行此更改:

  svg.selectAll(".dot")
      .data(data)
    .enter().append("circle")
      .attr("class", "dot")
      .attr("r", 3.5)
      .attr("cx", xMap)
      .attr("cy", yMap)
      .style("fill", function(d) { return color(cValue(d));}) 
      .on("mouseover", function(d) {
          tooltip.transition()
               .duration(200)
               .style("opacity", .9);
          tooltip.html(d["Cereal Name"] + "<br/> (" + xValue(d) 
            + ", " + yValue(d) + ")")
               .style("left", (d3.event.pageX + 5) + "px")
               .style("top", (d3.event.pageY - 28) + "px");
      })
      .on("mouseout", function(d) {
          tooltip.transition()
               .duration(500)
               .style("opacity", 0);
      });
Run Code Online (Sandbox Code Playgroud)

我需要更改圆的附加和属性。我想使用条件所以

    .attr("d", function(d,i) {if (d["Cereal Name"] == "Nabisco" return d3.svg.symbol().type("circle"); 
else if (d["Cereal Name"] == "Post" return …
Run Code Online (Sandbox Code Playgroud)

html javascript scatter-plot d3.js

3
推荐指数
1
解决办法
5331
查看次数

标签 统计

d3.js ×1

html ×1

javascript ×1

scatter-plot ×1