From 66597850ba9b562d3d1f24a34d1c6be643bbdabc Mon Sep 17 00:00:00 2001 From: Wim Looman Date: Thu, 12 Feb 2015 16:46:14 +1300 Subject: [PATCH] Add definitions for Leaflet.label --- leaflet-label/leaflet-label-tests.ts | 140 +++++++++++++++++++++++++++ leaflet-label/leaflet-label.d.ts | 70 ++++++++++++++ 2 files changed, 210 insertions(+) create mode 100644 leaflet-label/leaflet-label-tests.ts create mode 100644 leaflet-label/leaflet-label.d.ts diff --git a/leaflet-label/leaflet-label-tests.ts b/leaflet-label/leaflet-label-tests.ts new file mode 100644 index 0000000000..884f5f67ef --- /dev/null +++ b/leaflet-label/leaflet-label-tests.ts @@ -0,0 +1,140 @@ +/// + +var map: L.Map; +var label: L.Label; + +// Icon +var icon: L.Icon = new L.Icon({ labelAnchor: L.point(1, 1) }); + +// CircleMarker +var circleMarker: L.CircleMarker = new L.CircleMarker(new L.LatLng(0, 0), { labelAnchor: L.point(1, 1) }); + +circleMarker = circleMarker.bindLabel('test', { + className: 'thingy', + clickable: true, + direction: 'right', + noHide: false, + offset: new L.Point(0, 0), + opacity: 0.5, + zoomAnimation: true, +}); + +circleMarker.showLabel(); +circleMarker.hideLabel(); +circleMarker.setLabelNoHide(true); +circleMarker.updateLabelContent('test2'); +label = circleMarker.getLabel() +circleMarker = circleMarker.unbindLabel(); + +// Marker +var marker = new L.Marker(new L.LatLng(0, 0)); + +marker = marker.bindLabel('test', { + className: 'thingy', + clickable: true, + direction: 'right', + noHide: false, + offset: new L.Point(0, 0), + opacity: 0.5, + zoomAnimation: true, +}); + +marker.showLabel(); +marker.hideLabel(); +marker.setLabelNoHide(true); +marker.updateLabelContent('test2'); +label = marker.getLabel() +marker = marker.unbindLabel(); +marker.setOpacity(0.5); +marker.setOpacity(0.5, true); + +// Path +var path: L.Path = new L.Polyline([L.latLng(0, 0)]); + +path = path.bindLabel('test', { + className: 'thingy', + clickable: true, + direction: 'right', + noHide: false, + offset: new L.Point(0, 0), + opacity: 0.5, + zoomAnimation: true, +}); + +path.updateLabelContent('test2'); + +path = path.unbindLabel(); + +// Label + +label.setOpacity(0.7); +label.updateZIndex(5); +label.setLatLng(new L.LatLng(3, 3)); +label.setContent('thing'); +label.close(); + +// Examples from the README +var example: () => void; + +example = () => { + L.marker(L.latLng(-37.7772, 175.2606)).bindLabel('Look revealing label!').addTo(map); +}; + +example = () => { + L.polyline([ + L.latLng(-37.7612, 175.2756), + L.latLng(-37.7702, 175.2796), + L.latLng(-37.7802, 175.2750), + ]).bindLabel('Even polylines can have labels.').addTo(map); +}; + +example = () => { + L.marker(L.latLng(-37.785, 175.263)) + .bindLabel('A sweet static label!', { noHide: true }) + .addTo(map); +}; + +example = () => { + var myIcon = L.icon({ + iconUrl: 'my-icon.png', + iconSize: L.point(20, 20), + iconAnchor: L.point(10, 10), + labelAnchor: L.point(6, 0) // as I want the label to appear 2px past the icon (10 + 2 - 6) + }); + L.marker(L.latLng(-37.7772, 175.2606), { + icon: myIcon + }).bindLabel('My label', { + noHide: true, + direction: 'auto' + }); +}; + +example = () => { + var myIcon = L.icon({ + iconUrl: 'my-icon.png', + iconSize: L.point(20, 20), + iconAnchor: L.point(10, 10), + labelAnchor: L.point(6, 0) // as I want the label to appear 2px past the icon (10 + 2 - 6) + }); + L.marker(L.latLng(-37.7772, 175.2606), { + icon: myIcon + }).bindLabel('Look revealing label!').addTo(map); +}; + +example = () => { + var markerLabel = L.marker(L.latLng(-37.7772, 175.2606)).bindLabel('Look revealing label!').addTo(map); + + // Sets opacity of marker to 0.3 and opacity of label to 1 + markerLabel.setOpacity(0.3); + + // Sets opacity of marker to 0.3 and opacity of label to 0.3 + markerLabel.setOpacity(0.3, true); + + // Sets opacity of marker to 0 and opacity of label to 0 + markerLabel.setOpacity(0); + markerLabel.setOpacity(0, true); + + // Sets opacity of marker to 1 and opacity of label to 1 + markerLabel.setOpacity(1); + markerLabel.setOpacity(1, true); +}; diff --git a/leaflet-label/leaflet-label.d.ts b/leaflet-label/leaflet-label.d.ts new file mode 100644 index 0000000000..b089960252 --- /dev/null +++ b/leaflet-label/leaflet-label.d.ts @@ -0,0 +1,70 @@ +// Type definitions for Leaflet.label v0.2.1 +// Project: https://github.com/Leaflet/Leaflet.label +// Definitions by: Wim Looman +// Definitions: https://github.com/borisyankov/DefinitelyTyped + +/// + +declare module L { + export interface IconOptions { + labelAnchor?: Point; + } + + export interface CircleMarkerOptions { + labelAnchor?: Point; + } + + export interface Marker { + showLabel(): Marker; + hideLabel(): Marker; + setLabelNoHide(noHide: boolean): void; + bindLabel(content: string, options?: LabelOptions): Marker; + unbindLabel(): Marker; + updateLabelContent(content: string): void; + getLabel(): Label; + setOpacity(opacity: number, labelHasSemiTransparency: boolean): void; + } + + export interface CircleMarker { + showLabel(): CircleMarker; + hideLabel(): CircleMarker; + setLabelNoHide(noHide: boolean): void; + bindLabel(content: string, options?: LabelOptions): CircleMarker; + unbindLabel(): CircleMarker; + updateLabelContent(content: string): void; + getLabel(): Label; + } + + export interface FeatureGroup { + clearLayers(): FeatureGroup; + bindLabel(content: string, options?: LabelOptions): FeatureGroup; + unbindLabel(): FeatureGroup; + updateLabelContent(content: string): FeatureGroup; + } + + export interface Path { + bindLabel(content: string, options?: LabelOptions): Path; + unbindLabel(): Path; + updateLabelContent(content: string): void; + } + + export interface LabelOptions { + className?: string; + clickable?: boolean; + direction?: string; // 'left' | 'right' | 'auto'; + noHide?: boolean; + offset?: Point; + opacity?: number; + zoomAnimation?: boolean; + } + + export interface Label extends IEventPowered