Cluster and spiderify packages near each other

master
Skylar Ittner 5 years ago
parent e696e0231c
commit e8f22d5415

@ -29,7 +29,7 @@ if ("geolocation" in navigator) {
if (lastGpsUpdateTimestamp < (currentTimestamp - 10)) {
updateDistances(position.coords.latitude, position.coords.longitude);
if (map != null) {
map.updatePackageLayer(packages);
//map.updatePackageLayer(packages);
}
lastGpsUpdateTimestamp = currentTimestamp;

@ -28,7 +28,7 @@ function leafletMap() {
iconLoading: "far fa-compass fa-spin"
}).addTo(map);
map.packagelayer = L.layerGroup();
map.packagelayer = L.markerClusterGroup();
map.packagelayer.addTo(map);
@ -64,7 +64,7 @@ function leafletMap() {
iconAnchor: [12.5, 12.5]
});
L.marker(
var marker = L.marker(
[
package.coords[0],
package.coords[1]
@ -72,10 +72,11 @@ function leafletMap() {
{
icon: icon
})
.on('click', function () {
.on("click", function () {
openPackageInfoSheet(package);
})
.addTo(map.packagelayer);
});
map.packagelayer.addLayer(marker);
});
}

@ -5,6 +5,8 @@
<link rel="stylesheet" href="node_modules/framework7/css/framework7.bundle.min.css" />
<link rel="stylesheet" href="assets/fontawesome/css/all.min.css" />
<link rel="stylesheet" href="node_modules/leaflet/dist/leaflet.css" />
<link rel="stylesheet" href="node_modules/leaflet.markercluster/dist/MarkerCluster.css" />
<link rel="stylesheet" href="node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css" />
<link rel="stylesheet" href="node_modules/leaflet.locatecontrol/dist/L.Control.Locate.min.css" />
<link rel="stylesheet" href="assets/css/backdrop.css" />
@ -23,6 +25,7 @@
<script src="node_modules/framework7/js/framework7.bundle.min.js"></script>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/leaflet/dist/leaflet.js"></script>
<script src="node_modules/leaflet.markercluster/dist/leaflet.markercluster.js"></script>
<script src="node_modules/leaflet.locatecontrol/dist/L.Control.Locate.min.js"></script>
<script src="assets/js/platform.js"></script>

@ -8,7 +8,8 @@
"jquery": "^3.4.1",
"leaflet": "^1.5.1",
"leaflet-geometryutil": "^0.9.1",
"leaflet.locatecontrol": "^0.67.0"
"leaflet.locatecontrol": "^0.67.0",
"leaflet.markercluster": "^1.4.1"
},
"devDependencies": {}
}

@ -1,66 +0,0 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<div class="page" data-name="signin">
<div class="navbar">
<div class="navbar-inner">
<div class="title">Sign In</div>
</div>
</div>
<div class="page-content">
<div class="block">
<div class="row" style="justify-content: center;">
<div class="card col-100 tablet-50">
<div class="card-content card-content-padding">
<div class="list no-hairlines">
<ul>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-floating-label">Username</div>
<div class="item-input-wrap">
<input type="text" id="username" placeholder="" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" pattern="[a-z0-9]+" />
<span class="input-clear-button"></span>
</div>
</div>
</li>
<li class="item-content item-input">
<div class="item-inner">
<div class="item-title item-floating-label">Password</div>
<div class="item-input-wrap">
<input type="password" id="password" placeholder="" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
<span class="input-clear-button"></span>
</div>
</div>
</li>
</ul>
</div>
<br />
<br />
<div class="button button-fill button-raised button-round button-large" onclick="setupAccount()">
Sign In
</div>
<br />
<div class="button button-outline button-raised button-round button-large" onclick="openBrowser(SETTINGS['signup_url'])">
Create Account
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/signin.js"></script>
</div>

@ -36,6 +36,11 @@ leaflet.locatecontrol@^0.67.0:
resolved "https://registry.yarnpkg.com/leaflet.locatecontrol/-/leaflet.locatecontrol-0.67.0.tgz#adfeebfd662f61d639a5a5fba362368579f8ac55"
integrity sha512-3R8jYBwYyXc5Ka7bZvx6naWUvfmJTGJfZ2o/ZWombhCK7NkOxEpwFA3bhW9/BRZ99cLyjeNuLUaLwcPrMKYrjA==
leaflet.markercluster@^1.4.1:
version "1.4.1"
resolved "https://registry.yarnpkg.com/leaflet.markercluster/-/leaflet.markercluster-1.4.1.tgz#b53f2c4f2ca7306ddab1dbb6f1861d5e8aa6c5e5"
integrity sha512-ZSEpE/EFApR0bJ1w/dUGwTSUvWlpalKqIzkaYdYB7jaftQA/Y2Jav+eT4CMtEYFj+ZK4mswP13Q2acnPBnhGOw==
leaflet@>=0.7.0, leaflet@^1.5.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/leaflet/-/leaflet-1.5.1.tgz#9afb9d963d66c870066b1342e7a06f92840f46bf"

Loading…
Cancel
Save