1

我正在尝试使用 topojson 文件在 d3.js 中创建尼泊尔的交互式地图。我已经能够使用 d3.geo.albers() 投影来做到这一点。我在下面给出的代码。

<!DOCTYPE html>
<meta charset="utf-8">
<style>

.feature {
  fill: #ccc;
}

</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script>

var width = 960,
    height = 500;

var projection = d3.geo.albers()
    .center([86, 28])
    .rotate([4.4, 0])
    .parallels([27, 32]);

var path = d3.geo.path()
    .projection(projection);

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);

d3.json("data/nepal3.json", function(error, npl) {
    var districts = topojson.feature(npl, npl.objects.nepal_districts);

    projection
      .scale(1)
      .translate([0, 0]);

    var b = path.bounds(districts),
      s = .95 / Math.max((b[1][0] - b[0][0]) / width, (b[1][1] - b[0][2]) / height),
      t = [(width - s * (b[1][0] + b[0][0])) / 2, (height - s * (b[1][3] + b[0][4])) / 2];

    projection
      .scale(s)
      .translate(t);

    svg.append("path")
      .datum(districts)
      .attr("class", "feature")
      .attr("d", path);   
});

我得到的地图不是我想要的。它的投影方式与尼泊尔标准地图的外观相比是错误的。

它看起来像这样,而不是通常的投影

我在这里做错了什么?还有其他更适合尼泊尔统筹的预测吗?

4

1 回答 1

0

看起来您将投影旋转到错误的方向,即从另一侧透过地球看尼泊尔。如果将其旋转 180 度,它应该可以正常工作,即

.rotate([184.4,0])
于 2013-11-16T12:38:27.063 回答