kopia lustrzana https://github.com/paraboul/mapchecking
Porównaj commity
2 Commity
5362f69884
...
912620e44d
Autor | SHA1 | Data |
---|---|---|
Anthony Catel | 912620e44d | |
Anthony Catel | 4d7ccbb288 |
|
@ -9,6 +9,7 @@
|
||||||
"@googlemaps/js-api-loader": "^1.4.0",
|
"@googlemaps/js-api-loader": "^1.4.0",
|
||||||
"@types/google.maps": "^3.48.3",
|
"@types/google.maps": "^3.48.3",
|
||||||
"@vitejs/plugin-vue": "^2.2.4",
|
"@vitejs/plugin-vue": "^2.2.4",
|
||||||
|
"@vueuse/core": "^8.2.0",
|
||||||
"js-base64": "^3.5.2",
|
"js-base64": "^3.5.2",
|
||||||
"tailwindcss": "^3.0.23",
|
"tailwindcss": "^3.0.23",
|
||||||
"tatween": "^0.2.0",
|
"tatween": "^0.2.0",
|
||||||
|
|
|
@ -5,12 +5,14 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { Loader as MapLoader } from '@googlemaps/js-api-loader';
|
import { Loader as MapLoader } from '@googlemaps/js-api-loader';
|
||||||
import { Base64 } from 'js-base64'
|
import { Base64 } from 'js-base64'
|
||||||
import { onMounted, ref, watch, computed } from 'vue';
|
import { onMounted, ref, watch, computed } from 'vue';
|
||||||
|
import { watchDebounced } from '@vueuse/core'
|
||||||
|
|
||||||
|
|
||||||
|
const DEFAULT_MAP_POSITION = [48.862895, 2.286978, 18]
|
||||||
|
|
||||||
const loader = new MapLoader({
|
const loader = new MapLoader({
|
||||||
apiKey: "AIzaSyD7Vm3gm4Fm7jSkuIh_yM14GmYhz1P_S4M",
|
apiKey: "AIzaSyD7Vm3gm4Fm7jSkuIh_yM14GmYhz1P_S4M",
|
||||||
|
@ -29,14 +31,13 @@
|
||||||
(event: "hashChange", val: string): void
|
(event: "hashChange", val: string): void
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
const mapPosition = ref([48.862895, 2.286978, 18])
|
const mapPosition = ref(DEFAULT_MAP_POSITION)
|
||||||
const arrPoly = ref<google.maps.LatLng[]>([])
|
const arrPoly = ref<google.maps.LatLng[]>([])
|
||||||
const mapLoaded = ref(false);
|
const mapLoaded = ref(false);
|
||||||
const pacinput = ref()
|
const pacinput = ref()
|
||||||
|
|
||||||
let currentMap : google.maps.Map | undefined;
|
let currentMap : google.maps.Map | undefined;
|
||||||
let currentPolygon : google.maps.Polygon | undefined;
|
let currentPolygon : google.maps.Polygon | undefined;
|
||||||
let $updateHashTimer = null;
|
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
loader.loadCallback(e => {
|
loader.loadCallback(e => {
|
||||||
|
@ -87,7 +88,6 @@
|
||||||
streetViewControl: false
|
streetViewControl: false
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
const poly = new google.maps.Polygon({
|
const poly = new google.maps.Polygon({
|
||||||
strokeOpacity: 0.8,
|
strokeOpacity: 0.8,
|
||||||
strokeWeight: 2,
|
strokeWeight: 2,
|
||||||
|
@ -108,7 +108,6 @@
|
||||||
["insert_at", "remove_at", "set_at"].forEach(ev => google.maps.event.addListener(poly.getPath(), ev, surfaceUpdated));
|
["insert_at", "remove_at", "set_at"].forEach(ev => google.maps.event.addListener(poly.getPath(), ev, surfaceUpdated));
|
||||||
updatePolygonColor();
|
updatePolygonColor();
|
||||||
|
|
||||||
$updateHashTimer = null;
|
|
||||||
mapLoaded.value = true;
|
mapLoaded.value = true;
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
@ -176,7 +175,7 @@
|
||||||
currentMap.setCenter({lat: meta[1], lng: meta[2]});
|
currentMap.setCenter({lat: meta[1], lng: meta[2]});
|
||||||
currentMap.setZoom(meta[3]);
|
currentMap.setZoom(meta[3]);
|
||||||
|
|
||||||
let path = [];
|
const path = [];
|
||||||
for (let i = 0; i < data.length; i += 2) {
|
for (let i = 0; i < data.length; i += 2) {
|
||||||
path.push({
|
path.push({
|
||||||
lat: data[i],
|
lat: data[i],
|
||||||
|
@ -193,22 +192,20 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
const loadLegacyHash = (hash: string) => {
|
const loadLegacyHash = (hash: string) => {
|
||||||
let opt = hash.split(';');
|
const opt = hash.split(';');
|
||||||
|
const curPosition = opt.pop();
|
||||||
let curPosition = opt.pop();
|
|
||||||
|
|
||||||
if (curPosition) {
|
if (curPosition) {
|
||||||
let cursetting = curPosition.split(',');
|
const cursetting = curPosition.split(',');
|
||||||
currentMap.setCenter({lat: parseFloat(cursetting[0]), lng: parseFloat(cursetting[1])});
|
currentMap.setCenter({lat: parseFloat(cursetting[0]), lng: parseFloat(cursetting[1])});
|
||||||
currentMap.setZoom(parseInt(cursetting[2]));
|
currentMap.setZoom(parseInt(cursetting[2]));
|
||||||
}
|
}
|
||||||
|
|
||||||
let density = parseFloat(opt.pop()) || 1;
|
const density = parseFloat(opt.pop()) || 1;
|
||||||
|
const path = [];
|
||||||
let path = [];
|
|
||||||
|
|
||||||
for (let i = 0; i < opt.length; i++) {
|
for (let i = 0; i < opt.length; i++) {
|
||||||
let coord = opt[i].split(',');
|
const coord = opt[i].split(',');
|
||||||
path.push({
|
path.push({
|
||||||
lat: parseFloat(coord[0]),
|
lat: parseFloat(coord[0]),
|
||||||
lng: parseFloat(coord[1])
|
lng: parseFloat(coord[1])
|
||||||
|
@ -227,11 +224,8 @@
|
||||||
currentPolygon.getPath().clear();
|
currentPolygon.getPath().clear();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
watch(() => props.density, () => updatePolygonColor());
|
|
||||||
|
|
||||||
const hash = computed(() => {
|
const hash = computed(() => {
|
||||||
let buf = new Float32Array(arrPoly.value.length*2+4);
|
const buf = new Float32Array(arrPoly.value.length*2+4);
|
||||||
buf[0] = props.density;
|
buf[0] = props.density;
|
||||||
buf.set(mapPosition.value, 1);
|
buf.set(mapPosition.value, 1);
|
||||||
|
|
||||||
|
@ -242,15 +236,11 @@
|
||||||
return 'b' + Base64.fromUint8Array(new Uint8Array(buf.buffer), true);
|
return 'b' + Base64.fromUint8Array(new Uint8Array(buf.buffer), true);
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(hash, (hashval: string) => {
|
watch(() => props.density, () => updatePolygonColor());
|
||||||
if ($updateHashTimer) {
|
|
||||||
clearTimeout($updateHashTimer);
|
|
||||||
}
|
|
||||||
|
|
||||||
$updateHashTimer = setTimeout(() => {
|
watchDebounced(hash,
|
||||||
emits('hashChange', hashval);
|
(hashval: string) => emits('hashChange', hashval),
|
||||||
}, 300);
|
{ debounce: 300 })
|
||||||
})
|
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
reset,
|
reset,
|
||||||
|
|
26
yarn.lock
26
yarn.lock
|
@ -161,6 +161,27 @@
|
||||||
resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.31.tgz#c90de7126d833dcd3a4c7534d534be2fb41faa4e"
|
resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.31.tgz#c90de7126d833dcd3a4c7534d534be2fb41faa4e"
|
||||||
integrity sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==
|
integrity sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==
|
||||||
|
|
||||||
|
"@vueuse/core@^8.2.0":
|
||||||
|
version "8.2.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-8.2.0.tgz#2e9163c0bbe8dcb240fdd89d9c8a52576fce8db7"
|
||||||
|
integrity sha512-89ZfKtFHz5ynfpWyFVXtK0yePJ2MZqFaOxnGeZn7cIp8KFbPRlu6Wsxi3gBkJNpjq+q9qbEh6MjV7QBvqCQ5Og==
|
||||||
|
dependencies:
|
||||||
|
"@vueuse/metadata" "8.2.0"
|
||||||
|
"@vueuse/shared" "8.2.0"
|
||||||
|
vue-demi "*"
|
||||||
|
|
||||||
|
"@vueuse/metadata@8.2.0":
|
||||||
|
version "8.2.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/@vueuse/metadata/-/metadata-8.2.0.tgz#f62a02e840220768941b3683dd8171c39581b950"
|
||||||
|
integrity sha512-cbaezEccNuxQC+OiudG9VjZNg9/RbAAHkyuhC6+8Gsgsc+MvDhfn1NrV6NNTaldLlZgJFgUiYOkrf3JGTTTGXQ==
|
||||||
|
|
||||||
|
"@vueuse/shared@8.2.0":
|
||||||
|
version "8.2.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-8.2.0.tgz#a8e2b637cfd866ea985615df9ec4913c4355c084"
|
||||||
|
integrity sha512-dTw7EJZgZCgG9DoVAiz4LtmKnIFXuE/idUFzvqRAJLjbPiVJc+qQH5kDUdKHI3W1U9t//1mdasQEKONArburiQ==
|
||||||
|
dependencies:
|
||||||
|
vue-demi "*"
|
||||||
|
|
||||||
acorn-node@^1.6.1:
|
acorn-node@^1.6.1:
|
||||||
version "1.8.2"
|
version "1.8.2"
|
||||||
resolved "https://registry.yarnpkg.com/acorn-node/-/acorn-node-1.8.2.tgz#114c95d64539e53dede23de8b9d96df7c7ae2af8"
|
resolved "https://registry.yarnpkg.com/acorn-node/-/acorn-node-1.8.2.tgz#114c95d64539e53dede23de8b9d96df7c7ae2af8"
|
||||||
|
@ -1103,6 +1124,11 @@ vite@^2.4.0:
|
||||||
optionalDependencies:
|
optionalDependencies:
|
||||||
fsevents "~2.3.2"
|
fsevents "~2.3.2"
|
||||||
|
|
||||||
|
vue-demi@*:
|
||||||
|
version "0.12.4"
|
||||||
|
resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.12.4.tgz#420dd17628f95f1bbce1102ad3c51074713a8049"
|
||||||
|
integrity sha512-ztPDkFt0TSUdoq1ZI6oD730vgztBkiByhUW7L1cOTebiSBqSYfSQgnhYakYigBkyAybqCTH7h44yZuDJf2xILQ==
|
||||||
|
|
||||||
vue@^3.0.0-rc.1:
|
vue@^3.0.0-rc.1:
|
||||||
version "3.2.31"
|
version "3.2.31"
|
||||||
resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.31.tgz#e0c49924335e9f188352816788a4cca10f817ce6"
|
resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.31.tgz#e0c49924335e9f188352816788a4cca10f817ce6"
|
||||||
|
|
Ładowanie…
Reference in New Issue