Отрисовка только части карты топожсона с использованием D3.js

Я использую библиотеку D3.js для создания карт из шейп-файлов переписи населения США. Я хочу создать полную карту США, что не проблема, и карту для каждого штата.

В моем рабочем процессе используются данные переписи, измененные по мере необходимости ogr2ogr в командной строке, а затем преобразованные в topojson или geojson с помощью shpescape.com из-за ошибок при загрузке node.js модуля topojson (см. ниже отредактированное решение для этого конкретного случая). проблема).

Мой вопрос скорее ПРАКТИЧЕСКИЙ, чем какой-либо другой, когда представлен этот код (по образцу http://bl.ocks.org/mbostock/4707858):

            var width = 640,
                height = 500;

            var projection = d3.geo.albers();

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

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

            d3.json("mt_geo.json", function(error, mt_topo) {
                var states = topojson.feature(mt_topo, mt_topo.objects.states),
                    state = states.features.filter(function(d) { return d.id === 34; })[0];
                projection
                    .scale(1)
                    .translate([0,0]);
                var b = path.bounds(state),
                    s = .95 / Math.max ((b[1][0]-b[0][0])/width, (b[1][1]-b[0][1])/height),
                    t = [(width-s*(b[1][0]+b[0][0]))/2, (height-s*(b[1][1]+b[0][1]))/2];
                projection
                    .scale(s)
                    .translate(t);
                svg.append("path")
                    .datum(states)
                    .attr("class", "feature")
                    .attr("d", path);
                svg.append("path")
                    .datum(topojson.mesh(us, us.objects.states,function(a, b) {return a !== b;}))
                    .attr("d", path);
                svg.append("path")
                    .datum(state)
                    .attr("class", "outline")
                    .attr("d", path);

Мало того, что он выдает ошибку в строке «varstates», которая говорит «невозможно прочитать тип свойства undefined», но я также понятия не имею, что я должен передавать в анонимную функцию или что mt_topo.objects .states должен ссылаться на. Нет хорошей документации по такого рода ГИС. Все ли карты переписи населения имеют признаки «государства»? Вы теряете эту информацию, когда сжимаете .shp в topojson?

Просто, если d3.json принимает (объект, функция (ошибка, json)), как будет выглядеть пример того, что на самом деле работает?

РЕДАКТИРОВАТЬ: ВРЕМЕННОЕ РЕШЕНИЕ И ИДИОСИНКРАЗИИ WINDOWS 7 -----

В большинстве руководств вам предлагается использовать модуль из node.js, но я работаю в Windows7, и каноническая командная строка «npm install -g topojson» не работает «в контексте». Создатель прислал мне прекрасную ссылку для решения указанной проблемы.

Это важно, потому что в командной строке для topojson есть флаг, в котором можно упаковать существующие фичи в geojson в доступный объект в topojson. Например, приведенный выше код использует «состояния» в topojson — что-то бессмысленное и недоступное, если вы не используете следующую команду:

topojson -o us.topojson -- states=us_states.json

Пробел между двойным дефисом и состояниями важен. Затем вы можете получить доступ к состояниям через us.objects.states, как показано в исходном коде выше.


person kgilvi3    schedule 16.09.2013    source источник
comment
Вы ознакомились с руководством? Атрибуты зависят от того, что содержится в данных, то есть они полностью определяются пользователем.   -  person Lars Kotthoff    schedule 16.09.2013
comment
@LarsKotthoff - да, я довольно подробно прочитал учебник. Думаю, я разобрался с проблемами масштаба; как вы сказали, это исключительно заполнитель. Моя первоначальная проблема становится яснее. Спасибо за вашу помощь.   -  person kgilvi3    schedule 17.09.2013
comment
@kgilvi3: если вы нашли способ обойти это, поделитесь ответом, мы будем рады +1.   -  person Hugolpz    schedule 17.09.2013


Ответы (2)


Вы очень близко. Без тестирования вашего кода я вижу одну серьезную проблему. Второй параметр обратного вызова JSON — mt_topo, который вы используете при определении

var states = topojson.feature(mt_topo, mt_topo.objects.states)

Однако позже вы используете us в качестве объекта обратного вызова, по-видимому, потому, что это то, что Майк Босток использовал в приведенном вами примере. Вместо этого должно быть так:

svg.append("path")
 .datum(topojson.mesh(mt_topo, mt_topo.objects.states,function(a, b) {return a !== b;}))
 .attr("d", path);

Тем не менее, ваш вопрос действительно касается того, есть ли на картах переписи функция «состояния». Я предполагаю, что любая геометрия, которую вы используете, не имеет функции состояний, и поэтому вы получаете сообщение об ошибке. При использовании инструмента командной строки topojson имя функции (например, data.objects.x) обычно совпадает с именем входного файла, поэтому, если ваш файл был US_Census_2010.shp, вы хотели бы определить состояния как

var states = topojson.feature(mt_topo, mt_topo.objects.US_Census_2010)

Откройте файл mt_geo.json и посмотрите, как называются ваши функции. Надеюсь, это поможет!

person jczaplew    schedule 17.09.2013
comment
Поскольку я потратил на это некоторое время, я думаю, что стоит все это записать: @jczaplew, вы определенно правы. Я добавляю то, что было изначально здесь, к ответу в качестве обходного пути. - person kgilvi3; 17.09.2013

Файл GeoJSON, представляющий карту, обычно содержит один или несколько объектов. Каждая функция может иметь ноль или более свойств. Как правило, свойства используются для хранения метаданных мест (название штата, округа и т. д.). Вы можете прочитать свой файл GeoJSON и посмотреть, какие у него есть свойства, и использовать эти свойства для отображения или скрытия функций.

При преобразовании файла из GeoJSON в TopoJSON вы можете сохранить или удалить исходные свойства. Например, функции и точки в файле uk.json из руководства Давайте составим карту имеет свойство name.

person Pablo Navarro    schedule 17.09.2013