Skip to content
Converts an SVG file with added geo-referencing tags into one or more GeoJSON files.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
bin
lib
.gitignore
LICENSE
README.md
package-lock.json
package.json

README.md

SVG 2 GeoJSON

Converts an SVG file with added geo-referencing tags into one or more GeoJSON files.

Installing

npm install svg2geojson

Geo-Referencing Tags

You must place two GeoItems inside a Prognoz MetaInfo element as a direct child of the <svg> element at the root of your document.

<MetaInfo xmlns="http://www.prognoz.ru"><Geo>
  <GeoItem X="-595.30" Y="-142.88" Latitude="37.375593" Longitude="-121.977795"/>
  <GeoItem X="1388.66" Y=" 622.34" Latitude="37.369930" Longitude="-121.959404"/>
</Geo></MetaInfo>

These map opposing X/Y corners in your SVG coordinate space to Longitude/Latitude coordinates on the world. Note that the SVG coordinate space has Y increasing down (toward the south), while Latitude increases upwards (towards the north).

Usage

Running the binary from the command line:

$ npm install -g svg2geojson
$ svg2geojson file.svg          # Writes file.geojson
$ svg2geojson file.svg --layers # Writes file.geojson, file-layer1Name.geojson, …
# See svg2geojson --help for more parameters

Running as a Node.js library:

const { geoFromSVGFile, geoFromSVGXML } = require('svg2geojson.js');

// …reading from file on disk
geoFromSVGFile( 'my.svg', layers => {
	layers.forEach( layer => {
		let json = JSON.stringify(layer.geo); // Turn JS object into JSON string
		console.log(`Layer Named: "${layer.name}"`);
		console.log(json);
	});
}, {layers:true, tolerance:0.5} );

// …processing SVG code as a string
const svg = `<svg xmlns="http://www.w3.org/2000/svg"><!-- ... --></svg>`;
geoFromSVGXML( svg, layer => {
	let json = JSON.stringify(layer.geo); // Turn JS object into JSON string
	console.log(json);
} );

See the output of svg2geojson --help for the options you can pass to the functions, and their default values.

Preparing Paths

SVG allows <path> elements with an arbitrary number of overlapping subpaths, with some of them being 'positive' space and some 'negative' space. In SVG these subpaths may be oriented clockwise or counter-clockwise, and added in any order.

GeoJSON only allows a Polygon to have a single 'positive' subpath (and an arbitrary number of additional 'hole' subpaths). To make it easier for the code to detect which subpath is the 'positive' subpath you must currently:

  1. Have only one positive subpath per <path>.
  2. Ensure that the positive subpath is the first subpath in a <path>.

TODO (AKA Known Limitations)

  • Support modes of projection unmapping
  • Support non-rectangular, inverse bilinear unmappings
  • Add more command-line options to control JSON formatting.
  • Treat <g> as MultiPolygon, GeometryCollection, or MultiLineString as appropriate. Currently items within a group are flattened as individual Feature items in the GeoJSON.
  • Treat <path> with multiple positive subpaths as a MultiPolygon. (This requires figuring out which holes apply to which positive subpaths.)
You can’t perform that action at this time.