时间戳

首页 > 解决方案 > D3地图没有从json文件中显示

javascript - D3地图没有从json文件中显示

问题描述

我正在尝试使用代码显示伦敦地图

 <script type="text/javascript">
    var w = 1400;
    var h = 700;
    var svg = d3.select("div#container").append("svg").attr("preserveAspectRatio", "xMinYMin meet").style("background-color","#c9e8fd")
    .attr("viewBox", "0 0 " + w + " " + h)
    .classed("svg-content", true);
    var projection = d3.geoMercator().translate([w/2, h/2]).scale(2200).center([0,40]);
    var path = d3.geoPath().projection(projection);


var london = d3.json("london.geojson");

Promise.all([london]).then(function(values){    
 // draw map
    svg.selectAll("path")
        .data(values[0].features)
        .enter()
        .append("path")
        .attr("class","borough")
        .attr("d", path)
  });

我的 json 文件的这一部分

{
  "type": "FeatureCollection",
  "crs": {
    "type": "name",
    "properties": {
      "name": "urn:ogc:def:crs:OGC:1.3:CRS84"
    }
  },
  "features": [
    {
      "type": "Feature",
      "id": 0,
      "properties": {
        "id": 1,
        "name": "Kingston upon Thames",
        "code": "E09000021",
        "area_hectares": 3726.117,
        "inner_statistical": 0
      },
      "geometry": {
        "type": "MultiPolygon",
        "coordinates": [
          [
            [
              [-0.330679062942453, 51.3290110106029],
              [-0.330594448736231, 51.3290880398783],
              [-0.330506117851447, 51.3291488295065],

这种情况在伦敦的多个地方都存在。

但是，当我运行它时，它不会显示任何内容或给出任何错误。谁能看到我在这里做错了什么或者我错过了什么？

标签： javascriptjsond3.js

解决方案

推荐阅读