Преобразуйте GeoJSON в SVG с помощью Javascript

Question

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

Answer 1

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

Включите d3.js в ваш HTML-файл

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

Предполагается, что в вашем html-файле есть div с id map:

<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);

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

Answer 2

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

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

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

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

Answer 3

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

См .: http://www.gdal.org/ogr/ogr_formats.html