Get started with shpjs CDN

MIT licensed

Shpjs is a library for reading, writing, and manipulating ESRI Shapefile data.

Tags:
  • shpjs
  • shapefile

Stable version

Copied!

How to start using shpjs CDN


// Include the shpjs library from the CDN
const shp = require('shpjs/shp.min');

// Define the GeoJSON data
const geojson = {
  type: 'FeatureCollection',
  features: [
    {
      type: 'Feature',
      geometry: {
        type: 'Polygon',
        coordinates: [
          [
            [10, 10],
            [15, 10],
            [15, 12],
            [10, 12],
            [10, 10]
          ]
        ]
      },
      properties: { name: 'My Polygon' }
    }
  ]
};

// Parse the GeoJSON data
const parsedGeojson = shp.parse(geojson);

// Create an SVG element to display the shape
const svgNS = 'http://www.w3.org/2000/svg';
const svg = document.createElementNS(svgNS, 'svg');
svg.setAttribute('width', '200');
svg.setAttribute('height', '200');
document.body.appendChild(svg);

// Project the geometry to the SVG plane
const projectPoint = shp.projection.mercatorProjectPoint;
const projectedPoints = shp.geometry.project(parsedGeojson.features[0].geometry, projectPoint);

// Create an SVG path element for the shape
const path = document.createElementNS(svgNS, 'path');
path.setAttribute('d', shp.geometry.svgPath(parsedGeojson.features[0].geometry, projectedPoints[0], parsedGeojson.features[0].geometry.type));
path.setAttribute('stroke', 'black');
path.setAttribute('fill', 'none');
svg.appendChild(path);
Copied!
Copied!
Copied!
Copied!

All versions