我想绘制数据来自单个 topoJSON 文件的多个国家/地区。带有这些国家的地图应位于屏幕中间(居中),并应设置适当的比例,使地图填满整个窗口。我已经尝试过的:要获得path.bounds(d)每个国家/地区的边界框并分别使用每一侧(顶部、左侧、底部、右侧)的最大值和最小值,并提供从path.centroid(d)到的平均中心projection.center()。这没有用。应用projection.fitExtent([[x0,y0],[x1,y1]],geojsonObject)或projection.fitSize([width,height],geojsonObject)按照此解决方案中的建议。在这里,我无法按照描述创建 featureCollection 并使用它来创建地图。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="https://d3js.org/d3.v5.min.js"></script> <script src="https://d3js.org/topojson.v2.min.js"></script> <style type="text/css"> .svg-container { display: inline-block; position: relative; width: 100%; padding-bottom: 100%; vertical-align: top; overflow: hidden; } .svg-content { display: inline-block; position: absolute; margin: 0; top: 50%; left: 50%; transform: translate(-50%, -50%); } </style> </head> <body> <div id="container" class="svg-container"> </div> <script type="text/javascript"> var width = 600; //for simplicity set to fixed value var height = 600; //for simplicity set to fixed value var projection = d3.geoMercator(); var path = d3.geoPath() .projection(projection); var svg = d3.select("#container").append("svg") .classed("svg-content", true) .attr("width", width) .attr("height", height);我认为应该可以通过 Andrew Reid 在这篇文章中提供的建议使用fitSize或来解决这个问题fitExtent。但是我无法将其应用于我的问题。这也是我解决问题的首选方式。或者,是否可以用center()和解决这个问题scale()?我将如何确定我必须提供的坐标center()和值scale()。?非常感谢您的帮助,我尝试了几天但没有成功。
添加回答
举报
0/150
提交
取消