commit 33f86099d210db726edfab8df45f4142b3695cad
parent 62a008a4d9e81b5f868e5a279d4394226a094a4b
Author: Sergej Orlov <wladimirych@gmail.com>
Date: Sat, 3 Dec 2016 16:56:03 +0300
[track list] added ruler button
Diffstat:
4 files changed, 45 insertions(+), 2 deletions(-)
diff --git a/src/App.js b/src/App.js
@@ -14,6 +14,7 @@ import fixAnimationBug from 'lib/leaflet.fixAnimationBug/leaflet.fixAnimationBug
import './adaptive.css';
import 'lib/leaflet.control.panoramas/panoramas';
import 'lib/leaflet.control.track-list/track-list';
+import 'lib/leaflet.control.track-list/control-ruler';
import 'lib/leaflet.control.track-list/track-list.hash-state';
import 'lib/leaflet.control.track-list/track-list.localstorage';
import enableLayersControlAdaptiveHeight from 'lib/leaflet.control.layers.adaptive-height/adaptive-height';
@@ -36,6 +37,8 @@ function setUp() {
);
map.enableHashState('m', [10, 55.75185, 37.61856]);
+ const tracklist = new L.Control.TrackList();
+
/////////// controls top-left corner
new L.Control.Caption(`<a href=mailto:${config.email}">nakarte@nakarte.tk</a>`, {
@@ -45,6 +48,8 @@ function setUp() {
L.control.zoom().addTo(map);
+ new L.Control.TrackList.Ruler(tracklist).addTo(map);
+
new L.Control.Panoramas(document.getElementById('street-view'))
.addTo(map)
.enableHashState('n');
@@ -68,8 +73,7 @@ function setUp() {
/////////// controls bottom-right corner
- const tracklist = new L.Control.TrackList()
- .addTo(map);
+ tracklist.addTo(map);
if (!hashState.getState('nktk')) {
tracklist.loadTracksFromStorage();
}
diff --git a/src/lib/leaflet.control.track-list/control-ruler.js b/src/lib/leaflet.control.track-list/control-ruler.js
@@ -0,0 +1,28 @@
+import L from 'leaflet';
+import './track-list';
+import './ruler.css';
+import 'lib/controls-styles/controls-styles.css';
+import './track-list';
+
+L.Control.TrackList.Ruler = L.Control.extend({
+ options: {
+ position: 'topleft'
+ },
+
+ initialize: function(trackList, options) {
+ L.Control.prototype.initialize.call(this, options);
+ this._trackList = trackList;
+ },
+
+ onAdd: function(map) {
+ this._map = map;
+ const container = L.DomUtil.create('div', 'leaflet-control leaflet-control-button leaflet-control-ruler');
+ L.DomEvent.on(container, 'click', this.onClick, this);
+ return container;
+ },
+
+ onClick: function() {
+ this._trackList.addNewTrack('Ruler').measureTicksShown(true);
+ }
+
+});
+\ No newline at end of file
diff --git a/src/lib/leaflet.control.track-list/images/ruler.svg b/src/lib/leaflet.control.track-list/images/ruler.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 490 490" style="enable-background:new 0 0 490 490;" xml:space="preserve" width="512px" height="512px">
+<path d="M486.946,357.909L366.303,237.273l96.407-96.402c31.311-31.319,31.316-82.267,0-113.582 c-27.16-27.158-77.764-35.823-113.589,0l-96.407,96.401L132.07,3.053c-4.071-4.071-10.667-4.071-14.739,0L6.918,113.45 c-5.92,5.92-1.954,12.784,0,14.738l120.644,120.637l-84.874,84.879c-0.276,0.276-1.885,1.981-2.636,4.45 c-0.006,0.02-0.015,0.039-0.021,0.059L0.495,476.591c-2.714,8.442,6.312,15.407,12.887,12.886l138.386-39.543 c0.02-0.006,0.037-0.015,0.057-0.021c0.387-0.112,3.379-1.183,4.452-2.636l84.874-84.869l120.654,120.647 c3.337,3.336,10.009,4.73,14.739,0l110.403-110.407C491.018,368.576,491.018,361.98,486.946,357.909z M363.86,42.027 c21.647-21.646,59.481-24.629,84.111,0c23.183,23.182,23.177,60.919,0,84.106l-96.408,96.401l-84.11-84.105L363.86,42.027z M25.698,464.275l29.52-103.303l73.789,73.785L25.698,464.275z M226.411,347.669l-77.505,77.499l-84.109-84.096l77.504-77.509 L226.411,347.669z M369.174,460.946l-35.962-35.96l47.016-47.005l-14.739-14.739l-47.017,47.005l-35.955-35.953l16.288-16.294 l-14.74-14.739l-16.288,16.294l-35.961-35.958l47.017-47.005l-14.74-14.738l-47.016,47.006l-35.956-35.954l16.289-16.294 l-14.74-14.738l-16.288,16.294l-35.961-35.959l47.017-47.005l-14.74-14.739l-47.017,47.005l-35.955-35.953l16.288-16.294 l-14.739-14.739l-16.289,16.294l-35.961-35.959l95.674-95.658l340.136,340.117L369.174,460.946z" fill="#333"/>
+</svg>
diff --git a/src/lib/leaflet.control.track-list/ruler.css b/src/lib/leaflet.control.track-list/ruler.css
@@ -0,0 +1,4 @@
+.leaflet-control-ruler {
+ background-image: url("images/ruler.svg");
+ background-size: 16px 16px;
+}
+\ No newline at end of file
