Add graphic scale (fixes #23)

pull/108/head
Candid Dauth 2017-05-28 00:24:40 +02:00
rodzic 6f3f5106d2
commit 12d1574f28
5 zmienionych plików z 37 dodań i 1 usunięć

Wyświetl plik

@ -5,6 +5,7 @@ import 'leaflet-almostover';
import 'leaflet.locatecontrol'; import 'leaflet.locatecontrol';
import 'leaflet.markercluster'; import 'leaflet.markercluster';
import 'leaflet-mouse-position'; import 'leaflet-mouse-position';
import 'leaflet-graphicscale';
fm.app.directive("facilmap", function(fmUtils, fmMapMessages, fmMapMarkers, $compile, fmMapLines, fmMapTypes, fmMapViews, $rootScope, fmMapPad, $timeout, $sce, fmMapHistory, $q, fmClient, fmInfoBox, fmMapRoute) { fm.app.directive("facilmap", function(fmUtils, fmMapMessages, fmMapMarkers, $compile, fmMapLines, fmMapTypes, fmMapViews, $rootScope, fmMapPad, $timeout, $sce, fmMapHistory, $q, fmClient, fmInfoBox, fmMapRoute) {
@ -136,6 +137,8 @@ fm.app.directive("facilmap", function(fmUtils, fmMapMessages, fmMapMarkers, $com
this.map.createPane("fmHighlightShadowPane"); this.map.createPane("fmHighlightShadowPane");
this.map.createPane("fmHighlightPane"); this.map.createPane("fmHighlightPane");
this.map._controlCorners.bottomcenter = L.DomUtil.create("div", "leaflet-bottom fm-leaflet-center", this.map._controlContainer);
$scope.$watch("client.padData.clusterMarkers", (clusterMarkers) => { $scope.$watch("client.padData.clusterMarkers", (clusterMarkers) => {
var currentMarkers = this.markerCluster ? this.markerCluster.getLayers() : [ ]; var currentMarkers = this.markerCluster ? this.markerCluster.getLayers() : [ ];
@ -170,6 +173,11 @@ fm.app.directive("facilmap", function(fmUtils, fmMapMessages, fmMapMarkers, $com
position: "bottomright" position: "bottomright"
}).addTo(this.map); }).addTo(this.map);
L.control.graphicScale({
fill: "hollow",
position: "bottomcenter"
}).addTo(this.map);
this.map.on('almost:over', (e) => { this.map.on('almost:over', (e) => {
e.layer.fire('fm-almostover', e); e.layer.fire('fm-almostover', e);
$(this.map.getContainer()).addClass("fm-almostover"); $(this.map.getContainer()).addClass("fm-almostover");

Wyświetl plik

@ -74,6 +74,18 @@
font-size: inherit; font-size: inherit;
} }
.fm-leaflet-center {
left: 50%;
transform: translateX(-50%);
text-align: center;
.leaflet-control {
display: inline-block;
float: none;
clear: none;
}
}
.leaflet-control.leaflet-control-mouseposition { .leaflet-control.leaflet-control-mouseposition {
float: left; float: left;
pointer-events: none; pointer-events: none;
@ -88,6 +100,16 @@
} }
} }
.leaflet-control.leaflet-control-graphicscale {
margin-bottom: 0;
pointer-events: none;
.label {
color: #000;
text-shadow: 0 0 3px #fff, 0 0 5px #fff, 0 0 10px #fff;
}
}
.leaflet-fmHighlightMarker-pane { .leaflet-fmHighlightMarker-pane {
z-index: 621; z-index: 621;
} }

Wyświetl plik

@ -42,6 +42,7 @@
"leaflet": "^1.0.3", "leaflet": "^1.0.3",
"leaflet-almostover": "git+https://github.com/makinacorpus/Leaflet.AlmostOver.git#gh-pages", "leaflet-almostover": "git+https://github.com/makinacorpus/Leaflet.AlmostOver.git#gh-pages",
"leaflet-geometryutil": "^0.8.0", "leaflet-geometryutil": "^0.8.0",
"leaflet-graphicscale": "^0.0.2",
"leaflet-hash": "^0.2.1", "leaflet-hash": "^0.2.1",
"leaflet-mouse-position": "^1.0.1", "leaflet-mouse-position": "^1.0.1",
"leaflet-simple-graticule": "^1.0.2", "leaflet-simple-graticule": "^1.0.2",

Wyświetl plik

@ -27,7 +27,8 @@ const addDeps = {
"leaflet.locatecontrol": [ "leaflet.locatecontrol/dist/L.Control.Locate.css" ], "leaflet.locatecontrol": [ "leaflet.locatecontrol/dist/L.Control.Locate.css" ],
"leaflet.markercluster": [ "leaflet.markercluster/dist/MarkerCluster.css", "leaflet.markercluster/dist/MarkerCluster.Default.css" ], "leaflet.markercluster": [ "leaflet.markercluster/dist/MarkerCluster.css", "leaflet.markercluster/dist/MarkerCluster.Default.css" ],
"leaflet.elevation": [ require.resolve("leaflet.elevation/dist/Leaflet.Elevation-0.0.2.css") ], "leaflet.elevation": [ require.resolve("leaflet.elevation/dist/Leaflet.Elevation-0.0.2.css") ],
"leaflet-mouse-position": [ "leaflet-mouse-position/src/L.Control.MousePosition.css" ] "leaflet-mouse-position": [ "leaflet-mouse-position/src/L.Control.MousePosition.css" ],
"leaflet-graphicscale": [ "leaflet-graphicscale/src/Leaflet.GraphicScale.scss" ]
}; };
for(let i in addDeps) { for(let i in addDeps) {

Wyświetl plik

@ -2739,6 +2739,10 @@ leaflet-geometryutil@^0.8.0:
dependencies: dependencies:
leaflet ">=0.7.0" leaflet ">=0.7.0"
leaflet-graphicscale@^0.0.2:
version "0.0.2"
resolved "https://registry.yarnpkg.com/leaflet-graphicscale/-/leaflet-graphicscale-0.0.2.tgz#ab620d289e9a7044c2f5107c83be17843aec5303"
leaflet-hash@^0.2.1: leaflet-hash@^0.2.1:
version "0.2.1" version "0.2.1"
resolved "https://registry.yarnpkg.com/leaflet-hash/-/leaflet-hash-0.2.1.tgz#c36c718347c5243033b57cb4baea26119d82c701" resolved "https://registry.yarnpkg.com/leaflet-hash/-/leaflet-hash-0.2.1.tgz#c36c718347c5243033b57cb4baea26119d82c701"