Tiny library to manipulate SVG Polygon Points
npm install --save svg-polygon-points
or
yarn add svg-polygon-points
- add – WIP
Bounding Box
– Calculate the bouding box dimensions of a polygonOffset
– Offset the polygonRotate
- Rotates the polygon clockwise- scale - WIP
Start In
– Draw a polygon like HTML canvasFrom Geo JSON
– Transform GeoJSON coords to SVG Polygon's pointsTo Geo JSON
– Returns the respective GeoJSON Array Coords
boundingBox(points)
Get the bounding box
const boundingBox = require('svg-polygon-points').boundingBox;
// or
import { boundingBox } from 'svg-polygon-points';
const points = "28,224 256,224 256,352 128,352"
boundingBox(points)
/*=> {
left: 28,
top: 224,
right: 256,
bottom: 352,
width: 228,
height: 128,
center: {
x: 192,
y: 288
}
}
*/
offset(points, angle, horizontalOffset, verticalOffset)
Offsets the polygon points
const offset = require('svg-polygon-points').offset;
// or
import { offset } from 'svg-polygon-points';
const points = "0,0 128,0 128,128 0,128"
offset(points, 100, 50)
//=> "100,50 228,50 228,178 100,178"
rotate(points, angle, [center])
Rotates the polygon clockwise
const rotate = require('svg-polygon-points').rotate;
// or
import { rotate } from 'svg-polygon-points';
const points = "0,0 48,0 48,64 96,64 96,128 0,128"
rotate(points, 90)
//=> "112,16 112,64 48,64 48,112 -16,112 -16,16"
startIn(coord)
Creates a Draw Object
- drawTo({ direction, length })
- toPoints()
const startIn = require('svg-polygon-points').startIn;
// or
import { startIn } from 'svg-polygon-points';
const points = startIn({ x: 50, y: 50 })
.drawTo({ direction: 'right', length: 150 })
.drawTo({ direction: 'down', length: 150 })
.drawTo({ direction: 'right', length: 150 })
.drawTo({ direction: 'down', length: 150 })
.drawTo({ direction: 'left', length: 150 })
.toPoints()
//=> "50,50 200,50 200,200 350,200 350,350 50,350"
fromGeoJSON(points)
Transform GeoJSON coords to SVG Polygon's points
const fromGeoJSON = require('svg-polygon-points').fromGeoJSON;
// or
import { fromGeoJSON } from 'svg-polygon-points';
const coords = "[ [[100,50], [228,50], [228,178], [100,178]] ]"
fromGeoJSON(coords)
//=> "100,50 228,50 228,178 100,178"
toGeoJSON(points)
Returns the respective GeoJSON Array Coords
const toGeoJSON = require('svg-polygon-points').toGeoJSON;
// or
import { toGeoJSON } from 'svg-polygon-points';
const points = "0,0 128,0 128,128 0,128"
toGeoJSON(points)
//=> [ [[100,50], [228,50], [228,178], [100,178]] ]
MIT © Diego Jara