New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

mapbox-gl-draw-geodesic

Package Overview
Dependencies
Maintainers
1
Versions
17
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

mapbox-gl-draw-geodesic - npm Package Compare versions

Comparing version 2.2.0 to 2.2.1

4

CHANGELOG.md
# Changelog
## 2.2.1
- fix demo library path
## 2.2.0

@@ -4,0 +8,0 @@

168

dist/mapbox-gl-draw-geodesic.cjs.js
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var constants_js = require('@mapbox/mapbox-gl-draw/src/constants.js');

@@ -13,6 +11,3 @@ var createVertex = require('@mapbox/mapbox-gl-draw/src/lib/create_vertex.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
function _interopNamespace(e) {
if (e && e.__esModule) return e;
function _interopNamespaceDefault(e) {
var n = Object.create(null);

@@ -30,13 +25,10 @@ if (e) {

}
n["default"] = e;
n.default = e;
return Object.freeze(n);
}
var createVertex__default = /*#__PURE__*/_interopDefaultLegacy(createVertex);
var hat__default = /*#__PURE__*/_interopDefaultLegacy(hat);
var arc__default = /*#__PURE__*/_interopDefaultLegacy(arc);
var CommonSelectors__namespace = /*#__PURE__*/_interopNamespace(CommonSelectors);
var doubleClickZoom__default = /*#__PURE__*/_interopDefaultLegacy(doubleClickZoom);
var CommonSelectors__namespace = /*#__PURE__*/_interopNamespaceDefault(CommonSelectors);
const modes = { ...constants_js.modes,
const modes = {
...constants_js.modes,
DRAW_CIRCLE: 'draw_circle'

@@ -51,9 +43,7 @@ };

let properties$1 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
if (!(radius > 0)) {
throw new Error('Radius has to be greater then 0');
}
return {
id: hat__default["default"](),
id: hat(),
type: constants_js.geojsonTypes.FEATURE,

@@ -68,6 +58,6 @@ properties: {

coordinates: [[center, center, center, center]] // valid polygon needs 3 vertices
}
};
}
function isCircleByTypeAndProperties(type, properties$1) {

@@ -83,3 +73,2 @@ return type === constants_js.geojsonTypes.POLYGON && typeof properties$1[properties.CIRCLE_RADIUS] === 'number' && properties$1[properties.CIRCLE_RADIUS] > 0;

}
return geojson.geometry.coordinates[0][0];

@@ -91,5 +80,5 @@ }

}
geojson.geometry.coordinates = [[center, center, center, center]]; // valid polygon needs 3 vertices
}
function getCircleRadius(geojson) {

@@ -99,3 +88,2 @@ if (!isCircle(geojson)) {

}
return geojson.properties[properties.CIRCLE_RADIUS];

@@ -107,3 +95,2 @@ }

}
geojson.properties[properties.CIRCLE_RADIUS] = radius;

