Transformar GeoJSON a SVG con Javascript

Question

¿Hay un plugin de Javascript listo para usar que configure una cadena GeoJSON en una cadena SVG? Un motor de renderizado, como Tempo, o el proyecto JsonT sería útil, pero necesito la plantilla para que funcione.

Answer 1

Puede mirar en GDAL, no estoy seguro si es totalmente compatible con la creación de SVG, pero GDAL generalmente puede convertir todos los formatos geo en otros geoformatos.

Ver: http://www.gdal.org/ogr/ogr_formats.html

Answer 2

Puede utilizar d3.js biblioteca. Siguiente fragmento de código hará el trabajo:

Incluir d3.js en su archivo html

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

Suponiendo, que ha div con mapa ID en el archivo html:

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

siguiente código js agregará un mapa a su mapa div. geoJsonObj es tu geojson.

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

Para ver un ejemplo de trabajo, vaya here. Tenga en cuenta que el ejemplo usa topojson como entrada para el atributo .data().

Answer 3

Hay una herramienta básica disponible para convertir geojson a svg geojson2svg y como npm module también. El resultado de geojson2svg es svg string, por lo que esta herramienta se puede usar tanto en el navegador como en node.js.

Es muy fácil de encubrir cadena svg al elemento dom. Esto ha sido explicado por bobincehere muy bien con código JavaScript. He hecho un npm module por conveniencia.

geojson2svg le ofrece más flexibilidad, pero para una solución rápida d3 es lo mejor.

Descargo de responsabilidad: soy el autor de geojson2svg.