我正在创建一个特定状态的地图,我一直在尝试使用 d3.js 和 topojson 并创建了一个很棒的地图,但现在我想在地图上添加一个标记。
但是现在我遇到了问题,因为当我添加标记时,有一个 GeoJSON 文件可以将标记添加到生成的地图中,而且我想在按下标记时打开工具提示。
我的地图与此非常相似:http: //bl.ocks.org/mbostock/4699541,我想要的只是通过具有标记地理坐标的 GeoJSON 文件向各州添加标记。
所以地图目前是
预计地图...
我正在创建一个特定状态的地图,我一直在尝试使用 d3.js 和 topojson 并创建了一个很棒的地图,但现在我想在地图上添加一个标记。
但是现在我遇到了问题,因为当我添加标记时,有一个 GeoJSON 文件可以将标记添加到生成的地图中,而且我想在按下标记时打开工具提示。
我的地图与此非常相似:http: //bl.ocks.org/mbostock/4699541,我想要的只是通过具有标记地理坐标的 GeoJSON 文件向各州添加标记。
所以地图目前是
预计地图...
您可以在 json 回调的末尾添加这样的内容:
var marks = [{long: -75, lat: 43},{long: -78, lat: 41},{long: -70, lat: 53}];
svg.selectAll(".mark")
.data(marks)
.enter()
.append("image")
.attr('class','mark')
.attr('width', 20)
.attr('height', 20)
.attr("xlink:href",'https://cdn3.iconfinder.com/data/icons/softwaredemo/PNG/24x24/DrawingPin1_Blue.png')
.attr("transform", d => `translate(${projection([d.long,d.lat])}`);