为CSV D3.js的每一行生成圆圈
我正在尝试读取CSV,并使用d3.js为每一行生成一个圆圈 [我不想使用回调函数,但这是另一个问题。] 我能够为以下每行数据创建一个表: 但我似乎无法为每条线生成一个圆:为CSV D3.js的每一行生成圆圈,d3.js,geometry,labels,D3.js,Geometry,Labels,我正在尝试读取CSV,并使用d3.js为每一行生成一个圆圈 [我不想使用回调函数,但这是另一个问题。] 我能够为以下每行数据创建一个表: 但我似乎无法为每条线生成一个圆: d3.text("test.csv", function(datasetText) { var parsedCSV = d3.csv.parseRows(datasetText); var sampleSVG2 = d3.select("#viz") .append("svg") .attr("width"
d3.text("test.csv", function(datasetText) {
var parsedCSV = d3.csv.parseRows(datasetText);
var sampleSVG2 = d3.select("#viz")
.append("svg")
.attr("width", 100)
.attr("height", 100);
sampleSVG2.selectall("circle")
.data(parsedCSV)
.enter().append("circle")
.style("stroke", "gray")
.style("fill", "blue")
这可能不是“正确的”,但它是有效的。通过为每一行和每一个圆调用一个新的svg区域,它工作了
var sampleSVG = d3.select("#potato")
.data(parsedCSV)
.enter().append("circle")
.append("svg")
.attr("width", 100)
.attr("height", 100);
sampleSVG.append("circle")
.style("stroke", "gray")
.style("fill", "blue")
.attr("r", 40)
.attr("cx", 50)
.attr("cy", 50)
.on("mouseover", function(){d3.select(this).style("fill", "red");})
.on("mouseout", function(){d3.select(this).style("fill", "steelblue");});