added arrows

This commit is contained in:
muerwre 2019-02-26 17:18:45 +07:00
parent dfb4d3b98f
commit 968c871c11
6 changed files with 83 additions and 7 deletions

22
src/utils/arrow.ts Normal file
View file

@ -0,0 +1,22 @@
import { divIcon, LatLngLiteral, Marker, marker, DivIcon } from "leaflet";
export const createArrow = (latlng: LatLngLiteral, angle: number): Marker => marker(latlng, {
draggable: false,
interactive: false,
icon: divIcon({
html: `
<div class="leaflet-arrow" style="transform: rotate(${angle}deg);">
<svg width="40" height="40" preserveAspectRatio="xMidYMid">
<use xlink:href="#path-arrow" transform="scale(2)"/>
</svg>
</div>
`,
className: 'leaflet-arrow-icon',
iconSize: [11, 11],
iconAnchor: [6, 6]
})
});
export const arrowClusterIcon = (): DivIcon => divIcon({
html: `<div class="leaflet-arrow-cluster"></div>`
});

View file

@ -1,4 +1,4 @@
import { LatLng, LatLngLiteral } from "leaflet";
import { LatLng, LatLngLiteral, Point } from "leaflet";
interface ILatLng {
lat: number,
@ -58,7 +58,7 @@ export const pointInArea = (A: LatLng, B: LatLng, C: LatLng, radius: number = 0.
);
const dist2 = (A: LatLngLiteral, B: LatLngLiteral): number => (((A.lat - B.lat) ** 2) + ((A.lng - B.lng) ** 2));
export const dist2 = (A: LatLngLiteral, B: LatLngLiteral): number => (((A.lat - B.lat) ** 2) + ((A.lng - B.lng) ** 2));
const distToSegmentSquared = (A: LatLng, B: LatLng, C: LatLng): number => {
const l2 = dist2(A, B);
@ -83,3 +83,5 @@ const distToSegmentSquared = (A: LatLng, B: LatLng, C: LatLng): number => {
export const distToSegment = (A: LatLng, B: LatLng, C: LatLng): number => Math.sqrt(distToSegmentSquared(A, B, C));
// if C between A and B
export const pointBetweenPoints = (A: LatLng, B: LatLng, C: LatLng): boolean => (distToSegment(A, B, C) < 0.01);
export const angleBetweenPoints = (A: Point, B: Point): number => parseFloat(((Math.atan2(B.y - A.y, B.x - A.x))* 180 / Math.PI).toFixed(6));