mapkick-rb 0.1.2 → 0.1.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +4 -0
- data/README.md +6 -4
- data/lib/mapkick/version.rb +1 -1
- data/licenses/LICENSE-mapkick-bundle.txt +1 -1
- data/vendor/assets/javascripts/mapkick.bundle.js +49 -14
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 5af8b1f85970b613f96f189922c9be421f657e9c56d3986976ae3cdf366a9f2b
|
4
|
+
data.tar.gz: 4de73c3a4b3d91dc42b93a607cec9daa8a26adfbdba99a70bad660d38a0037dc
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: d3c4f0f38d8039fb1caf42fd5e45fd3abd5051ed90411ed38ee5a237b89cd3728fcfecef2189887e2649ad7397e20f49a984935567e8a7e0873ade87de5509fd
|
7
|
+
data.tar.gz: bc67f76b17cf72d8e2ad6f2a23408ca06c84c6fc06a118dedccd930b8a60838ac4a0e5ba013c6205a17155b6aaf6d79322cf9af7b03e82c0211a7cfbbd368fe9
|
data/CHANGELOG.md
CHANGED
data/README.md
CHANGED
@@ -109,14 +109,15 @@ Or a URL that returns JSON (same format as above)
|
|
109
109
|
|
110
110
|
Use `latitude` or `lat` for latitude and `longitude`, `lon`, or `lng` for longitude
|
111
111
|
|
112
|
-
You can specify a label and
|
112
|
+
You can specify a label, tooltip, and color for each data point
|
113
113
|
|
114
114
|
```ruby
|
115
115
|
{
|
116
116
|
latitude: ...,
|
117
117
|
longitude: ...,
|
118
118
|
label: "Hot Chicken Takeover",
|
119
|
-
tooltip: "5 stars"
|
119
|
+
tooltip: "5 stars",
|
120
|
+
color: "#f84d4d"
|
120
121
|
}
|
121
122
|
```
|
122
123
|
|
@@ -124,13 +125,14 @@ You can specify a label and tooltip for each data point
|
|
124
125
|
|
125
126
|
Use `geometry` with a GeoJSON `Polygon` or `MultiPolygon`
|
126
127
|
|
127
|
-
You can specify a label and
|
128
|
+
You can specify a label, tooltip, and color for each data point
|
128
129
|
|
129
130
|
```ruby
|
130
131
|
{
|
131
132
|
geometry: {type: "Polygon", coordinates: ...},
|
132
133
|
label: "Hot Chicken Takeover",
|
133
|
-
tooltip: "5 stars"
|
134
|
+
tooltip: "5 stars",
|
135
|
+
color: "#0090ff"
|
134
136
|
}
|
135
137
|
```
|
136
138
|
|
data/lib/mapkick/version.rb
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
/*
|
2
2
|
* This bundle includes:
|
3
3
|
*
|
4
|
-
* Mapkick.js v0.2.
|
4
|
+
* Mapkick.js v0.2.4
|
5
5
|
* https://github.com/ankane/mapkick.js
|
6
6
|
* MIT License
|
7
7
|
*
|
@@ -260,6 +260,13 @@
|
|
260
260
|
return element
|
261
261
|
}
|
262
262
|
|
263
|
+
// check for hex or named color
|
264
|
+
function validateColor(color) {
|
265
|
+
if (!/^#([0-9a-f]{3}){1,2}$/i.test(color) && !/^[a-z]+$/i.test(color)) {
|
266
|
+
throw new Error("Invalid color")
|
267
|
+
}
|
268
|
+
}
|
269
|
+
|
263
270
|
function createMarkerImage(library, color) {
|
264
271
|
// set height to center vertically
|
265
272
|
var height = 41;
|
@@ -276,10 +283,7 @@
|
|
276
283
|
svg.setAttribute("width", width);
|
277
284
|
svg.setAttribute("viewBox", ("0 0 " + width + " " + height));
|
278
285
|
|
279
|
-
|
280
|
-
if (!/^#([0-9a-f]{3}){1,2}$/i.test(color) && !/^[a-z]+$/i.test(color)) {
|
281
|
-
throw new Error("Invalid color")
|
282
|
-
}
|
286
|
+
validateColor(color);
|
283
287
|
|
284
288
|
// set color
|
285
289
|
svg.querySelector("*[fill='#3FB1CE']").setAttribute("fill", color);
|
@@ -440,6 +444,9 @@
|
|
440
444
|
});
|
441
445
|
}
|
442
446
|
|
447
|
+
// use Map instead of object for security
|
448
|
+
var markerIds = new window.Map();
|
449
|
+
|
443
450
|
function generateGeoJSON(data, options) {
|
444
451
|
var geojson = {
|
445
452
|
type: "FeatureCollection",
|
@@ -459,6 +466,19 @@
|
|
459
466
|
properties.mapkickIconAnchor = properties.icon === "mapkick" ? "bottom" : "center";
|
460
467
|
properties.mapkickIconOffset = properties.icon === "mapkick" ? [0, 10] : [0, 0];
|
461
468
|
|
469
|
+
if (properties.icon === "mapkick") {
|
470
|
+
var color = properties.color || markerOptions.color || "#f84d4d";
|
471
|
+
|
472
|
+
var markerId = markerIds.get(color);
|
473
|
+
if (markerId === undefined) {
|
474
|
+
markerId = markerIds.size;
|
475
|
+
validateColor(color);
|
476
|
+
markerIds.set(color, markerId);
|
477
|
+
}
|
478
|
+
|
479
|
+
properties.icon = "mapkick-" + markerId;
|
480
|
+
}
|
481
|
+
|
462
482
|
var coordinates = rowCoordinates(row);
|
463
483
|
|
464
484
|
if (!coordinates[1]) {
|
@@ -481,6 +501,9 @@
|
|
481
501
|
}
|
482
502
|
|
483
503
|
delete properties.geometry;
|
504
|
+
|
505
|
+
properties.mapkickColor = properties.color || markerOptions.color || "#0090ff";
|
506
|
+
|
484
507
|
}
|
485
508
|
|
486
509
|
geojson.features.push({
|
@@ -625,8 +648,6 @@
|
|
625
648
|
}
|
626
649
|
});
|
627
650
|
} else {
|
628
|
-
var fillColor = markerOptions.color || "#0090ff";
|
629
|
-
|
630
651
|
var beforeId = layerBeforeFill(map);
|
631
652
|
|
632
653
|
var outlineId = name + "-outline";
|
@@ -635,7 +656,7 @@
|
|
635
656
|
source: name,
|
636
657
|
type: "line",
|
637
658
|
paint: {
|
638
|
-
"line-color":
|
659
|
+
"line-color": {type: "identity", property: "mapkickColor"},
|
639
660
|
"line-opacity": 0.7,
|
640
661
|
"line-width": 1
|
641
662
|
}
|
@@ -646,7 +667,7 @@
|
|
646
667
|
source: name,
|
647
668
|
type: "fill",
|
648
669
|
paint: {
|
649
|
-
"fill-color":
|
670
|
+
"fill-color": {type: "identity", property: "mapkickColor"},
|
650
671
|
"fill-opacity": 0.3
|
651
672
|
}
|
652
673
|
}, outlineId);
|
@@ -715,7 +736,7 @@
|
|
715
736
|
return
|
716
737
|
}
|
717
738
|
|
718
|
-
if (feature.properties.icon
|
739
|
+
if (mapType === "point" && feature.properties.icon.startsWith("mapkick-")) {
|
719
740
|
popup.options.offset = {
|
720
741
|
"top": [0, 14],
|
721
742
|
"top-left": [0, 14],
|
@@ -909,10 +930,13 @@
|
|
909
930
|
});
|
910
931
|
}
|
911
932
|
|
912
|
-
var
|
913
|
-
|
914
|
-
|
915
|
-
|
933
|
+
var outstanding = markerIds.size;
|
934
|
+
|
935
|
+
function checkReady() {
|
936
|
+
if (outstanding !== 0) {
|
937
|
+
outstanding--;
|
938
|
+
return
|
939
|
+
}
|
916
940
|
|
917
941
|
addLayer("objects", geojson);
|
918
942
|
|
@@ -921,7 +945,18 @@
|
|
921
945
|
while ((cb = layersReadyQueue.shift())) {
|
922
946
|
cb();
|
923
947
|
}
|
948
|
+
}
|
949
|
+
|
950
|
+
// load marker images
|
951
|
+
markerIds.forEach(function (id, color) {
|
952
|
+
var image = createMarkerImage(library, color);
|
953
|
+
image.addEventListener("load", function () {
|
954
|
+
map.addImage(("mapkick-" + id + "-15"), image);
|
955
|
+
checkReady();
|
956
|
+
});
|
924
957
|
});
|
958
|
+
|
959
|
+
checkReady();
|
925
960
|
});
|
926
961
|
};
|
927
962
|
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: mapkick-rb
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.1.
|
4
|
+
version: 0.1.3
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Andrew Kane
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2023-02-
|
11
|
+
date: 2023-02-13 00:00:00.000000000 Z
|
12
12
|
dependencies: []
|
13
13
|
description:
|
14
14
|
email: andrew@ankane.org
|