muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 02:56:41 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

handling distance changes

Browse source
This commit is contained in:
muerwre 2019-02-22 16:50:30 +07:00
parent 28c51666a0
commit 948a7c5739
1 changed files with 32 additions and 86 deletions
Download patch file Download diff file Expand all files Collapse all files

118
src/modules/Poly.ts
View file

@ -31,24 +31,10 @@ export class Poly {
color: 'url(#activePathGradient)',
weight: 6,
maxMarkers: 300,
});
// this.poly = new EditablePolyline([], {
// ...polyStyle,
// maxMarkers: 100,
//
// onPointsSet: this.updateMarks,
// onMarkerDragEnd: this.updateMarks,
// onPointAdded: this.updateMarks,
// onPointDropped: this.updateMarks,
// onContinueDrawing: this.setModeOnDrawing,
//
// onMarkersHide: () => editor.setMarkersShown(false),
// onMarkersShow: () => editor.setMarkersShown(true),
// }).addTo(map);
})
.on('distancechange', this.onDistanceUpdate);
this.poly.addTo(map);
// todo: uncomment
// this.poly._reloadPolyline();
this.editor = editor;
this.map = map;
@ -61,72 +47,47 @@ export class Poly {
this.arrows.addTo(map);
}
setModeOnDrawing = (): void => {
if (this.editor.getMode() !== MODES.POLY) this.editor.setMode(MODES.POLY);
};
drawArrows = () => {
// todo: fix this
this.arrows.clearLayers();
const { latlngs } = this;
if (!latlngs || latlngs.length <= 1) return;
latlngs.forEach((latlng, i) => {
if (i === 0) return;
const mid = middleCoord(latlngs[i], latlngs[i - 1]);
const dist = findDistance(latlngs[i - 1].lat, latlngs[i - 1].lng, latlngs[i].lat, latlngs[i].lng);
if (dist <= 1) return;
const slide = new Polyline(
[
latlngs[i - 1],
[mid.lat, mid.lng]
],
{ color: 'none', weight: CLIENT.STROKE_WIDTH }
).addTo(this.arrows) as any;
// todo: uncomment and fix this:
slide._path.setAttribute('marker-end', 'url(#long-arrow)');
});
};
updateMarks = () => {
const coords = this.poly.toGeoJSON().geometry.coordinates;
// const meters = (this.latlngs && this.latlngs.length > 1 && getPolyLength(this.latlngs)) || 0;
// const kilometers = (meters && Number(meters.toFixed(1))) || 0;
const kilometers = ((this.latlngs && this.latlngs.length > 1 && getPolyLength(this.latlngs)) || 0);
this.setDistance(parseFloat(kilometers.toFixed(2)));
this.routerMoveStart();
this.drawArrows(); // <-- uncomment
if (coords.length > 1) this.triggerOnChange();
onDistanceUpdate = (event) => {
const { distance } = event as { distance: number };
this.setDistance(parseFloat(distance.toFixed(2)));
};
// setModeOnDrawing = (): void => {
// if (this.editor.getMode() !== MODES.POLY) this.editor.setMode(MODES.POLY);
// };
//
// preventMissClicks = (e): void => {
// const mode = this.editor.getMode();
// drawArrows = () => {
// // todo: fix this
// this.arrows.clearLayers();
// const { latlngs } = this;
//
// if (mode === MODES.POLY) return;
// if (!latlngs || latlngs.length <= 1) return;
//
// e.cancel();
// latlngs.forEach((latlng, i) => {
// if (i === 0) return;
//
// if (mode === MODES.NONE) this.editor.setMode(MODES.POLY);
// const mid = middleCoord(latlngs[i], latlngs[i - 1]);
// const dist = findDistance(latlngs[i - 1].lat, latlngs[i - 1].lng, latlngs[i].lat, latlngs[i].lng);
//
// if (dist <= 1) return;
//
// const slide = new Polyline(
// [
// latlngs[i - 1],
// [mid.lat, mid.lng]
// ],
// { color: 'none', weight: CLIENT.STROKE_WIDTH }
// ).addTo(this.arrows) as any;
//
// // todo: uncomment and fix this:
// slide._path.setAttribute('marker-end', 'url(#long-arrow)');
// });
// };
continue = (): void => {
// todo: implement
this.poly.editor.continue();
};
stop = (): void => {
// todo: implement
// if (this.poly) this.poly.editor.stopDrawing();
this.poly.stopDrawing();
};
@ -134,20 +95,10 @@ export class Poly {
this.poly.editor.enable();
};
continueForward = (): void => {
// todo: implement
this.poly.editor.continue();
};
lockMap = (): void => {
this.lockMapClicks(true);
};
setPoints = (latlngs: Array<ILatLng>): void => {
console.log('setP');
if (!latlngs || latlngs.length <= 1) return;
// todo: implement
this.poly.setPoints(latlngs);
};
@ -160,18 +111,13 @@ export class Poly {
];
this.poly.setPoints(summary);
this.updateMarks();
};
clearAll = (): void => {
// this.poly.setLatLngs([]);
// todo: implement
// this.poly.editor.clear();
this.poly.setPoints([]);
this.updateMarks();
};
clearArrows = (): LayerGroup<any> => this.arrows.clearLayers();
// clearArrows = (): LayerGroup<any> => this.arrows.clearLayers();
dumpData = (): Array<LatLng> => this.latlngs;