試圖爲特定地圖配置geojson文件

我正在嘗試配置一張地圖，顯示美國的一些地圖，其中包括加拿大的一些buttom和墨西哥的一些頂部。我做的這www.geojson.io一個基本的拍攝：試圖爲特定地圖配置geojson文件

http://geojson.io/#id=gist:anonymous/b2f65ddc2a28013b0c9c7ecab5d7427f&map=4/39.37/-97.16

我如何使用d3.js瀏覽器的地圖顯示這個？我可以在使用世界110m.json這似乎是一個常用的GeoJSON的文件顯示世界的瀏覽器地圖：

https://gist.githubusercontent.com/mbostock/4090846/raw/d534aba169207548a8a3d670c9c2cc719ff05c47/world-110m.json

下面是我使用的顯示以GeoJSON爲D3代碼瀏覽器地圖：

d3.json("json/world-110m.json", function (error, topology) { 
    if (error) return console.warn(error); 
    g.selectAll("path") 
     .data(topojson.object(topology, topology.objects.countries) 
      .geometries) 
    .enter() 
     .append("path") 
     .attr("d", path) 
});

世界110m.json似乎有很多額外的信息，我不需要，因爲我只需要顯示在我的geojson.io地圖上方拍攝的區域的平面地圖。我是否需要構建我的geojson，更新我的d3代碼或兩者？

來源

2016-09-07 user6806234

我不確定geojson.io正在做什麼，但它返回的geojson（兩個相同的多邊形）似乎與您的選擇無關。

對於什麼是值得的，這裏是從geojson「地圖」：

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script src="http://d3js.org/d3.v3.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <script> 
 
    var geoJson = { 
 
     "type": "FeatureCollection", 
 
     "features": [{ 
 
     "type": "Feature", 
 
     "properties": {}, 
 
     "geometry": { 
 
      "type": "Polygon", 
 
      "coordinates": [ 
 
      [ 
 
       [-129.0234375, 
 
       23.160563309048314 
 
       ], 
 
       [-129.0234375, 
 
       52.53627304145948 
 
       ], 
 
       [-65.302734375, 
 
       52.53627304145948 
 
       ], 
 
       [-65.302734375, 
 
       23.160563309048314 
 
       ], 
 
       [-129.0234375, 
 
       23.160563309048314 
 
       ] 
 
      ] 
 
      ] 
 
     } 
 
     }, { 
 
     "type": "Feature", 
 
     "properties": {}, 
 
     "geometry": { 
 
      "type": "Polygon", 
 
      "coordinates": [ 
 
      [ 
 
       [-129.0234375, 
 
       23.160563309048314 
 
       ], 
 
       [-129.0234375, 
 
       52.53627304145948 
 
       ], 
 
       [-65.302734375, 
 
       52.53627304145948 
 
       ], 
 
       [-65.302734375, 
 
       23.160563309048314 
 
       ], 
 
       [-129.0234375, 
 
       23.160563309048314 
 
       ] 
 
      ] 
 
      ] 
 
     } 
 
     }] 
 
    }; 
 

 

 
    var width = 960, 
 
     height = 600; 
 

 

 
    var projection = d3.geo.albersUsa() 
 
     .scale(500) 
 
     .translate([width/2, height/2]); 
 

 

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

 

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

 
    svg.append("g") 
 
     .selectAll("path") 
 
     .data(geoJson.features) 
 
     .enter().append("path") 
 
     .attr("d", path); 
 
    </script> 
 
</body> 
 

 
</html>

來源

2016-09-07 21:24:56 Mark

對的，我認爲它增加了一個重複的多邊形，當文件被重新打開。不過，在嘗試在我的本地d3應用中運行它之前，我確實刪除了重複的多邊形。在我的本地d3應用程序中運行之前，我還將geojson文件轉換爲topojson。然而，topojson.v0.min.js：由於某種原因返回「無法讀取屬性'的'未定義的類型' – user6806234

我通過刪除我的d3 b/c中的」國家「屬性引用修復了即時錯誤，json文件沒有有一個國家的對象。我想我正在尋找的是一個基本的topojson文件，可以用於我的場景。我可以根據需要調整實施細節。 – user6806234

試圖爲特定地圖配置geojson文件

回答

相關問題