在一个文件中使用不同图层的 shapefile 格式创建一个全新的世界
Creating a whole new world with shapefile format of different layers in one file
我想创建一个新的世界地图并使用 D3.js 和 topojson 如果可能的话QGIS。所以最后我需要一个包含国家、河流等的 shapefile。创建所有这些层后,我希望该文件由 mapshaper 转换,以便结果是 topojson。到目前为止一切顺利。
我用一个简单的多边形试了一下,所以它只有一层。我创建了 shapefile 并将其转换为 topojson。现在我想将该文件与 d3:
一起使用
{"type":"Topology","transform":{"scale":[0.8423423423423423,0.808252427184466],"translate":[1491.6423611111095,-3184.7916666666715]},"objects":{"country":{"type":"GeometryCollection","geometries":[{"type":"LineString","arcs":[0]}]}},"arcs":[[[437,17],[-7,87],[69,64],[23,74],[-31,80],[-14,54],[19,69],[-9,18],[-45,-35],[-53,-32],[-33,-12],[-26,-38],[-26,-27],[-29,-15],[-54,-12],[-29,22],[-40,27],[-31,10],[-36,35],[-2,30],[-17,57],[-14,19],[-19,28],[-31,62],[-2,47],[7,39],[17,40],[28,57],[119,37],[180,22],[247,-2],[105,-109],[78,-122],[52,-96],[55,-176],[-12,-109],[-47,-69],[-60,-77],[-104,-57],[-181,-7],[-49,30]]]}
这只是一个多边形,没错。这是我的 d3 代码:
var width = 960,
height = 500;
var path = d3.geo.path();
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
d3.json("file.json", function(error, topology) {
console.clear();
var featureCollection = topojson.feature(topology, topology.objects.country);
var bounds = d3.geo.bounds(featureCollection);
var centerX = d3.sum(bounds, function(d) {return d[0];}) / 2,
centerY = d3.sum(bounds, function(d) {return d[1];}) / 2;
var projection = d3.geo.mercator()
.scale(3000)
.center([centerX, centerY]);
path.projection(projection);
svg.selectAll("path")
.data(featureCollection.features)
.enter().append("path")
.attr("d", path);
});
但我总是得到 "TypeError: t is undefined"。但是,如果我使用来自其他人的 json 文件,它就可以工作。那么如何才能得到这个小例子运行呢?我的 QGIS 是在窃听还是我用错了?谢谢
或者您是否知道更好的解决方法?
简单删除
.scale(3000)
.center([centerX, centerY])
它应该可以工作。或对其进行编辑以更正值。
我想创建一个新的世界地图并使用 D3.js 和 topojson 如果可能的话QGIS。所以最后我需要一个包含国家、河流等的 shapefile。创建所有这些层后,我希望该文件由 mapshaper 转换,以便结果是 topojson。到目前为止一切顺利。
我用一个简单的多边形试了一下,所以它只有一层。我创建了 shapefile 并将其转换为 topojson。现在我想将该文件与 d3:
一起使用{"type":"Topology","transform":{"scale":[0.8423423423423423,0.808252427184466],"translate":[1491.6423611111095,-3184.7916666666715]},"objects":{"country":{"type":"GeometryCollection","geometries":[{"type":"LineString","arcs":[0]}]}},"arcs":[[[437,17],[-7,87],[69,64],[23,74],[-31,80],[-14,54],[19,69],[-9,18],[-45,-35],[-53,-32],[-33,-12],[-26,-38],[-26,-27],[-29,-15],[-54,-12],[-29,22],[-40,27],[-31,10],[-36,35],[-2,30],[-17,57],[-14,19],[-19,28],[-31,62],[-2,47],[7,39],[17,40],[28,57],[119,37],[180,22],[247,-2],[105,-109],[78,-122],[52,-96],[55,-176],[-12,-109],[-47,-69],[-60,-77],[-104,-57],[-181,-7],[-49,30]]]}
这只是一个多边形,没错。这是我的 d3 代码:
var width = 960,
height = 500;
var path = d3.geo.path();
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
d3.json("file.json", function(error, topology) {
console.clear();
var featureCollection = topojson.feature(topology, topology.objects.country);
var bounds = d3.geo.bounds(featureCollection);
var centerX = d3.sum(bounds, function(d) {return d[0];}) / 2,
centerY = d3.sum(bounds, function(d) {return d[1];}) / 2;
var projection = d3.geo.mercator()
.scale(3000)
.center([centerX, centerY]);
path.projection(projection);
svg.selectAll("path")
.data(featureCollection.features)
.enter().append("path")
.attr("d", path);
});
但我总是得到 "TypeError: t is undefined"。但是,如果我使用来自其他人的 json 文件,它就可以工作。那么如何才能得到这个小例子运行呢?我的 QGIS 是在窃听还是我用错了?谢谢
或者您是否知道更好的解决方法?
简单删除
.scale(3000)
.center([centerX, centerY])
它应该可以工作。或对其进行编辑以更正值。