Преобразование GeoJSON в SVG с помощью Javascript

Есть ли готовый к использованию Javascript-плагин, который преобразует строку GeoJSON в строку SVG? Механизм рендеринга, Tempo, или проект JsonT было бы полезно, но мне нужен шаблон, чтобы заставить их работать.

Ответ 1

Вы можете использовать d3.js библиотеку. Следующий фрагмент кода выполнит задание:

Включить d3.js в ваш html файл

<script src="files/d3.v3.min.js"></script>

Предполагая, что у вас есть div с идентификационной картой в вашем html файле:

<div id="map"></div>

Следующий код js добавит карту на вашу карту div. geoJsonObj - ваш геойсон.

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

svg.append("g")
            .selectAll("path")
            .data(geoJsonObj.features)
            .enter().append("path")
            .attr("d", path);

Чтобы увидеть рабочий пример, перейдите здесь. Обратите внимание, что в этом примере используется topojson в качестве входных данных для атрибута .data().

Ответ 2

Имеется базовый инструмент для преобразования geojson в svg geojson2svg и модуль npm. Выходной файл geojson2svg является строкой svg, поэтому этот инструмент можно использовать в браузере, а также с помощью node.js.

Его очень простая скрытая строка svg для элемента dom. Это объясняется bobince здесь очень хорошо с кодом JavaScript. Для удобства я сделал модуль npm.

geojson2svg дает вам больше гибкости, но для быстрого решения d3 лучше всего.

Отказ от ответственности: я являюсь автором geojson2svg.

Ответ 3

Вы можете посмотреть в GDAL, не уверены, полностью ли он поддерживает создание SVG, но GDAL обычно может преобразовывать все геоформаты в другие геоформаты.

Смотрите: http://www.gdal.org/ogr/ogr_formats.html