@@ -115,7 +102,5 @@ }

}
function coordinatePairs(array) {
return array.slice(0, -1).map((value, index) => [value, array[index + 1]]).filter(pair => !coordinatesEqual(pair[0], pair[1]));
}
function createGeodesicLine(coordinates) {

@@ -125,3 +110,3 @@ let steps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 32;

const geodesicSegments = segments.map(segment => {
const greatCircle = new arc__default["default"].GreatCircle({
const greatCircle = new arc.GreatCircle({
x: segment[0][0],

@@ -136,6 +121,7 @@ y: segment[0][1]

}).json();
}); // arc.js returns the line crossing antimeridian split into two MultiLineString segments
});
// arc.js returns the line crossing antimeridian split into two MultiLineString segments
// (the first going towards to antimeridian, the second going away from antimeridian, both in range -180..180 longitude)
// fix Mapbox rendering by merging them together, adding 360 to longitudes on the right side
let worldOffset = 0;

@@ -157,2 +143,3 @@ const geodesicCoordinates = geodesicSegments.map(geodesicSegment => {

// radius used by mapbox-gl, see https://github.com/mapbox/mapbox-gl-js/blob/main/src/geo/lng_lat.js#L11
const DEFAULT_RADIUS = 6371.0088;

@@ -168,7 +155,5 @@ function distance(start, destination) {

const coordinates = [];
for (let i = 0; i < steps; ++i) {
coordinates.push(destinationPoint(center, radius, bearing + 360 * -i / steps));
}
coordinates.push(coordinates[0]);

@@ -180,14 +165,13 @@ return coordinates;

const HANDLE_BEARING = 45;
function isCircleFeature(feature) {
return isCircleByTypeAndProperties(feature.type, feature.properties);
} // returns path with the last coord id subtracted by 1
}
// returns path with the last coord id subtracted by 1
function getMidpointStartCoordPath(path) {
return path.split('.').map((x, i, array) => i === array.length - 1 ? (parseInt(x, 10) - 1).toString() : x).join('.');
} // returns path with the last coord id of a polygon overridden to 0
}
// returns path with the last coord id of a polygon overridden to 0
// see https://github.com/mapbox/mapbox-gl-draw/pull/998
function getMidpointEndCoordPath(feature, path) {

@@ -205,3 +189,2 @@ if (feature.type === constants_js.geojsonTypes.POLYGON || feature.type === constants_js.geojsonTypes.MULTI_POLYGON) {

}
function createGeodesicGeojson(geojson, options) {

@@ -217,3 +200,2 @@ options = {

const feature = options.ctx.store.get(featureId);
if (type === constants_js.geojsonTypes.POINT) {

@@ -235,8 +217,5 @@ if (isCircleFeature(feature)) {

}
} else
/* istanbul ignore else */
if (type.indexOf(constants_js.geojsonTypes.MULTI_PREFIX) === 0) {
} else /* istanbul ignore else */if (type.indexOf(constants_js.geojsonTypes.MULTI_PREFIX) === 0) {
return processMultiGeometry();
}
function isSelectedPath(path) {

@@ -246,6 +225,4 @@ if (!options.selectedPaths) {

}
return options.selectedPaths.indexOf(path) !== -1;
}
function processMidpoint() {

@@ -258,8 +235,11 @@ const coordPath = properties$1.coord_path;

const midCoord = spherical_js.midpoint(startCoord, endCoord);
const geodesicGeojson = { ...geojson,
properties: { ...properties$1,
const geodesicGeojson = {
...geojson,
properties: {
...properties$1,
lng: midCoord[0],
lat: midCoord[1]
},
geometry: { ...geojson.geometry,
geometry: {
...geojson.geometry,
coordinates: midCoord

@@ -270,7 +250,8 @@ }

}
function processLine() {
const geodesicCoordinates = createGeodesicLine(coordinates, options.steps);
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -281,3 +262,2 @@ }

}
function processPolygon() {

@@ -287,4 +267,6 @@ const geodesicCoordinates = coordinates.map(subCoordinates => {

});
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -295,3 +277,2 @@ }

}
function processCircle() {

@@ -303,8 +284,11 @@ const featureGeojson = feature.toGeoJSON();

const geodesicCoordinates = createGeodesicCircle(center, radius, handleBearing, options.steps * 4);
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: [geodesicCoordinates]
}
}; // circle handles
};
// circle handles
if (properties$1.active === constants_js.activeStates.ACTIVE) {

@@ -314,3 +298,3 @@ const handle = destinationPoint(center, radius, handleBearing);

const vertices = points.map((point, i) => {
return createVertex__default["default"](properties$1.id, point, "0.".concat(i), isSelectedPath("0.".concat(i)));
return createVertex(properties$1.id, point, `0.${i}`, isSelectedPath(`0.${i}`));
});

@@ -322,3 +306,2 @@ return [geodesicGeojson, ...vertices];

}
function processMultiGeometry() {

@@ -340,4 +323,6 @@ const subType = type.replace(constants_js.geojsonTypes.MULTI_PREFIX, '');

});
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -351,5 +336,5 @@ }

function patchDrawLineString(DrawLineString) {
const DrawLineStringPatched = { ...DrawLineString
const DrawLineStringPatched = {
...DrawLineString
};
DrawLineStringPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -362,6 +347,4 @@ const displayGeodesic = geojson => {

};
DrawLineString.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawLineStringPatched;

@@ -371,5 +354,5 @@ }

function patchDrawPolygon(DrawPolygon) {
const DrawPolygonPatched = { ...DrawPolygon
const DrawPolygonPatched = {
...DrawPolygon
};
DrawPolygonPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -382,6 +365,4 @@ const displayGeodesic = geojson => {

};
DrawPolygon.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawPolygonPatched;

@@ -394,4 +375,4 @@ }

// First check we've got a map and some context.
if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return; // Now check initial state wasn't false (we leave it disabled if so)
if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
// Now check initial state wasn't false (we leave it disabled if so)
if (!ctx._ctx.store.getInitialConfigValue('dragPan')) return;

@@ -401,18 +382,15 @@ ctx.map.dragPan.enable();

},
disable(ctx) {
setTimeout(() => {
if (!ctx.map || !ctx.map.doubleClickZoom) return; // Always disable here, as it's necessary in some cases.
if (!ctx.map || !ctx.map.doubleClickZoom) return;
// Always disable here, as it's necessary in some cases.
ctx.map.dragPan.disable();
}, 0);
}
};
const DrawCircleGeodesic = {};
DrawCircleGeodesic.onSetup = function (opts) {
this.clearSelectedFeatures();
doubleClickZoom__default["default"].disable(this);
doubleClickZoom.disable(this);
dragPan.disable(this);

@@ -423,6 +401,4 @@ this.updateUIClasses({

this.setActionableState(); // default actionable state is false for all actions
return {};
};
DrawCircleGeodesic.onMouseDown = DrawCircleGeodesic.onTouchStart = function (state, e) {

@@ -434,3 +410,2 @@ const center = [e.lngLat.lng, e.lngLat.lat];

};
DrawCircleGeodesic.onDrag = DrawCircleGeodesic.onTouchMove = function (state, e) {

@@ -448,3 +423,2 @@ if (state.circle) {

};
DrawCircleGeodesic.onMouseUp = DrawCircleGeodesic.onTouchEnd = function (state, e) {

@@ -458,3 +432,2 @@ this.map.fire(constants_js.events.CREATE, {

};
DrawCircleGeodesic.onKeyUp = function (state, e) {

@@ -467,3 +440,2 @@ if (CommonSelectors__namespace.isEscapeKey(e)) {

}
this.changeMode(modes.SIMPLE_SELECT);

@@ -476,3 +448,2 @@ } else if (CommonSelectors__namespace.isEnterKey(e)) {

};
DrawCircleGeodesic.onStop = function () {

@@ -482,7 +453,6 @@ this.updateUIClasses({

});
doubleClickZoom__default["default"].enable(this);
doubleClickZoom.enable(this);
dragPan.enable(this);
this.activateUIButton();
};
DrawCircleGeodesic.toDisplayFeatures = function (state, geojson, display) {

@@ -493,3 +463,2 @@ if (state.circle) {

}
const displayGeodesic = geojson => {

@@ -501,3 +470,2 @@ const geodesicGeojson = createGeodesicGeojson(geojson, {

};
displayGeodesic(geojson);

@@ -507,5 +475,5 @@ };

function patchDrawPoint(DrawPoint) {
const DrawPointPatched = { ...DrawPoint
const DrawPointPatched = {
...DrawPoint
};
DrawPointPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -518,6 +486,4 @@ const displayGeodesic = geojson => {

};
DrawPoint.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawPointPatched;

@@ -527,5 +493,5 @@ }

function patchSimpleSelect(SimpleSelect) {
const SimpleSelectPatched = { ...SimpleSelect
const SimpleSelectPatched = {
...SimpleSelect
};
SimpleSelectPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -538,6 +504,4 @@ const displayGeodesic = geojson => {

};
SimpleSelect.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return SimpleSelectPatched;

@@ -547,8 +511,7 @@ }

function patchDirectSelect(DirectSelect) {
const DirectSelectPatched = { ...DirectSelect
const DirectSelectPatched = {
...DirectSelect
};
DirectSelectPatched.dragVertex = function (state, e, delta) {
const geojson = state.feature.toGeoJSON();
if (isCircle(geojson)) {

@@ -570,3 +533,2 @@ if (state.selectedCoordPaths[0] === '0.1') {

};
DirectSelectPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -580,17 +542,13 @@ const displayGeodesic = geojson => {

};
DirectSelect.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DirectSelectPatched;
}
// copied from https://github.com/mapbox/mapbox-gl-draw-static-mode
const StaticGeodesic = {};
StaticGeodesic.onSetup = function () {
this.setActionableState(); // default actionable state is false for all actions
return {};
};
StaticGeodesic.toDisplayFeatures = function (state, geojson, display) {

@@ -603,3 +561,2 @@ const displayGeodesic = geojson => {

};
displayGeodesic(geojson);

@@ -609,3 +566,4 @@ };

function enable(modes$1) {
return { ...modes$1,
return {
...modes$1,
[modes.DRAW_LINE_STRING]: patchDrawLineString(modes$1[modes.DRAW_LINE_STRING]),

@@ -612,0 +570,0 @@ [modes.DRAW_POLYGON]: patchDrawPolygon(modes$1[modes.DRAW_POLYGON]),

145

dist/mapbox-gl-draw-geodesic.esm.js

@@ -9,3 +9,4 @@ import { modes as modes$1, geojsonTypes, meta, activeStates, cursors, events } from '@mapbox/mapbox-gl-draw/src/constants.js';

const modes = { ...modes$1,
const modes = {
...modes$1,
DRAW_CIRCLE: 'draw_circle'

@@ -20,7 +21,5 @@ };

let properties$1 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
if (!(radius > 0)) {
throw new Error('Radius has to be greater then 0');
}
return {

@@ -37,6 +36,6 @@ id: hat(),

coordinates: [[center, center, center, center]] // valid polygon needs 3 vertices
}
};
}
function isCircleByTypeAndProperties(type, properties$1) {

@@ -52,3 +51,2 @@ return type === geojsonTypes.POLYGON && typeof properties$1[properties.CIRCLE_RADIUS] === 'number' && properties$1[properties.CIRCLE_RADIUS] > 0;

}
return geojson.geometry.coordinates[0][0];

@@ -60,5 +58,5 @@ }

}
geojson.geometry.coordinates = [[center, center, center, center]]; // valid polygon needs 3 vertices
}
function getCircleRadius(geojson) {

@@ -68,3 +66,2 @@ if (!isCircle(geojson)) {

}
return geojson.properties[properties.CIRCLE_RADIUS];

@@ -76,3 +73,2 @@ }

}
geojson.properties[properties.CIRCLE_RADIUS] = radius;

@@ -84,7 +80,5 @@ }

}
function coordinatePairs(array) {
return array.slice(0, -1).map((value, index) => [value, array[index + 1]]).filter(pair => !coordinatesEqual(pair[0], pair[1]));
}
function createGeodesicLine(coordinates) {

@@ -104,6 +98,7 @@ let steps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 32;

}).json();
}); // arc.js returns the line crossing antimeridian split into two MultiLineString segments
});
// arc.js returns the line crossing antimeridian split into two MultiLineString segments
// (the first going towards to antimeridian, the second going away from antimeridian, both in range -180..180 longitude)
// fix Mapbox rendering by merging them together, adding 360 to longitudes on the right side
let worldOffset = 0;

@@ -125,2 +120,3 @@ const geodesicCoordinates = geodesicSegments.map(geodesicSegment => {

// radius used by mapbox-gl, see https://github.com/mapbox/mapbox-gl-js/blob/main/src/geo/lng_lat.js#L11
const DEFAULT_RADIUS = 6371.0088;

@@ -136,7 +132,5 @@ function distance(start, destination) {

const coordinates = [];
for (let i = 0; i < steps; ++i) {
coordinates.push(destinationPoint(center, radius, bearing + 360 * -i / steps));
}
coordinates.push(coordinates[0]);

@@ -148,14 +142,13 @@ return coordinates;

const HANDLE_BEARING = 45;
function isCircleFeature(feature) {
return isCircleByTypeAndProperties(feature.type, feature.properties);
} // returns path with the last coord id subtracted by 1
}
// returns path with the last coord id subtracted by 1
function getMidpointStartCoordPath(path) {
return path.split('.').map((x, i, array) => i === array.length - 1 ? (parseInt(x, 10) - 1).toString() : x).join('.');
} // returns path with the last coord id of a polygon overridden to 0
}
// returns path with the last coord id of a polygon overridden to 0
// see https://github.com/mapbox/mapbox-gl-draw/pull/998
function getMidpointEndCoordPath(feature, path) {

@@ -173,3 +166,2 @@ if (feature.type === geojsonTypes.POLYGON || feature.type === geojsonTypes.MULTI_POLYGON) {

}
function createGeodesicGeojson(geojson, options) {

@@ -185,3 +177,2 @@ options = {

const feature = options.ctx.store.get(featureId);
if (type === geojsonTypes.POINT) {

@@ -203,8 +194,5 @@ if (isCircleFeature(feature)) {

}
} else
/* istanbul ignore else */
if (type.indexOf(geojsonTypes.MULTI_PREFIX) === 0) {
} else /* istanbul ignore else */if (type.indexOf(geojsonTypes.MULTI_PREFIX) === 0) {
return processMultiGeometry();
}
function isSelectedPath(path) {

@@ -214,6 +202,4 @@ if (!options.selectedPaths) {

}
return options.selectedPaths.indexOf(path) !== -1;
}
function processMidpoint() {

@@ -226,8 +212,11 @@ const coordPath = properties$1.coord_path;

const midCoord = midpoint(startCoord, endCoord);
const geodesicGeojson = { ...geojson,
properties: { ...properties$1,
const geodesicGeojson = {
...geojson,
properties: {
...properties$1,
lng: midCoord[0],
lat: midCoord[1]
},
geometry: { ...geojson.geometry,
geometry: {
...geojson.geometry,
coordinates: midCoord

@@ -238,7 +227,8 @@ }

}
function processLine() {
const geodesicCoordinates = createGeodesicLine(coordinates, options.steps);
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -249,3 +239,2 @@ }

}
function processPolygon() {

@@ -255,4 +244,6 @@ const geodesicCoordinates = coordinates.map(subCoordinates => {

});
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -263,3 +254,2 @@ }

}
function processCircle() {

@@ -271,8 +261,11 @@ const featureGeojson = feature.toGeoJSON();

const geodesicCoordinates = createGeodesicCircle(center, radius, handleBearing, options.steps * 4);
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: [geodesicCoordinates]
}
}; // circle handles
};
// circle handles
if (properties$1.active === activeStates.ACTIVE) {

@@ -282,3 +275,3 @@ const handle = destinationPoint(center, radius, handleBearing);

const vertices = points.map((point, i) => {
return createVertex(properties$1.id, point, "0.".concat(i), isSelectedPath("0.".concat(i)));
return createVertex(properties$1.id, point, `0.${i}`, isSelectedPath(`0.${i}`));
});

@@ -290,3 +283,2 @@ return [geodesicGeojson, ...vertices];

}
function processMultiGeometry() {

@@ -308,4 +300,6 @@ const subType = type.replace(geojsonTypes.MULTI_PREFIX, '');

});
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -319,5 +313,5 @@ }

function patchDrawLineString(DrawLineString) {
const DrawLineStringPatched = { ...DrawLineString
const DrawLineStringPatched = {
...DrawLineString
};
DrawLineStringPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -330,6 +324,4 @@ const displayGeodesic = geojson => {

};
DrawLineString.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawLineStringPatched;

@@ -339,5 +331,5 @@ }

function patchDrawPolygon(DrawPolygon) {
const DrawPolygonPatched = { ...DrawPolygon
const DrawPolygonPatched = {
...DrawPolygon
};
DrawPolygonPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -350,6 +342,4 @@ const displayGeodesic = geojson => {

};
DrawPolygon.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawPolygonPatched;

@@ -362,4 +352,4 @@ }

// First check we've got a map and some context.
if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return; // Now check initial state wasn't false (we leave it disabled if so)
if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
// Now check initial state wasn't false (we leave it disabled if so)
if (!ctx._ctx.store.getInitialConfigValue('dragPan')) return;

@@ -369,15 +359,12 @@ ctx.map.dragPan.enable();

},
disable(ctx) {
setTimeout(() => {
if (!ctx.map || !ctx.map.doubleClickZoom) return; // Always disable here, as it's necessary in some cases.
if (!ctx.map || !ctx.map.doubleClickZoom) return;
// Always disable here, as it's necessary in some cases.
ctx.map.dragPan.disable();
}, 0);
}
};
const DrawCircleGeodesic = {};
DrawCircleGeodesic.onSetup = function (opts) {

@@ -391,6 +378,4 @@ this.clearSelectedFeatures();

this.setActionableState(); // default actionable state is false for all actions
return {};
};
DrawCircleGeodesic.onMouseDown = DrawCircleGeodesic.onTouchStart = function (state, e) {

@@ -402,3 +387,2 @@ const center = [e.lngLat.lng, e.lngLat.lat];

};
DrawCircleGeodesic.onDrag = DrawCircleGeodesic.onTouchMove = function (state, e) {

@@ -416,3 +400,2 @@ if (state.circle) {

};
DrawCircleGeodesic.onMouseUp = DrawCircleGeodesic.onTouchEnd = function (state, e) {

@@ -426,3 +409,2 @@ this.map.fire(events.CREATE, {

};
DrawCircleGeodesic.onKeyUp = function (state, e) {

@@ -435,3 +417,2 @@ if (CommonSelectors.isEscapeKey(e)) {

}
this.changeMode(modes.SIMPLE_SELECT);

@@ -444,3 +425,2 @@ } else if (CommonSelectors.isEnterKey(e)) {

};
DrawCircleGeodesic.onStop = function () {

@@ -454,3 +434,2 @@ this.updateUIClasses({

};
DrawCircleGeodesic.toDisplayFeatures = function (state, geojson, display) {

@@ -461,3 +440,2 @@ if (state.circle) {

}
const displayGeodesic = geojson => {

@@ -469,3 +447,2 @@ const geodesicGeojson = createGeodesicGeojson(geojson, {

};
displayGeodesic(geojson);

@@ -475,5 +452,5 @@ };

function patchDrawPoint(DrawPoint) {
const DrawPointPatched = { ...DrawPoint
const DrawPointPatched = {
...DrawPoint
};
DrawPointPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -486,6 +463,4 @@ const displayGeodesic = geojson => {

};
DrawPoint.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawPointPatched;

@@ -495,5 +470,5 @@ }

function patchSimpleSelect(SimpleSelect) {
const SimpleSelectPatched = { ...SimpleSelect
const SimpleSelectPatched = {
...SimpleSelect
};
SimpleSelectPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -506,6 +481,4 @@ const displayGeodesic = geojson => {

};
SimpleSelect.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return SimpleSelectPatched;

@@ -515,8 +488,7 @@ }

function patchDirectSelect(DirectSelect) {
const DirectSelectPatched = { ...DirectSelect
const DirectSelectPatched = {
...DirectSelect
};
DirectSelectPatched.dragVertex = function (state, e, delta) {
const geojson = state.feature.toGeoJSON();
if (isCircle(geojson)) {

@@ -538,3 +510,2 @@ if (state.selectedCoordPaths[0] === '0.1') {

};
DirectSelectPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -548,17 +519,13 @@ const displayGeodesic = geojson => {

};
DirectSelect.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DirectSelectPatched;
}
// copied from https://github.com/mapbox/mapbox-gl-draw-static-mode
const StaticGeodesic = {};
StaticGeodesic.onSetup = function () {
this.setActionableState(); // default actionable state is false for all actions
return {};
};
StaticGeodesic.toDisplayFeatures = function (state, geojson, display) {

@@ -571,3 +538,2 @@ const displayGeodesic = geojson => {

};
displayGeodesic(geojson);

@@ -577,3 +543,4 @@ };

function enable(modes$1) {
return { ...modes$1,
return {
...modes$1,
[modes.DRAW_LINE_STRING]: patchDrawLineString(modes$1[modes.DRAW_LINE_STRING]),

@@ -580,0 +547,0 @@ [modes.DRAW_POLYGON]: patchDrawPolygon(modes$1[modes.DRAW_POLYGON]),

294

dist/mapbox-gl-draw-geodesic.umd.js

@@ -54,3 +54,4 @@ (function (global, factory) {

const modes = { ...modes$1,
const modes = {
...modes$1,
DRAW_CIRCLE: 'draw_circle'

@@ -74,3 +75,2 @@ };

*/
function createVertex (parentId, coordinates, path, selected) {

@@ -92,2 +92,6 @@ return {

function getDefaultExportFromCjs (x) {
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
}
var hat$2 = {exports: {}};

@@ -100,10 +104,7 @@

var digits = Math.log(Math.pow(2, bits)) / Math.log(base);
for (var i = 2; digits === Infinity; i *= 2) {
digits = Math.log(Math.pow(2, bits / i)) / Math.log(base) * i;
}
var rem = digits - Math.floor(digits);
var res = '';
for (var i = 0; i < Math.floor(digits); i++) {

@@ -113,3 +114,2 @@ var x = Math.floor(Math.random() * base).toString(base);

}
if (rem) {

@@ -120,5 +120,3 @@ var b = Math.pow(base, rem);

}
var parsed = parseInt(res, base);
if (parsed !== Infinity && parsed >= Math.pow(2, bits)) {

@@ -128,7 +126,5 @@ return hat(bits, base);

};
hat.rack = function (bits, base, expandBy) {
var fn = function (data) {
var iters = 0;
do {

@@ -138,16 +134,11 @@ if (iters++ > 10) {

}
var id = hat(bits, base);
} while (Object.hasOwnProperty.call(hats, id));
hats[id] = data;
return id;
};
var hats = fn.hats = {};
fn.get = function (id) {
return fn.hats[id];
};
fn.set = function (id, value) {

@@ -157,3 +148,2 @@ fn.hats[id] = value;

};
fn.bits = bits || 128;

@@ -163,12 +153,10 @@ fn.base = base || 16;

};
var hatExports = hat$2.exports;
var hat$1 = /*@__PURE__*/getDefaultExportFromCjs(hatExports);
var hat$1 = hat$2.exports;
function createCircle(center, radius) {
let properties$1 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
if (!(radius > 0)) {
throw new Error('Radius has to be greater then 0');
}
return {

@@ -185,6 +173,6 @@ id: hat$1(),

coordinates: [[center, center, center, center]] // valid polygon needs 3 vertices
}
};
}
function isCircleByTypeAndProperties(type, properties$1) {

@@ -200,3 +188,2 @@ return type === geojsonTypes.POLYGON && typeof properties$1[properties.CIRCLE_RADIUS] === 'number' && properties$1[properties.CIRCLE_RADIUS] > 0;

}
return geojson.geometry.coordinates[0][0];

@@ -208,5 +195,5 @@ }

}
geojson.geometry.coordinates = [[center, center, center, center]]; // valid polygon needs 3 vertices
}
function getCircleRadius(geojson) {

@@ -216,3 +203,2 @@ if (!isCircle(geojson)) {

}
return geojson.properties[properties.CIRCLE_RADIUS];

@@ -224,7 +210,6 @@ }

}
geojson.properties[properties.CIRCLE_RADIUS] = radius;
}
var arc$1 = {exports: {}};
var arc$2 = {exports: {}};

@@ -235,3 +220,2 @@ (function (module) {

var R2D = 180 / Math.PI;
var Coord = function (lon, lat) {

@@ -243,7 +227,15 @@ this.lon = lon;

};
var roundCoords = function (coords) {
// round coordinate decimal values to 6 places
var PRECISION = 6;
var MULTIPLIER = Math.pow(10, PRECISION);
for (var i = 0; i < coords.length; i++) {
// https://stackoverflow.com/questions/11832914/how-to-round-to-at-most-2-decimal-places-if-necessary
coords[i] = Math.round((coords[i] + Number.EPSILON) * MULTIPLIER) / MULTIPLIER;
}
return coords;
};
Coord.prototype.view = function () {
return String(this.lon).slice(0, 4) + ',' + String(this.lat).slice(0, 4);
};
Coord.prototype.antipode = function () {

@@ -254,3 +246,2 @@ var anti_lat = -1 * this.lat;

};
var LineString = function () {

@@ -260,3 +251,2 @@ this.coords = [];

};
LineString.prototype.move_to = function (coord) {

@@ -266,3 +256,2 @@ this.length++;

};
var Arc = function (properties) {

@@ -272,3 +261,2 @@ this.properties = properties || {};

};
Arc.prototype.json = function () {

@@ -295,7 +283,5 @@ if (this.geometries.length <= 0) {

var multiline = [];
for (var i = 0; i < this.geometries.length; i++) {
multiline.push(this.geometries[i].coords);
}
return {

@@ -310,13 +296,11 @@ 'geometry': {

}
}; // TODO - output proper multilinestring
};
// TODO - output proper multilinestring
Arc.prototype.wkt = function () {
var wkt_string = '';
var wkt = 'LINESTRING(';
var collect = function (c) {
wkt += c[0] + ' ' + c[1] + ',';
};
for (var i = 0; i < this.geometries.length; i++) {

@@ -331,5 +315,5 @@ if (this.geometries[i].coords.length === 0) {

}
return wkt_string;
};
/*

@@ -339,4 +323,2 @@ * http://en.wikipedia.org/wiki/Great-circle_distance

*/
var GreatCircle = function (start, end, properties) {

@@ -346,7 +328,5 @@ if (!start || start.x === undefined || start.y === undefined) {

}
if (!end || end.x === undefined || end.y === undefined) {
throw new Error("GreatCircle constructor expects two args: start and end objects with x and y properties");
}
this.start = new Coord(start.x, start.y);

@@ -359,5 +339,4 @@ this.end = new Coord(end.x, end.y);

this.g = 2.0 * Math.asin(Math.sqrt(z));
if (this.g == Math.PI) {
throw new Error('it appears ' + start.view() + ' and ' + end.view() + " are 'antipodal', e.g diametrically opposite, thus there is no single route but rather infinite");
throw new Error('it appears ' + this.start.view() + ' and ' + this.end.view() + " are 'antipodal', e.g diametrically opposite, thus there is no single route but rather infinite");
} else if (isNaN(this.g)) {

@@ -367,7 +346,6 @@ throw new Error('could not calculate great circle between ' + start + ' and ' + end);

};
/*
* http://williams.best.vwh.net/avform.htm#Intermediate
*/
GreatCircle.prototype.interpolate = function (f) {

@@ -383,10 +361,8 @@ var A = Math.sin((1 - f) * this.g) / Math.sin(this.g);

};
/*
* Generate points along the great circle
*/
GreatCircle.prototype.Arc = function (npoints, options) {
var first_pass = [];
if (!npoints || npoints <= 2) {

@@ -397,3 +373,2 @@ first_pass.push([this.start.lon, this.start.lat]);

var delta = 1.0 / (npoints - 1);
for (var i = 0; i < npoints; ++i) {

@@ -409,14 +384,13 @@ var step = delta * i;

*/
var bHasBigDiff = false;
var dfMaxSmallDiffLong = 0; // from http://www.gdal.org/ogr2ogr.html
var dfMaxSmallDiffLong = 0;
// from http://www.gdal.org/ogr2ogr.html
// -datelineoffset:
// (starting with GDAL 1.10) offset from dateline in degrees (default long. = +/- 10deg, geometries within 170deg to -170deg will be splited)
var dfDateLineOffset = options && options.offset ? options.offset : 10;
var dfLeftBorderX = 180 - dfDateLineOffset;
var dfRightBorderX = -180 + dfDateLineOffset;
var dfDiffSpace = 360 - dfDateLineOffset; // https://github.com/OSGeo/gdal/blob/7bfb9c452a59aac958bff0c8386b891edf8154ca/gdal/ogr/ogrgeometryfactory.cpp#L2342
var dfDiffSpace = 360 - dfDateLineOffset;
// https://github.com/OSGeo/gdal/blob/7bfb9c452a59aac958bff0c8386b891edf8154ca/gdal/ogr/ogrgeometryfactory.cpp#L2342
for (var j = 1; j < first_pass.length; ++j) {

@@ -426,3 +400,2 @@ var dfPrevX = first_pass[j - 1][0];

var dfDiffLong = Math.abs(dfX - dfPrevX);
if (dfDiffLong > dfDiffSpace && (dfX > dfLeftBorderX && dfPrevX < dfRightBorderX || dfPrevX > dfLeftBorderX && dfX < dfRightBorderX)) {

@@ -434,12 +407,8 @@ bHasBigDiff = true;

}
var poMulti = [];
if (bHasBigDiff && dfMaxSmallDiffLong < dfDateLineOffset) {
var poNewLS = [];
poMulti.push(poNewLS);
for (var k = 0; k < first_pass.length; ++k) {
var dfX0 = parseFloat(first_pass[k][0]);
if (k > 0 && Math.abs(dfX0 - first_pass[k - 1][0]) > dfDiffSpace) {

@@ -450,3 +419,2 @@ var dfX1 = parseFloat(first_pass[k - 1][0]);

var dfY2 = parseFloat(first_pass[k][1]);
if (dfX1 > -180 && dfX1 < dfRightBorderX && dfX2 == 180 && k + 1 < first_pass.length && first_pass[k - 1][0] > -180 && first_pass[k - 1][0] < dfRightBorderX) {

@@ -463,3 +431,2 @@ poNewLS.push([-180, first_pass[k][1]]);

}
if (dfX1 < dfRightBorderX && dfX2 > dfLeftBorderX) {

@@ -469,4 +436,4 @@ // swap dfX1, dfX2

dfX1 = dfX2;
dfX2 = tmpX; // swap dfY1, dfY2
dfX2 = tmpX;
// swap dfY1, dfY2
var tmpY = dfY1;

@@ -476,7 +443,5 @@ dfY1 = dfY2;

}
if (dfX1 > dfLeftBorderX && dfX2 < dfRightBorderX) {
dfX2 += 360;
}
if (dfX1 <= 180 && dfX2 >= 180 && dfX1 < dfX2) {

@@ -493,3 +458,2 @@ var dfRatio = (180 - dfX1) / (dfX2 - dfX1);

}
poNewLS.push([dfX0, first_pass[k][1]]);

@@ -504,3 +468,2 @@ } else {

poMulti.push(poNewLS0);
for (var l = 0; l < first_pass.length; ++l) {

@@ -510,5 +473,3 @@ poNewLS0.push([first_pass[l][0], first_pass[l][1]]);

}
var arc = new Arc(this.properties);
for (var m = 0; m < poMulti.length; ++m) {

@@ -518,11 +479,8 @@ var line = new LineString();

var points = poMulti[m];
for (var j0 = 0; j0 < points.length; ++j0) {
line.move_to(points[j0]);
line.move_to(roundCoords(points[j0]));
}
}
return arc;
};
{

@@ -534,5 +492,7 @@ // nodejs

}
})(arc$1);
})(arc$2);
var arcExports = arc$2.exports;
var arc = arc$1.exports;
var arc = arcExports;
var arc$1 = /*@__PURE__*/getDefaultExportFromCjs(arc);

@@ -542,7 +502,5 @@ function coordinatesEqual(x, y) {

}
function coordinatePairs(array) {
return array.slice(0, -1).map((value, index) => [value, array[index + 1]]).filter(pair => !coordinatesEqual(pair[0], pair[1]));
}
function createGeodesicLine(coordinates) {

@@ -552,3 +510,3 @@ let steps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 32;

const geodesicSegments = segments.map(segment => {
const greatCircle = new arc.GreatCircle({
const greatCircle = new arc$1.GreatCircle({
x: segment[0][0],

@@ -563,6 +521,7 @@ y: segment[0][1]

}).json();
}); // arc.js returns the line crossing antimeridian split into two MultiLineString segments
});
// arc.js returns the line crossing antimeridian split into two MultiLineString segments
// (the first going towards to antimeridian, the second going away from antimeridian, both in range -180..180 longitude)
// fix Mapbox rendering by merging them together, adding 360 to longitudes on the right side
let worldOffset = 0;

@@ -585,2 +544,3 @@ const geodesicCoordinates = geodesicSegments.map(geodesicSegment => {

const DEFAULT_RADIUS$1 = 6371e3;
/**

@@ -591,3 +551,2 @@ * @param {GeoJSON.Position} position1

*/
function equals(position1, position2) {

@@ -598,2 +557,3 @@ if (Math.abs(position1[0] - position2[0]) > Number.EPSILON) return false;

}
/**

@@ -603,6 +563,6 @@ * @param {number} value

*/
function toRadians(value) {
return value / 180 * Math.PI;
}
/**

@@ -612,3 +572,2 @@ * @param {number} value

*/
function toDegrees(value) {

@@ -642,3 +601,2 @@ return value / Math.PI * 180;

*/
function distance$1(start, destination) {

@@ -649,7 +607,8 @@ let radius = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : DEFAULT_RADIUS$1;

// see mathforum.org/library/drmath/view/51879.html for derivation
const R = radius;
const φ1 = toRadians(start[1]),
λ1 = toRadians(start[0]);
λ1 = toRadians(start[0]);
const φ2 = toRadians(destination[1]),
λ2 = toRadians(destination[0]);
λ2 = toRadians(destination[0]);
const Δφ = φ2 - φ1;

@@ -662,2 +621,3 @@ const Δλ = λ2 - λ1;

}
/**

@@ -675,5 +635,5 @@ * Returns the initial bearing from start point to destination point.

*/
function initialBearing(start, destination) {
if (equals(start, destination)) return NaN; // coincident points
// tanθ = sinΔλ⋅cosφ2 / cosφ1⋅sinφ2 − sinφ1⋅cosφ2⋅cosΔλ

@@ -691,2 +651,3 @@ // see mathforum.org/library/drmath/view/55417.html for derivation

}
/**

@@ -704,3 +665,2 @@ * Returns the midpoint between start point and destination point.

*/
function midpoint(start, destination) {

@@ -710,7 +670,9 @@ // φm = atan2( sinφ1 + sinφ2, √( (cosφ1 + cosφ2⋅cosΔλ)² + cos²φ2⋅sin²Δλ ) )

// midpoint is sum of vectors to two points: mathforum.org/library/drmath/view/51822.html
const φ1 = toRadians(start[1]);
const λ1 = toRadians(start[0]);
const φ2 = toRadians(destination[1]);
const Δλ = toRadians(destination[0] - start[0]); // get cartesian coordinates for the two points
const Δλ = toRadians(destination[0] - start[0]);
// get cartesian coordinates for the two points
const A = {

@@ -721,3 +683,2 @@ x: Math.cos(φ1),

}; // place point A on prime meridian y=0
const B = {

@@ -727,4 +688,5 @@ x: Math.cos(φ2) * Math.cos(Δλ),

z: Math.sin(φ2)
}; // vector to midpoint is sum of vectors to two points (no need to normalise)
};
// vector to midpoint is sum of vectors to two points (no need to normalise)
const C = {

@@ -741,2 +703,3 @@ x: A.x + B.x,

}
/**

@@ -756,3 +719,2 @@ * Returns the destination point from start point having travelled the given distance on the

*/
function destinationPoint$1(start, distance, bearing) {

@@ -763,7 +725,7 @@ let radius = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : DEFAULT_RADIUS$1;

// see mathforum.org/library/drmath/view/52049.html for derivation
const δ = distance / radius; // angular distance in radians
const θ = toRadians(bearing);
const φ1 = toRadians(start[1]),
λ1 = toRadians(start[0]);
λ1 = toRadians(start[0]);
const sinφ2 = Math.sin(φ1) * Math.cos(δ) + Math.cos(φ1) * Math.sin(δ) * Math.cos(θ);

@@ -779,2 +741,3 @@ const φ2 = Math.asin(sinφ2);

// radius used by mapbox-gl, see https://github.com/mapbox/mapbox-gl-js/blob/main/src/geo/lng_lat.js#L11
const DEFAULT_RADIUS = 6371.0088;

@@ -790,7 +753,5 @@ function distance(start, destination) {

const coordinates = [];
for (let i = 0; i < steps; ++i) {
coordinates.push(destinationPoint(center, radius, bearing + 360 * -i / steps));
}
coordinates.push(coordinates[0]);

@@ -802,14 +763,13 @@ return coordinates;

const HANDLE_BEARING = 45;
function isCircleFeature(feature) {
return isCircleByTypeAndProperties(feature.type, feature.properties);
} // returns path with the last coord id subtracted by 1
}
// returns path with the last coord id subtracted by 1
function getMidpointStartCoordPath(path) {
return path.split('.').map((x, i, array) => i === array.length - 1 ? (parseInt(x, 10) - 1).toString() : x).join('.');
} // returns path with the last coord id of a polygon overridden to 0
}
// returns path with the last coord id of a polygon overridden to 0
// see https://github.com/mapbox/mapbox-gl-draw/pull/998
function getMidpointEndCoordPath(feature, path) {

@@ -827,3 +787,2 @@ if (feature.type === geojsonTypes.POLYGON || feature.type === geojsonTypes.MULTI_POLYGON) {

}
function createGeodesicGeojson(geojson, options) {

@@ -839,3 +798,2 @@ options = {

const feature = options.ctx.store.get(featureId);
if (type === geojsonTypes.POINT) {

@@ -857,8 +815,5 @@ if (isCircleFeature(feature)) {

}
} else
/* istanbul ignore else */
if (type.indexOf(geojsonTypes.MULTI_PREFIX) === 0) {
} else /* istanbul ignore else */if (type.indexOf(geojsonTypes.MULTI_PREFIX) === 0) {
return processMultiGeometry();
}
function isSelectedPath(path) {

@@ -868,6 +823,4 @@ if (!options.selectedPaths) {

}
return options.selectedPaths.indexOf(path) !== -1;
}
function processMidpoint() {

@@ -880,8 +833,11 @@ const coordPath = properties$1.coord_path;

const midCoord = midpoint(startCoord, endCoord);
const geodesicGeojson = { ...geojson,
properties: { ...properties$1,
const geodesicGeojson = {
...geojson,
properties: {
...properties$1,
lng: midCoord[0],
lat: midCoord[1]
},
geometry: { ...geojson.geometry,
geometry: {
...geojson.geometry,
coordinates: midCoord

@@ -892,7 +848,8 @@ }

}
function processLine() {
const geodesicCoordinates = createGeodesicLine(coordinates, options.steps);
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -903,3 +860,2 @@ }

}
function processPolygon() {

@@ -909,4 +865,6 @@ const geodesicCoordinates = coordinates.map(subCoordinates => {

});
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -917,3 +875,2 @@ }

}
function processCircle() {

@@ -925,8 +882,11 @@ const featureGeojson = feature.toGeoJSON();

const geodesicCoordinates = createGeodesicCircle(center, radius, handleBearing, options.steps * 4);
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: [geodesicCoordinates]
}
}; // circle handles
};
// circle handles
if (properties$1.active === activeStates.ACTIVE) {

@@ -936,3 +896,3 @@ const handle = destinationPoint(center, radius, handleBearing);

const vertices = points.map((point, i) => {
return createVertex(properties$1.id, point, "0.".concat(i), isSelectedPath("0.".concat(i)));
return createVertex(properties$1.id, point, `0.${i}`, isSelectedPath(`0.${i}`));
});

@@ -944,3 +904,2 @@ return [geodesicGeojson, ...vertices];

}
function processMultiGeometry() {

@@ -962,4 +921,6 @@ const subType = type.replace(geojsonTypes.MULTI_PREFIX, '');

});
const geodesicGeojson = { ...geojson,
geometry: { ...geojson.geometry,
const geodesicGeojson = {
...geojson,
geometry: {
...geojson.geometry,
coordinates: geodesicCoordinates

@@ -973,5 +934,5 @@ }

function patchDrawLineString(DrawLineString) {
const DrawLineStringPatched = { ...DrawLineString
const DrawLineStringPatched = {
...DrawLineString
};
DrawLineStringPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -984,6 +945,4 @@ const displayGeodesic = geojson => {

};
DrawLineString.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawLineStringPatched;

@@ -993,5 +952,5 @@ }

function patchDrawPolygon(DrawPolygon) {
const DrawPolygonPatched = { ...DrawPolygon
const DrawPolygonPatched = {
...DrawPolygon
};
DrawPolygonPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -1004,6 +963,4 @@ const displayGeodesic = geojson => {

};
DrawPolygon.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawPolygonPatched;

@@ -1023,4 +980,4 @@ }

// First check we've got a map and some context.
if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return; // Now check initial state wasn't false (we leave it disabled if so)
if (!ctx.map || !ctx.map.doubleClickZoom || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
// Now check initial state wasn't false (we leave it disabled if so)
if (!ctx._ctx.store.getInitialConfigValue('doubleClickZoom')) return;

@@ -1030,11 +987,9 @@ ctx.map.doubleClickZoom.enable();

},
disable(ctx) {
setTimeout(() => {
if (!ctx.map || !ctx.map.doubleClickZoom) return; // Always disable here, as it's necessary in some cases.
if (!ctx.map || !ctx.map.doubleClickZoom) return;
// Always disable here, as it's necessary in some cases.
ctx.map.doubleClickZoom.disable();
}, 0);
}
};

@@ -1046,4 +1001,4 @@

// First check we've got a map and some context.
if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return; // Now check initial state wasn't false (we leave it disabled if so)
if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue) return;
// Now check initial state wasn't false (we leave it disabled if so)
if (!ctx._ctx.store.getInitialConfigValue('dragPan')) return;

@@ -1053,15 +1008,12 @@ ctx.map.dragPan.enable();

},
disable(ctx) {
setTimeout(() => {
if (!ctx.map || !ctx.map.doubleClickZoom) return; // Always disable here, as it's necessary in some cases.
if (!ctx.map || !ctx.map.doubleClickZoom) return;
// Always disable here, as it's necessary in some cases.
ctx.map.dragPan.disable();
}, 0);
}
};
const DrawCircleGeodesic = {};
DrawCircleGeodesic.onSetup = function (opts) {

@@ -1075,6 +1027,4 @@ this.clearSelectedFeatures();

this.setActionableState(); // default actionable state is false for all actions
return {};
};
DrawCircleGeodesic.onMouseDown = DrawCircleGeodesic.onTouchStart = function (state, e) {

@@ -1086,3 +1036,2 @@ const center = [e.lngLat.lng, e.lngLat.lat];

};
DrawCircleGeodesic.onDrag = DrawCircleGeodesic.onTouchMove = function (state, e) {

@@ -1100,3 +1049,2 @@ if (state.circle) {

};
DrawCircleGeodesic.onMouseUp = DrawCircleGeodesic.onTouchEnd = function (state, e) {

@@ -1110,3 +1058,2 @@ this.map.fire(events.CREATE, {

};
DrawCircleGeodesic.onKeyUp = function (state, e) {

@@ -1119,3 +1066,2 @@ if (isEscapeKey(e)) {

}
this.changeMode(modes.SIMPLE_SELECT);

@@ -1128,3 +1074,2 @@ } else if (isEnterKey(e)) {

};
DrawCircleGeodesic.onStop = function () {

@@ -1138,3 +1083,2 @@ this.updateUIClasses({

};
DrawCircleGeodesic.toDisplayFeatures = function (state, geojson, display) {

@@ -1145,3 +1089,2 @@ if (state.circle) {

}
const displayGeodesic = geojson => {

@@ -1153,3 +1096,2 @@ const geodesicGeojson = createGeodesicGeojson(geojson, {

};
displayGeodesic(geojson);

@@ -1159,5 +1101,5 @@ };

function patchDrawPoint(DrawPoint) {
const DrawPointPatched = { ...DrawPoint
const DrawPointPatched = {
...DrawPoint
};
DrawPointPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -1170,6 +1112,4 @@ const displayGeodesic = geojson => {

};
DrawPoint.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DrawPointPatched;

@@ -1179,5 +1119,5 @@ }

function patchSimpleSelect(SimpleSelect) {
const SimpleSelectPatched = { ...SimpleSelect
const SimpleSelectPatched = {
...SimpleSelect
};
SimpleSelectPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -1190,6 +1130,4 @@ const displayGeodesic = geojson => {

};
SimpleSelect.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return SimpleSelectPatched;

@@ -1199,8 +1137,7 @@ }

function patchDirectSelect(DirectSelect) {
const DirectSelectPatched = { ...DirectSelect
const DirectSelectPatched = {
...DirectSelect
};
DirectSelectPatched.dragVertex = function (state, e, delta) {
const geojson = state.feature.toGeoJSON();
if (isCircle(geojson)) {

@@ -1222,3 +1159,2 @@ if (state.selectedCoordPaths[0] === '0.1') {

};
DirectSelectPatched.toDisplayFeatures = function (state, geojson, display) {

@@ -1232,17 +1168,13 @@ const displayGeodesic = geojson => {

};
DirectSelect.toDisplayFeatures.call(this, state, geojson, displayGeodesic);
};
return DirectSelectPatched;
}
// copied from https://github.com/mapbox/mapbox-gl-draw-static-mode
const StaticGeodesic = {};
StaticGeodesic.onSetup = function () {
this.setActionableState(); // default actionable state is false for all actions
return {};
};
StaticGeodesic.toDisplayFeatures = function (state, geojson, display) {

@@ -1255,3 +1187,2 @@ const displayGeodesic = geojson => {

};
displayGeodesic(geojson);

@@ -1261,3 +1192,4 @@ };

function enable(modes$1) {
return { ...modes$1,
return {
...modes$1,
[modes.DRAW_LINE_STRING]: patchDrawLineString(modes$1[modes.DRAW_LINE_STRING]),

@@ -1282,5 +1214,3 @@ [modes.DRAW_POLYGON]: patchDrawPolygon(modes$1[modes.DRAW_POLYGON]),

Object.defineProperty(exports, '__esModule', { value: true });
}));
//# sourceMappingURL=mapbox-gl-draw-geodesic.umd.js.map

2

dist/mapbox-gl-draw-geodesic.umd.min.js

@@ -1,2 +0,2 @@

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).MapboxDrawGeodesic={})}(this,(function(t){"use strict";const e="add",r="none",o="Feature",n="Polygon",i="LineString",s="Point",a="Multi",c="MultiLineString",h="MultiPolygon",u="draw.create",l="midpoint",p="vertex",f="true",d="false",g={DRAW_LINE_STRING:"draw_line_string",DRAW_POLYGON:"draw_polygon",DRAW_POINT:"draw_point",SIMPLE_SELECT:"simple_select",DIRECT_SELECT:"direct_select",STATIC:"static",DRAW_CIRCLE:"draw_circle"},y="circleRadius",M="circleHandleBearing";var m={exports:{}},v=m.exports=function(t,e){if(e||(e=16),void 0===t&&(t=128),t<=0)return"0";for(var r=Math.log(Math.pow(2,t))/Math.log(e),o=2;r===1/0;o*=2)r=Math.log(Math.pow(2,t/o))/Math.log(e)*o;var n=r-Math.floor(r),i="";for(o=0;o<Math.floor(r);o++){i=Math.floor(Math.random()*e).toString(e)+i}if(n){var s=Math.pow(e,n);i=Math.floor(Math.random()*s).toString(e)+i}var a=parseInt(i,e);return a!==1/0&&a>=Math.pow(2,t)?v(t,e):i};v.rack=function(t,e,r){var o=function(o){var i=0;do{if(i++>10){if(!r)throw new Error("too many ID collisions, use more bits");t+=r}var s=v(t,e)}while(Object.hasOwnProperty.call(n,s));return n[s]=o,s},n=o.hats={};return o.get=function(t){return o.hats[t]},o.set=function(t,e){return o.hats[t]=e,o},o.bits=t||128,o.base=e||16,o};var x=m.exports;function E(t,e){let r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!(e>0))throw new Error("Radius has to be greater then 0");return{id:x(),type:o,properties:{[y]:e,...r},geometry:{type:n,coordinates:[[t,t,t,t]]}}}function w(t,e){return t===n&&"number"==typeof e[y]&&e[y]>0}function C(t){return w(t.geometry.type,t.properties)}function _(t){if(!C(t))throw new Error("GeoJSON is not a circle");return t.geometry.coordinates[0][0]}function S(t){if(!C(t))throw new Error("GeoJSON is not a circle");return t.properties[y]}var I={exports:{}};!function(t){var e=Math.PI/180,r=180/Math.PI,o=function(t,r){this.lon=t,this.lat=r,this.x=e*t,this.y=e*r};o.prototype.view=function(){return String(this.lon).slice(0,4)+","+String(this.lat).slice(0,4)},o.prototype.antipode=function(){var t=-1*this.lat,e=this.lon<0?180+this.lon:-1*(180-this.lon);return new o(e,t)};var n=function(){this.coords=[],this.length=0};n.prototype.move_to=function(t){this.length++,this.coords.push(t)};var i=function(t){this.properties=t||{},this.geometries=[]};i.prototype.json=function(){if(this.geometries.length<=0)return{geometry:{type:"LineString",coordinates:null},type:"Feature",properties:this.properties};if(1==this.geometries.length)return{geometry:{type:"LineString",coordinates:this.geometries[0].coords},type:"Feature",properties:this.properties};for(var t=[],e=0;e<this.geometries.length;e++)t.push(this.geometries[e].coords);return{geometry:{type:"MultiLineString",coordinates:t},type:"Feature",properties:this.properties}},i.prototype.wkt=function(){for(var t="",e="LINESTRING(",r=function(t){e+=t[0]+" "+t[1]+","},o=0;o<this.geometries.length;o++){if(0===this.geometries[o].coords.length)return"LINESTRING(empty)";this.geometries[o].coords.forEach(r),t+=e.substring(0,e.length-1)+")"}return t};var s=function(t,e,r){if(!t||void 0===t.x||void 0===t.y)throw new Error("GreatCircle constructor expects two args: start and end objects with x and y properties");if(!e||void 0===e.x||void 0===e.y)throw new Error("GreatCircle constructor expects two args: start and end objects with x and y properties");this.start=new o(t.x,t.y),this.end=new o(e.x,e.y),this.properties=r||{};var n=this.start.x-this.end.x,i=this.start.y-this.end.y,s=Math.pow(Math.sin(i/2),2)+Math.cos(this.start.y)*Math.cos(this.end.y)*Math.pow(Math.sin(n/2),2);if(this.g=2*Math.asin(Math.sqrt(s)),this.g==Math.PI)throw new Error("it appears "+t.view()+" and "+e.view()+" are 'antipodal', e.g diametrically opposite, thus there is no single route but rather infinite");if(isNaN(this.g))throw new Error("could not calculate great circle between "+t+" and "+e)};s.prototype.interpolate=function(t){var e=Math.sin((1-t)*this.g)/Math.sin(this.g),o=Math.sin(t*this.g)/Math.sin(this.g),n=e*Math.cos(this.start.y)*Math.cos(this.start.x)+o*Math.cos(this.end.y)*Math.cos(this.end.x),i=e*Math.cos(this.start.y)*Math.sin(this.start.x)+o*Math.cos(this.end.y)*Math.sin(this.end.x),s=e*Math.sin(this.start.y)+o*Math.sin(this.end.y),a=r*Math.atan2(s,Math.sqrt(Math.pow(n,2)+Math.pow(i,2)));return[r*Math.atan2(i,n),a]},s.prototype.Arc=function(t,e){var r=[];if(!t||t<=2)r.push([this.start.lon,this.start.lat]),r.push([this.end.lon,this.end.lat]);else for(var o=1/(t-1),s=0;s<t;++s){var a=o*s,c=this.interpolate(a);r.push(c)}for(var h=!1,u=0,l=e&&e.offset?e.offset:10,p=180-l,f=-180+l,d=360-l,g=1;g<r.length;++g){var y=r[g-1][0],M=r[g][0],m=Math.abs(M-y);m>d&&(M>p&&y<f||y>p&&M<f)?h=!0:m>u&&(u=m)}var v=[];if(h&&u<l){var x=[];v.push(x);for(var E=0;E<r.length;++E){var w=parseFloat(r[E][0]);if(E>0&&Math.abs(w-r[E-1][0])>d){var C=parseFloat(r[E-1][0]),_=parseFloat(r[E-1][1]),S=parseFloat(r[E][0]),I=parseFloat(r[E][1]);if(C>-180&&C<f&&180==S&&E+1<r.length&&r[E-1][0]>-180&&r[E-1][0]<f){x.push([-180,r[E][1]]),E++,x.push([r[E][0],r[E][1]]);continue}if(C>p&&C<180&&-180==S&&E+1<r.length&&r[E-1][0]>p&&r[E-1][0]<180){x.push([180,r[E][1]]),E++,x.push([r[E][0],r[E][1]]);continue}if(C<f&&S>p){var b=C;C=S,S=b;var L=_;_=I,I=L}if(C>p&&S<f&&(S+=360),C<=180&&S>=180&&C<S){var P=(180-C)/(S-C),N=P*I+(1-P)*_;x.push([r[E-1][0]>p?180:-180,N]),(x=[]).push([r[E-1][0]>p?-180:180,N]),v.push(x)}else x=[],v.push(x);x.push([w,r[E][1]])}else x.push([r[E][0],r[E][1]])}}else{var T=[];v.push(T);for(var D=0;D<r.length;++D)T.push([r[D][0],r[D][1]])}for(var F=new i(this.properties),O=0;O<v.length;++O){var R=new n;F.geometries.push(R);for(var G=v[O],A=0;A<G.length;++A)R.move_to(G[A])}return F},t.exports.Coord=o,t.exports.Arc=i,t.exports.GreatCircle=s}(I);var b=I.exports;function L(t,e){return t[0]===e[0]&&t[1]===e[1]}function P(t){return t.slice(0,-1).map(((e,r)=>[e,t[r+1]])).filter((t=>!L(t[0],t[1])))}function N(t){let e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:32;const r=P(t),o=r.map((t=>new b.GreatCircle({x:t[0][0],y:t[0][1]},{x:t[1][0],y:t[1][1]}).Arc(e,{offset:90}).json()));let n=0;const i=o.map((t=>{if(t.geometry.type===c){const e=n,r=n+(t.geometry.coordinates[0][0][0]>t.geometry.coordinates[1][0][0]?1:-1),o=[...t.geometry.coordinates[0].map((t=>[t[0]+360*e,t[1]])),...t.geometry.coordinates[1].map((t=>[t[0]+360*r,t[1]]))];return n=r,o}return t.geometry.coordinates.map((t=>[t[0]+360*n,t[1]]))})).flat();return i.filter(((t,e)=>e===i.length-1||!L(t,i[e+1])))}const T=6371e3;function D(t){return t/180*Math.PI}function F(t){return t/Math.PI*180}function O(t,e){if(r=t,o=e,!(Math.abs(r[0]-o[0])>Number.EPSILON||Math.abs(r[1]-o[1])>Number.EPSILON))return NaN;var r,o;const n=D(t[1]),i=D(e[1]),s=D(e[0]-t[0]),a=Math.cos(n)*Math.sin(i)-Math.sin(n)*Math.cos(i)*Math.cos(s),c=Math.sin(s)*Math.cos(i),h=F(Math.atan2(c,a));return(h+360)%360}const R=6371.0088;function G(t,e){return function(t,e){const r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:T,o=D(t[1]),n=D(t[0]),i=D(e[1]),s=D(e[0]),a=i-o,c=s-n,h=Math.sin(a/2)*Math.sin(a/2)+Math.cos(o)*Math.cos(i)*Math.sin(c/2)*Math.sin(c/2),u=2*Math.atan2(Math.sqrt(h),Math.sqrt(1-h));return r*u}(t,e,R)}function A(t,e,r){return function(t,e,r){const o=e/(arguments.length>3&&void 0!==arguments[3]?arguments[3]:T),n=D(r),i=D(t[1]),s=D(t[0]),a=Math.sin(i)*Math.cos(o)+Math.cos(i)*Math.sin(o)*Math.cos(n),c=Math.asin(a),h=Math.sin(n)*Math.sin(o)*Math.cos(i),u=Math.cos(o)-Math.sin(i)*a,l=s+Math.atan2(h,u),p=F(c);return[F(l),p]}(t,e,r,R)}function W(t){return w(t.type,t.properties)}function k(t,e){e={steps:32,...e};const r=t.properties,c=t.geometry.type,u=t.geometry.coordinates,g=r.parent||r.id,y=e.ctx.store.get(g);if(c===s)return W(y)?[]:r.meta===l?function(){const e=r.coord_path,o=(u=e,u.split(".").map(((t,e,r)=>e===r.length-1?(parseInt(t,10)-1).toString():t)).join(".")),i=function(t,e){if(t.type!==n&&t.type!==h)return e;try{return t.getCoordinate(e),e}catch(t){return e.split(".").map(((t,e,r)=>e===r.length-1?"0":t)).join(".")}}(y,e),s=y.getCoordinate(o),a=y.getCoordinate(i),c=function(t,e){const r=D(t[1]),o=D(t[0]),n=D(e[1]),i=D(e[0]-t[0]),s=Math.cos(r),a=0,c=Math.sin(r),h={x:s+Math.cos(n)*Math.cos(i),y:a+Math.cos(n)*Math.sin(i),z:c+Math.sin(n)},u=Math.atan2(h.z,Math.sqrt(h.x*h.x+h.y*h.y)),l=o+Math.atan2(h.y,h.x),p=F(u);return[F(l),p]}(s,a);var u;return[{...t,properties:{...r,lng:c[0],lat:c[1]},geometry:{...t.geometry,coordinates:c}}]}():[t];if(c===i)return function(){const r=N(u,e.steps);return[{...t,geometry:{...t.geometry,coordinates:r}}]}();if(c===n)return W(y)?function(){const n=y.toGeoJSON(),i=_(n),a=S(n),c=y[M]||45,h=function(t,e,r,o){const n=[];for(let i=0;i<o;++i)n.push(A(t,e,r+360*-i/o));return n.push(n[0]),n}(i,a,c,4*e.steps),u={...t,geometry:{...t.geometry,coordinates:[h]}};if(r.active===f){const t=[i,A(i,a,c)].map(((t,n)=>function(t,e,r,n){return{type:o,properties:{meta:p,parent:t,coord_path:r,active:n?f:d},geometry:{type:s,coordinates:e}}}(r.id,t,"0.".concat(n),function(t){if(!e.selectedPaths)return!1;return-1!==e.selectedPaths.indexOf(t)}("0.".concat(n)))));return[u,...t]}return[u]}():function(){const e=u.map((t=>N(t)));return[{...t,geometry:{...t.geometry,coordinates:e}}]}();if(0===c.indexOf(a))return function(){const n=c.replace(a,""),i=u.map((t=>k({type:o,properties:r,geometry:{type:n,coordinates:t}},e))).flat().map((t=>t.geometry.coordinates));return[{...t,geometry:{...t.geometry,coordinates:i}}]}()}function j(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{k(t,{ctx:this._ctx}).forEach(o)}))},e}function J(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{k(t,{ctx:this._ctx}).forEach(o)}))},e}var V={enable(t){setTimeout((()=>{t.map&&t.map.doubleClickZoom&&t._ctx&&t._ctx.store&&t._ctx.store.getInitialConfigValue&&t._ctx.store.getInitialConfigValue("doubleClickZoom")&&t.map.doubleClickZoom.enable()}),0)},disable(t){setTimeout((()=>{t.map&&t.map.doubleClickZoom&&t.map.doubleClickZoom.disable()}),0)}};const Z={enable(t){setTimeout((()=>{t.map&&t.map.dragPan&&t._ctx&&t._ctx.store&&t._ctx.store.getInitialConfigValue&&t._ctx.store.getInitialConfigValue("dragPan")&&t.map.dragPan.enable()}),0)},disable(t){setTimeout((()=>{t.map&&t.map.doubleClickZoom&&t.map.dragPan.disable()}),0)}},q={};function U(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{k(t,{ctx:this._ctx}).forEach(o)}))},e}function B(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{k(t,{ctx:this._ctx}).forEach(o)}))},e}function Y(t){const e={...t};return e.dragVertex=function(e,r,o){const n=e.feature.toGeoJSON();if(C(n))if("0.1"===e.selectedCoordPaths[0]){const t=_(n),o=[r.lngLat.lng,r.lngLat.lat],i=G(t,o),s=O(t,o);e.feature.properties[y]=i,e.feature[M]=s,e.feature.changed()}else t.dragFeature.call(this,e,r,o);else t.dragVertex.call(this,e,r,o)},e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{k(t,{ctx:this._ctx,selectedPaths:e.selectedCoordPaths}).forEach(o)}))},e}q.onSetup=function(t){return this.clearSelectedFeatures(),V.disable(this),Z.disable(this),this.updateUIClasses({mouse:e}),this.setActionableState(),{}},q.onMouseDown=q.onTouchStart=function(t,e){const r=[e.lngLat.lng,e.lngLat.lat],o=this.newFeature(E(r,Number.EPSILON));this.addFeature(o),t.circle=o},q.onDrag=q.onTouchMove=function(t,e){if(t.circle){const r=_(t.circle.toGeoJSON()),o=[e.lngLat.lng,e.lngLat.lat],n=G(r,o),i=O(r,o);t.circle.properties[y]=n,t.circle[M]=i,t.circle.changed()}},q.onMouseUp=q.onTouchEnd=function(t,e){return this.map.fire(u,{features:[t.circle.toGeoJSON()]}),this.changeMode(g.SIMPLE_SELECT,{featureIds:[t.circle.id]})},q.onKeyUp=function(t,e){!function(t){return 27===t.keyCode}(e)?function(t){return 13===t.keyCode}(e)&&this.changeMode(g.SIMPLE_SELECT,{featureIds:[t.circle.id]}):(t.circle&&this.deleteFeature([t.circle.id],{silent:!0}),this.changeMode(g.SIMPLE_SELECT))},q.onStop=function(){this.updateUIClasses({mouse:r}),V.enable(this),Z.enable(this),this.activateUIButton()},q.toDisplayFeatures=function(t,e,r){if(t.circle){const r=e.properties.id===t.circle.id;e.properties.active=r?f:d}(t=>{k(t,{ctx:this._ctx}).forEach(r)})(e)};const z={};z.onSetup=function(){return this.setActionableState(),{}},z.toDisplayFeatures=function(t,e,r){(t=>{k(t,{ctx:this._ctx}).forEach(r)})(e)},t.createCircle=E,t.enable=function(t){return{...t,[g.DRAW_LINE_STRING]:j(t[g.DRAW_LINE_STRING]),[g.DRAW_POLYGON]:J(t[g.DRAW_POLYGON]),[g.DRAW_CIRCLE]:q,[g.DRAW_POINT]:U(t[g.DRAW_POINT]),[g.SIMPLE_SELECT]:B(t[g.SIMPLE_SELECT]),[g.DIRECT_SELECT]:Y(t[g.DIRECT_SELECT]),[g.STATIC]:z}},t.getCircleCenter=_,t.getCircleRadius=S,t.isCircle=C,t.isCircleByTypeAndProperties=w,t.setCircleCenter=function(t,e){if(!C(t))throw new Error("GeoJSON is not a circle");t.geometry.coordinates=[[e,e,e,e]]},t.setCircleRadius=function(t,e){if(!C(t))throw new Error("GeoJSON is not a circle");t.properties[y]=e},Object.defineProperty(t,"__esModule",{value:!0})}));
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).MapboxDrawGeodesic={})}(this,(function(t){"use strict";const e="add",r="none",o={FEATURE:"Feature",POLYGON:"Polygon",LINE_STRING:"LineString",POINT:"Point",FEATURE_COLLECTION:"FeatureCollection",MULTI_PREFIX:"Multi",MULTI_POINT:"MultiPoint",MULTI_LINE_STRING:"MultiLineString",MULTI_POLYGON:"MultiPolygon"},n="draw.create",i={FEATURE:"feature",MIDPOINT:"midpoint",VERTEX:"vertex"},s={ACTIVE:"true",INACTIVE:"false"},a={DRAW_LINE_STRING:"draw_line_string",DRAW_POLYGON:"draw_polygon",DRAW_POINT:"draw_point",SIMPLE_SELECT:"simple_select",DIRECT_SELECT:"direct_select",STATIC:"static",DRAW_CIRCLE:"draw_circle"},c={CIRCLE_RADIUS:"circleRadius",CIRCLE_HANDLE_BEARING:"circleHandleBearing"};function h(t){return t&&t.__esModule&&Object.prototype.hasOwnProperty.call(t,"default")?t.default:t}var u={exports:{}},l=u.exports=function(t,e){if(e||(e=16),void 0===t&&(t=128),t<=0)return"0";for(var r=Math.log(Math.pow(2,t))/Math.log(e),o=2;r===1/0;o*=2)r=Math.log(Math.pow(2,t/o))/Math.log(e)*o;var n=r-Math.floor(r),i="";for(o=0;o<Math.floor(r);o++){i=Math.floor(Math.random()*e).toString(e)+i}if(n){var s=Math.pow(e,n);i=Math.floor(Math.random()*s).toString(e)+i}var a=parseInt(i,e);return a!==1/0&&a>=Math.pow(2,t)?l(t,e):i};l.rack=function(t,e,r){var o=function(o){var i=0;do{if(i++>10){if(!r)throw new Error("too many ID collisions, use more bits");t+=r}var s=l(t,e)}while(Object.hasOwnProperty.call(n,s));return n[s]=o,s},n=o.hats={};return o.get=function(t){return o.hats[t]},o.set=function(t,e){return o.hats[t]=e,o},o.bits=t||128,o.base=e||16,o};var p=h(u.exports);function f(t,e){let r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(!(e>0))throw new Error("Radius has to be greater then 0");return{id:p(),type:o.FEATURE,properties:{[c.CIRCLE_RADIUS]:e,...r},geometry:{type:o.POLYGON,coordinates:[[t,t,t,t]]}}}function d(t,e){return t===o.POLYGON&&"number"==typeof e[c.CIRCLE_RADIUS]&&e[c.CIRCLE_RADIUS]>0}function g(t){return d(t.geometry.type,t.properties)}function M(t){if(!g(t))throw new Error("GeoJSON is not a circle");return t.geometry.coordinates[0][0]}function I(t){if(!g(t))throw new Error("GeoJSON is not a circle");return t.properties[c.CIRCLE_RADIUS]}var y={exports:{}};!function(t){var e=Math.PI/180,r=180/Math.PI,o=function(t,r){this.lon=t,this.lat=r,this.x=e*t,this.y=e*r},n=function(t){for(var e=Math.pow(10,6),r=0;r<t.length;r++)t[r]=Math.round((t[r]+Number.EPSILON)*e)/e;return t};o.prototype.view=function(){return String(this.lon).slice(0,4)+","+String(this.lat).slice(0,4)},o.prototype.antipode=function(){var t=-1*this.lat,e=this.lon<0?180+this.lon:-1*(180-this.lon);return new o(e,t)};var i=function(){this.coords=[],this.length=0};i.prototype.move_to=function(t){this.length++,this.coords.push(t)};var s=function(t){this.properties=t||{},this.geometries=[]};s.prototype.json=function(){if(this.geometries.length<=0)return{geometry:{type:"LineString",coordinates:null},type:"Feature",properties:this.properties};if(1==this.geometries.length)return{geometry:{type:"LineString",coordinates:this.geometries[0].coords},type:"Feature",properties:this.properties};for(var t=[],e=0;e<this.geometries.length;e++)t.push(this.geometries[e].coords);return{geometry:{type:"MultiLineString",coordinates:t},type:"Feature",properties:this.properties}},s.prototype.wkt=function(){for(var t="",e="LINESTRING(",r=function(t){e+=t[0]+" "+t[1]+","},o=0;o<this.geometries.length;o++){if(0===this.geometries[o].coords.length)return"LINESTRING(empty)";this.geometries[o].coords.forEach(r),t+=e.substring(0,e.length-1)+")"}return t};var a=function(t,e,r){if(!t||void 0===t.x||void 0===t.y)throw new Error("GreatCircle constructor expects two args: start and end objects with x and y properties");if(!e||void 0===e.x||void 0===e.y)throw new Error("GreatCircle constructor expects two args: start and end objects with x and y properties");this.start=new o(t.x,t.y),this.end=new o(e.x,e.y),this.properties=r||{};var n=this.start.x-this.end.x,i=this.start.y-this.end.y,s=Math.pow(Math.sin(i/2),2)+Math.cos(this.start.y)*Math.cos(this.end.y)*Math.pow(Math.sin(n/2),2);if(this.g=2*Math.asin(Math.sqrt(s)),this.g==Math.PI)throw new Error("it appears "+this.start.view()+" and "+this.end.view()+" are 'antipodal', e.g diametrically opposite, thus there is no single route but rather infinite");if(isNaN(this.g))throw new Error("could not calculate great circle between "+t+" and "+e)};a.prototype.interpolate=function(t){var e=Math.sin((1-t)*this.g)/Math.sin(this.g),o=Math.sin(t*this.g)/Math.sin(this.g),n=e*Math.cos(this.start.y)*Math.cos(this.start.x)+o*Math.cos(this.end.y)*Math.cos(this.end.x),i=e*Math.cos(this.start.y)*Math.sin(this.start.x)+o*Math.cos(this.end.y)*Math.sin(this.end.x),s=e*Math.sin(this.start.y)+o*Math.sin(this.end.y),a=r*Math.atan2(s,Math.sqrt(Math.pow(n,2)+Math.pow(i,2)));return[r*Math.atan2(i,n),a]},a.prototype.Arc=function(t,e){var r=[];if(!t||t<=2)r.push([this.start.lon,this.start.lat]),r.push([this.end.lon,this.end.lat]);else for(var o=1/(t-1),a=0;a<t;++a){var c=o*a,h=this.interpolate(c);r.push(h)}for(var u=!1,l=0,p=e&&e.offset?e.offset:10,f=180-p,d=-180+p,g=360-p,M=1;M<r.length;++M){var I=r[M-1][0],y=r[M][0],E=Math.abs(y-I);E>g&&(y>f&&I<d||I>f&&y<d)?u=!0:E>l&&(l=E)}var m=[];if(u&&l<p){var C=[];m.push(C);for(var _=0;_<r.length;++_){var L=parseFloat(r[_][0]);if(_>0&&Math.abs(L-r[_-1][0])>g){var N=parseFloat(r[_-1][0]),T=parseFloat(r[_-1][1]),R=parseFloat(r[_][0]),v=parseFloat(r[_][1]);if(N>-180&&N<d&&180==R&&_+1<r.length&&r[_-1][0]>-180&&r[_-1][0]<d){C.push([-180,r[_][1]]),_++,C.push([r[_][0],r[_][1]]);continue}if(N>f&&N<180&&-180==R&&_+1<r.length&&r[_-1][0]>f&&r[_-1][0]<180){C.push([180,r[_][1]]),_++,C.push([r[_][0],r[_][1]]);continue}if(N<d&&R>f){var S=N;N=R,R=S;var x=T;T=v,v=x}if(N>f&&R<d&&(R+=360),N<=180&&R>=180&&N<R){var w=(180-N)/(R-N),P=w*v+(1-w)*T;C.push([r[_-1][0]>f?180:-180,P]),(C=[]).push([r[_-1][0]>f?-180:180,P]),m.push(C)}else C=[],m.push(C);C.push([L,r[_][1]])}else C.push([r[_][0],r[_][1]])}}else{var O=[];m.push(O);for(var A=0;A<r.length;++A)O.push([r[A][0],r[A][1]])}for(var b=new s(this.properties),D=0;D<m.length;++D){var F=new i;b.geometries.push(F);for(var G=m[D],U=0;U<G.length;++U)F.move_to(n(G[U]))}return b},t.exports.Coord=o,t.exports.Arc=s,t.exports.GreatCircle=a}(y);var E=h(y.exports);function m(t,e){return t[0]===e[0]&&t[1]===e[1]}function C(t){let e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:32;var r;const n=(r=t).slice(0,-1).map(((t,e)=>[t,r[e+1]])).filter((t=>!m(t[0],t[1]))).map((t=>new E.GreatCircle({x:t[0][0],y:t[0][1]},{x:t[1][0],y:t[1][1]}).Arc(e,{offset:90}).json()));let i=0;const s=n.map((t=>{if(t.geometry.type===o.MULTI_LINE_STRING){const e=i,r=i+(t.geometry.coordinates[0][0][0]>t.geometry.coordinates[1][0][0]?1:-1),o=[...t.geometry.coordinates[0].map((t=>[t[0]+360*e,t[1]])),...t.geometry.coordinates[1].map((t=>[t[0]+360*r,t[1]]))];return i=r,o}return t.geometry.coordinates.map((t=>[t[0]+360*i,t[1]]))})).flat();return s.filter(((t,e)=>e===s.length-1||!m(t,s[e+1])))}const _=6371e3;function L(t){return t/180*Math.PI}function N(t){return t/Math.PI*180}function T(t,e){if(r=t,o=e,!(Math.abs(r[0]-o[0])>Number.EPSILON||Math.abs(r[1]-o[1])>Number.EPSILON))return NaN;var r,o;const n=L(t[1]),i=L(e[1]),s=L(e[0]-t[0]),a=Math.cos(n)*Math.sin(i)-Math.sin(n)*Math.cos(i)*Math.cos(s),c=Math.sin(s)*Math.cos(i),h=N(Math.atan2(c,a));return(h+360)%360}const R=6371.0088;function v(t,e){return function(t,e){const r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:_,o=L(t[1]),n=L(t[0]),i=L(e[1]),s=i-o,a=L(e[0])-n,c=Math.sin(s/2)*Math.sin(s/2)+Math.cos(o)*Math.cos(i)*Math.sin(a/2)*Math.sin(a/2);return r*(2*Math.atan2(Math.sqrt(c),Math.sqrt(1-c)))}(t,e,R)}function S(t,e,r){return function(t,e,r){const o=e/(arguments.length>3&&void 0!==arguments[3]?arguments[3]:_),n=L(r),i=L(t[1]),s=L(t[0]),a=Math.sin(i)*Math.cos(o)+Math.cos(i)*Math.sin(o)*Math.cos(n),c=Math.asin(a),h=Math.sin(n)*Math.sin(o)*Math.cos(i),u=Math.cos(o)-Math.sin(i)*a,l=s+Math.atan2(h,u),p=N(c);return[N(l),p]}(t,e,r,R)}const x=32,w=45;function P(t){return d(t.type,t.properties)}function O(t,e){e={steps:x,...e};const r=t.properties,n=t.geometry.type,a=t.geometry.coordinates,h=r.parent||r.id,u=e.ctx.store.get(h);if(n===o.POINT)return P(u)?[]:r.meta===i.MIDPOINT?function(){const e=r.coord_path,n=(h=e,h.split(".").map(((t,e,r)=>e===r.length-1?(parseInt(t,10)-1).toString():t)).join(".")),i=function(t,e){if(t.type!==o.POLYGON&&t.type!==o.MULTI_POLYGON)return e;try{return t.getCoordinate(e),e}catch(t){return e.split(".").map(((t,e,r)=>e===r.length-1?"0":t)).join(".")}}(u,e),s=u.getCoordinate(n),a=u.getCoordinate(i),c=function(t,e){const r=L(t[1]),o=L(t[0]),n=L(e[1]),i=L(e[0]-t[0]),s=Math.cos(r),a=0,c=Math.sin(r),h={x:s+Math.cos(n)*Math.cos(i),y:a+Math.cos(n)*Math.sin(i),z:c+Math.sin(n)},u=Math.atan2(h.z,Math.sqrt(h.x*h.x+h.y*h.y)),l=o+Math.atan2(h.y,h.x),p=N(u);return[N(l),p]}(s,a);var h;return[{...t,properties:{...r,lng:c[0],lat:c[1]},geometry:{...t.geometry,coordinates:c}}]}():[t];if(n===o.LINE_STRING)return function(){const r=C(a,e.steps);return[{...t,geometry:{...t.geometry,coordinates:r}}]}();if(n===o.POLYGON)return P(u)?function(){const n=u.toGeoJSON(),a=M(n),h=I(n),l=u[c.CIRCLE_HANDLE_BEARING]||w,p=function(t,e,r,o){const n=[];for(let i=0;i<o;++i)n.push(S(t,e,r+360*-i/o));return n.push(n[0]),n}(a,h,l,4*e.steps),f={...t,geometry:{...t.geometry,coordinates:[p]}};if(r.active===s.ACTIVE){const t=[a,S(a,h,l)].map(((t,n)=>function(t,e,r,n){return{type:o.FEATURE,properties:{meta:i.VERTEX,parent:t,coord_path:r,active:n?s.ACTIVE:s.INACTIVE},geometry:{type:o.POINT,coordinates:e}}}(r.id,t,`0.${n}`,function(t){if(!e.selectedPaths)return!1;return-1!==e.selectedPaths.indexOf(t)}(`0.${n}`))));return[f,...t]}return[f]}():function(){const e=a.map((t=>C(t)));return[{...t,geometry:{...t.geometry,coordinates:e}}]}();if(0===n.indexOf(o.MULTI_PREFIX))return function(){const i=n.replace(o.MULTI_PREFIX,""),s=a.map((t=>O({type:o.FEATURE,properties:r,geometry:{type:i,coordinates:t}},e))).flat().map((t=>t.geometry.coordinates));return[{...t,geometry:{...t.geometry,coordinates:s}}]}()}function A(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{O(t,{ctx:this._ctx}).forEach(o)}))},e}function b(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{O(t,{ctx:this._ctx}).forEach(o)}))},e}var D={enable(t){setTimeout((()=>{t.map&&t.map.doubleClickZoom&&t._ctx&&t._ctx.store&&t._ctx.store.getInitialConfigValue&&t._ctx.store.getInitialConfigValue("doubleClickZoom")&&t.map.doubleClickZoom.enable()}),0)},disable(t){setTimeout((()=>{t.map&&t.map.doubleClickZoom&&t.map.doubleClickZoom.disable()}),0)}};const F={enable(t){setTimeout((()=>{t.map&&t.map.dragPan&&t._ctx&&t._ctx.store&&t._ctx.store.getInitialConfigValue&&t._ctx.store.getInitialConfigValue("dragPan")&&t.map.dragPan.enable()}),0)},disable(t){setTimeout((()=>{t.map&&t.map.doubleClickZoom&&t.map.dragPan.disable()}),0)}},G={};function U(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{O(t,{ctx:this._ctx}).forEach(o)}))},e}function V(t){const e={...t};return e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{O(t,{ctx:this._ctx}).forEach(o)}))},e}function W(t){const e={...t};return e.dragVertex=function(e,r,o){const n=e.feature.toGeoJSON();if(g(n))if("0.1"===e.selectedCoordPaths[0]){const t=M(n),o=[r.lngLat.lng,r.lngLat.lat],i=v(t,o),s=T(t,o);e.feature.properties[c.CIRCLE_RADIUS]=i,e.feature[c.CIRCLE_HANDLE_BEARING]=s,e.feature.changed()}else t.dragFeature.call(this,e,r,o);else t.dragVertex.call(this,e,r,o)},e.toDisplayFeatures=function(e,r,o){t.toDisplayFeatures.call(this,e,r,(t=>{O(t,{ctx:this._ctx,selectedPaths:e.selectedCoordPaths}).forEach(o)}))},e}G.onSetup=function(t){return this.clearSelectedFeatures(),D.disable(this),F.disable(this),this.updateUIClasses({mouse:e}),this.setActionableState(),{}},G.onMouseDown=G.onTouchStart=function(t,e){const r=[e.lngLat.lng,e.lngLat.lat],o=this.newFeature(f(r,Number.EPSILON));this.addFeature(o),t.circle=o},G.onDrag=G.onTouchMove=function(t,e){if(t.circle){const r=M(t.circle.toGeoJSON()),o=[e.lngLat.lng,e.lngLat.lat],n=v(r,o),i=T(r,o);t.circle.properties[c.CIRCLE_RADIUS]=n,t.circle[c.CIRCLE_HANDLE_BEARING]=i,t.circle.changed()}},G.onMouseUp=G.onTouchEnd=function(t,e){return this.map.fire(n,{features:[t.circle.toGeoJSON()]}),this.changeMode(a.SIMPLE_SELECT,{featureIds:[t.circle.id]})},G.onKeyUp=function(t,e){!function(t){return 27===t.keyCode}(e)?function(t){return 13===t.keyCode}(e)&&this.changeMode(a.SIMPLE_SELECT,{featureIds:[t.circle.id]}):(t.circle&&this.deleteFeature([t.circle.id],{silent:!0}),this.changeMode(a.SIMPLE_SELECT))},G.onStop=function(){this.updateUIClasses({mouse:r}),D.enable(this),F.enable(this),this.activateUIButton()},G.toDisplayFeatures=function(t,e,r){if(t.circle){const r=e.properties.id===t.circle.id;e.properties.active=r?s.ACTIVE:s.INACTIVE}(t=>{O(t,{ctx:this._ctx}).forEach(r)})(e)};const k={};k.onSetup=function(){return this.setActionableState(),{}},k.toDisplayFeatures=function(t,e,r){(t=>{O(t,{ctx:this._ctx}).forEach(r)})(e)},t.createCircle=f,t.enable=function(t){return{...t,[a.DRAW_LINE_STRING]:A(t[a.DRAW_LINE_STRING]),[a.DRAW_POLYGON]:b(t[a.DRAW_POLYGON]),[a.DRAW_CIRCLE]:G,[a.DRAW_POINT]:U(t[a.DRAW_POINT]),[a.SIMPLE_SELECT]:V(t[a.SIMPLE_SELECT]),[a.DIRECT_SELECT]:W(t[a.DIRECT_SELECT]),[a.STATIC]:k}},t.getCircleCenter=M,t.getCircleRadius=I,t.isCircle=g,t.isCircleByTypeAndProperties=d,t.setCircleCenter=function(t,e){if(!g(t))throw new Error("GeoJSON is not a circle");t.geometry.coordinates=[[e,e,e,e]]},t.setCircleRadius=function(t,e){if(!g(t))throw new Error("GeoJSON is not a circle");t.properties[c.CIRCLE_RADIUS]=e}}));
//# sourceMappingURL=mapbox-gl-draw-geodesic.umd.min.js.map

29

package.json
{
"name": "mapbox-gl-draw-geodesic",
"version": "2.2.0",
"version": "2.2.1",
"description": "Geodesic plugin for Mapbox GL Draw",

@@ -14,2 +14,3 @@ "keywords": [

"repository": "github:zakjan/mapbox-gl-draw-geodesic",
"type": "module",
"main": "dist/mapbox-gl-draw-geodesic.cjs.js",

@@ -25,3 +26,3 @@ "module": "dist/mapbox-gl-draw-geodesic.esm.js",

"dependencies": {
"arc": "^0.1.2",
"arc": "^0.1.4",
"geodesy-fn": "^1.0.1",

@@ -31,17 +32,17 @@ "hat": "0.0.3"

"devDependencies": {
"@babel/core": "^7.16.0",
"@babel/plugin-transform-runtime": "^7.16.4",
"@babel/preset-env": "^7.16.4",
"@babel/runtime": "^7.16.3",
"@babel/core": "^7.23.0",
"@babel/plugin-transform-runtime": "^7.22.15",
"@babel/preset-env": "^7.22.20",
"@babel/runtime": "^7.23.1",
"@mapbox/mapbox-gl-draw": "1.3.0",
"@rollup/plugin-babel": "^5.3.0",
"@rollup/plugin-commonjs": "^21.0.1",
"@rollup/plugin-node-resolve": "^13.0.6",
"jest": "^27.3.1",
"@rollup/plugin-babel": "^6.0.3",
"@rollup/plugin-commonjs": "^25.0.4",
"@rollup/plugin-node-resolve": "^15.2.1",
"@rollup/plugin-terser": "^0.4.3",
"jest": "^29.7.0",
"jest-matcher-deep-close-to": "^3.0.2",
"jest-simple-summary": "^1.0.2",
"rimraf": "^3.0.2",
"rollup": "^2.60.1",
"rollup-plugin-terser": "^7.0.2",
"rollup-plugin-visualizer": "^5.5.2"
"rimraf": "^5.0.5",
"rollup": "^3.29.4",
"rollup-plugin-visualizer": "^5.9.2"
},

@@ -48,0 +49,0 @@ "peerDependencies": {

2

README.md

@@ -32,3 +32,3 @@ # mapbox-gl-draw-geodesic

```
<script src="https://unpkg.com/mapbox-gl-draw-geodesic@2.2.0/dist/mapbox-gl-draw-geodesic.min.js"></script>
<script src="https://unpkg.com/mapbox-gl-draw-geodesic@2.2.1/dist/mapbox-gl-draw-geodesic.min.js"></script>
```

@@ -35,0 +35,0 @@

6

rollup.config.js

@@ -1,7 +0,7 @@

import pkg from './package.json';
import pkg from './package.json' assert { type: 'json' };
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import babel from '@rollup/plugin-babel';
import { terser } from 'rollup-plugin-terser';
import visualizer from 'rollup-plugin-visualizer';
import terser from '@rollup/plugin-terser';
import { visualizer } from 'rollup-plugin-visualizer';

@@ -8,0 +8,0 @@ function bundle(format, filename, options = {}) {

dist/mapbox-gl-draw-geodesic.cjs.js.map

Sorry, the diff of this file is not supported yet

dist/mapbox-gl-draw-geodesic.esm.js.map

Sorry, the diff of this file is not supported yet

dist/mapbox-gl-draw-geodesic.umd.js.map

Sorry, the diff of this file is not supported yet

dist/mapbox-gl-draw-geodesic.umd.js.stats.html

Sorry, the diff of this file is not supported yet

dist/mapbox-gl-draw-geodesic.umd.min.js.map

Sorry, the diff of this file is not supported yet

docs/index.html

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc