Карта с d3.js и TopoJSON, прогноз Albers Siberia

Я пытаюсь сделать Choropleth с d3.js, но я застрял только в начале. Я нашел Shapefile и сгенерировал файлы GeoJSON и TopoJson, как и here. На карте используется прогноз Альберса-Сибири. То, что я нашел об этой проекции:Карта с d3.js и TopoJSON, прогноз Albers Siberia

проекционные: Равновеликая-коническая

Единицы измерения: метры
Spheroid: Красовский
Центральный меридиан: 105
Standard Parallel 1: 52
Стандартная параллель 2: 64
Локатура: 0
Ложные Easting: 18500000
Ложные Абсцисса: 0

proj.4 + Рго = AEA + lat_1 = 52 + 64 = lat_2 + lat_0 = 0 + lon_0 = 105 + x_0 = 18500000 + y_0 = 0 + ellps = krass + units = m + towgs84 = 28, -130, -95,0,0,0,0 + no_defs

MapInfo: «Альберс-Сибирь», 9, 1001, 7, 105, 0, 64, 52, 18500000, 0.

Итак, я получил этот код и не делал ничего (и даже замораживал), что случилось?

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Choropleth</title> 
    <script type="text/javascript" src="d3/d3.v3.js"></script> 
    <script type="text/javascript" src="d3/queue.v1.min.js"></script> 
    <script type="text/javascript" src="d3/topojson.v0.min.js"></script> 
</head> 
<body> 
    <h1>My Choropleth</h1> 
    <script type="text/javascript"> 

     var width = 960, 
      height = 500; 

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

     var pr = d3.geo.albers() 
      .center([105,0]) 
      .parallels([52, 64]) 
      .scale(1000); 


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

     d3.json("map_rus_topo.json", function(error, map) { 
     svg.append("path") 
      .datum(topojson.object(map, map.objects.map_rus)) 
      .attr("d", path); 
     }); 

    </script> 
</body>

Вы можете найти все файлы в формате JSON here.
И еще один вопрос: как я могу ссылаться на значение регион поле в мой файл TopoJson.

источник

2013-04-18 KoGor

Что именно происходит при запуске кода? Вы получаете какое-то сообщение об ошибке, вывод? –

Нет, никаких ошибок в консоли. – KoGor

Размер файлов JSON может быть проблемой. Вы пробовали упростить их или просто ждать немного дольше? –

Первая проблема заключается в том, что ваш файл GeoJSON не находится в градусах [долгота °, широта °], иначе известный как EPSG:4326 or WGS 84. Чтобы преобразовать ваш файл GeoJSON в WGS 84, вам сначала нужно создать файл проецирования, скажем albers.prj, чтобы вы могли указать OGR, что такое проекция источника.

+proj=aea +lat_1=52 +lat_2=64 +lat_0=0 +lon_0=105 +x_0=18500000 +y_0=0 +ellps=krass +units=m +towgs84=28,-130,-95,0,0,0,0 +no_defs

Затем «unproject» файл GeoJSON путем преобразования его в WGS 84:

ogr2ogr -f GeoJSON -s_srs albers.prj -t_srs EPSG:4326 map_rus_wgs84_geo.json map_rus_geo.json

Теперь вы можете конвертировать в TopoJSON в WGS 84, а не прогнозируемых координат. Я также взял на себя смелость сделать некоторые упрощения:

topojson -o map_rus_wgs84_topo.json -s 1e-7 -- russia=map_rus_wgs84_geo.json

Вторая проблема заключается в том, что ваше определение проекции в D3 неверен. Проецирование d3.geo.albers имеет поворот и центр по умолчанию, предназначенный для карты с центром в США. Таким образом, помимо определения центра вам также необходимо переопределить поворот по умолчанию. Фактически, проекционный параметр + lon_0 (центральный меридиан) отображается на вращение проекции, а не на центр проекции. Отдает:

var projection = d3.geo.albers() 
    .rotate([-105, 0]) 
    .center([-10, 65]) 
    .parallels([52, 64]) 
    .scale(700) 
    .translate([width/2, height/2]);

(я состряпал с центральным параметром поставить Россию в центр видового экрана Вы можете compute this automatically, если вы предпочитаете..) Теперь вы должны увидеть что-то вроде этого:

Это также возможность работать с проецируются (декартовы) координаты в TopoJSON, а затем определить d3.geo.path с нулевым (идентичности) проекции, но Я оставлю это для отдельного вопроса.

источник

2013-04-18 16:05:38 mbostock

Это просто здорово! Спасибо, за столь быстрый и полный ответ. Я новичок во всем этом, первый раз работаю с картами. – KoGor

Кроме того, вы можете объяснить, пожалуйста, что сделать --russia = в этом коде:> topojson -o map_rus_wgs84_topo.json -s 1e-7 - russia = map_rus_wgs84_geo.json. И я не понимаю, что такое координаты центра, ссылка U дана о масштабах автоматического вычисления и перевода параметров, или я что-то пропустил. – KoGor

Для получения полного объяснения см. Ссылку [Справочная строка по TopoJSON] (https://github.com/mbostock/topojson/wiki/Command-Line-Reference). Выше, я использую '-o', чтобы указать имя выходного файла,' -s', чтобы указать порог упрощения в steradians, а затем входные файлы следуют за разделителем '--'. Есть только один входной файл ('map_rus_wgs84_geo.json'), и с помощью префикса с' russia = ', я могу установить имя объекта в сгенерированной топологии. Вот почему в связанном примере я ссылаюсь на 'russia.objects.russia'. – mbostock

Карта с d3.js и TopoJSON, прогноз Albers Siberia

ответ

Смежные вопросы