@expofp/floorplan
Version:
Interactive floor plan library for expos and events
100 lines • 3.41 kB
TypeScript
/**
* A vector outdoor-PoI pin, traced from the outdoor-only app's marker artwork. Coordinates
* are in that artwork's pixel frame (which includes a drop-shadow margin), so
* the numbers can be checked against the source PNGs directly.
*/
export interface PoiPinShape {
/** The artwork frame: the pin plus room for its drop shadow. */
readonly frame: {
readonly width: number;
readonly height: number;
};
/** Width of the visible pin (stroke included) — what the size constants set. */
readonly bodyWidth: number;
/**
* Teardrop outline as SVG path data, starting at the tip apex. For a stroked
* pin this is the stroke's centerline.
*/
readonly outline: string;
readonly strokeWidth: number;
/** Lowest point of {@link outline}, at the horizontal center of the frame. */
readonly tipApexY: number;
/**
* The round head: its center, and the radius of the disc drawn on it (the
* glyph's colored disc, or the selection dot).
*/
readonly head: {
readonly x: number;
readonly y: number;
readonly innerRadius: number;
};
readonly shadow: {
readonly offsetY: number;
readonly blur: number;
};
}
/**
* The category pin (82x96 artwork): a white teardrop around a colored disc
* that carries the poiType glyph.
*/
export declare const POI_MARKER_PIN_SHAPE: {
readonly frame: {
readonly width: 82;
readonly height: 96;
};
readonly bodyWidth: 70;
readonly outline: 'M41 86.13C41.68 85.63 76 61.93 76 36.1A35 35 0 0 0 6 36.1C6 61.93 40.32 85.63 41 86.13Z';
readonly strokeWidth: 0;
readonly tipApexY: 86.13;
readonly head: {
readonly x: 41;
readonly y: 36.1;
readonly innerRadius: 29.3;
};
readonly shadow: {
readonly offsetY: 2;
readonly blur: 4;
};
};
/**
* The selection pin (102x137 artwork): a teardrop filled with the selection
* color, outlined and dotted in a darker shade of it.
*/
export declare const POI_SELECTED_PIN_SHAPE: {
readonly frame: {
readonly width: 102;
readonly height: 137;
};
readonly bodyWidth: 90;
readonly outline: 'M51 125.88C56.54 123.07 94.5 77 94.5 47A43.5 43.5 0 0 0 7.5 47C7.5 77 45.46 123.07 51 125.88Z';
readonly strokeWidth: 3;
readonly tipApexY: 125.88;
readonly head: {
readonly x: 51;
readonly y: 47;
readonly innerRadius: 19;
};
readonly shadow: {
readonly offsetY: 2.5;
readonly blur: 5;
};
};
export interface PoiPinLayout {
/** Artwork frame units → device pixels. */
readonly scale: number;
readonly canvasWidth: number;
readonly canvasHeight: number;
/**
* CSS px to shift the bottom-anchored image down by (MapLibre `icon-offset`),
* so the pin tip — not the shadow below it — sits on the point.
*/
readonly tipOffset: number;
}
/** Sizes a pin whose visible body is `bodyWidthPx` CSS px wide. */
export declare function getPoiPinLayout(shape: PoiPinShape, bodyWidthPx: number, pixelRatio: number): PoiPinLayout;
/**
* The darker shade the selection pin draws its outline and dot in — the
* artwork's #ff4747 → #9a2626 pairing, applied to any selection color.
*/
export declare function getPoiPinShadeColor(color: string): string;
//# sourceMappingURL=poi-pin-shape.d.ts.map