本文介绍了D3地图未呈现澳大利亚topojson文件的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个d3地图未呈现我创建的Australia TopoJSON文件的JSON文件.
I have a JSON file that d3 map is not rendering an Australia TopoJSON file I have created.
相同的代码可以绘制一张美国地图.浏览器检查器中没有错误，并且两个地图在在线可视化站点(如geojson.io)上均可正常显示.
The same code renders an American map just fine. There are no errors in the browser inspector and both maps render fine on online visualisation sites like geojson.io.
我已经提供了指向JSON的链接.
I have provided links to the JSON's.
- 澳大利亚TopoJSON 不适用于我的代码(但适用于geojson. io/#map = 4/-27.97/125.22)
- American TopoJSON 可以使用我的代码
- Australian TopoJSON Does not work with my code (but does work on geojson.io/#map=4/-27.97/125.22 )
- American TopoJSON Does work with my code
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<style>
path {
fill: #ccc;
}
</style>
</head>
<body>
<h1>topojson simplified Australia</h1>
<script>
var width = window.innerWidth,
height = window.innerHeight;
var path = d3.geo.path();
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
d3.json("topo-australia-simplified.json", function(error, topology) {
if (error) throw error;
svg.selectAll("path")
.data(topojson.feature(topology, topology.objects.australia).features)
.enter().append("path")
.attr("d", path);
});
</script>
</body>
</html>推荐答案
问题是您正在使用:
var path = d3.geo.path();
您尚未给出投影:
var projection = d3.geo.mercator()
.scale(500)//scale it up as per your choice.
.translate([-900,0]);//translate as it was scaled up.
var path = d3.geo.path()
.projection(projection);
工作代码此处
这篇关于D3地图未呈现澳大利亚topojson文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！