我想在我使用图像的地图上基于名为 tree.csv 的 csv 文件中的经度和纬度在地图上绘制。
我的 csv 文件包含很多行,所以我只在这里放一些行
经度和纬度
37.7295482207565 122.392689419827
37.8030467266869 122.425063628702
......
这是我的代码
d3.csv("/trees.csv", function(data) {
dataset=data.map(function(d) { return [+d["Longitude"],+d["Latitude"] ];});
console.log(data)
var width = 750,
height = width;
// Set up projection that map is using
var projection = d3.geo.mercator()
.center([-122.433701, 37.767683])
.scale(225000)
.translate([width / 2, height / 2]);
var path=d3.geo.path().projection(projection);
var svgContainer=d3.select("body").append("svg")
.attr("width",width)
.attr("height",height);
svgContainer.append("image")
.attr("width", width)
.attr("height", height)
.attr("xlink:href", "/Ilu.svg");
var trees=svgContainer.selectAll("circles")
.data(data).enter()
.append("circles")
var treesAttributes=trees
.attr("cx",function(d) { return projection(d["Longitude"])[0];})
.attr("cy",function(d) { return projection(d["Latitude"])[1];})
.attr("r","100px")
.style("fill","red");
我可以看到我的地图,但我看不到地图上的任何点。当我检查网络时。我看到 cx 是 Nan 数,cy 是相同的数。我想也许我的数组还没有被读取。但我不确定这些问题。我已经被困住了。你们能帮我解决这个问题吗?谢谢