mirror of
https://github.com/muerwre/orchidmap-front.git
synced 2025-04-25 19:16:41 +07:00
added arrows
This commit is contained in:
parent
dfb4d3b98f
commit
968c871c11
6 changed files with 83 additions and 7 deletions
22
src/utils/arrow.ts
Normal file
22
src/utils/arrow.ts
Normal 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>`
|
||||
});
|
|
@ -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));
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue