Skip to content

Commit

Permalink
remove all marker after finish
Browse files Browse the repository at this point in the history
  • Loading branch information
@bagusindrayana
bagusindrayana committed Apr 11, 2024
1 parent ec73241 commit 6ec6af0
Show file tree
Hide file tree
Showing 2 changed files with 69 additions and 43 deletions.
9 changes: 9 additions & 0 deletions app/components/mapbox_marker/titik_gempa.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -304,6 +304,15 @@ export default class TitikGempa {
if (this.setting.map.getSource('wave-source-' + this.id)) {
this.setting.map.removeSource('wave-source-' + this.id);
}
if (this.setting.map!.getLayer('hightlight-wave-layer')) {
this.setting.map!.removeLayer('hightlight-wave-layer');
this.setting.map!.removeSource('hightlight-wave');
const markers = document.querySelectorAll('.marker-daerah');
//get parent and remove
markers.forEach((v) => {
v.parentElement!.remove();
});
}
this.finishWave = true;
}
}
Expand Down
103 changes: 60 additions & 43 deletions app/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,8 @@ export default function Home() {
essential: true
});



const tg = new TitikGempa(id, {
coordinates: [data.lng, data.lat],
pWaveSpeed: 6000,
Expand Down Expand Up @@ -116,6 +118,7 @@ export default function Home() {
await new Promise(r => setTimeout(r, 6000));
if (worker.current != null) {
adaGempa.current = true;
console.log("Send Wave");
sendWave();
}
if (audioDangerElement) {
Expand Down Expand Up @@ -896,6 +899,7 @@ export default function Home() {
time: readAbleTime,
});
setTimeout(() => {
setStackAlert(nig);
setInfoGempaDirasakanTerakhir(nig);
}, 6000);
} else {
Expand Down Expand Up @@ -939,7 +943,7 @@ ${feature.geometry.coordinates[0]} , ${feature.geometry.coordinates[1]}`;
id: feature.properties.id,
lng: parseFloat(feature.geometry.coordinates[0]),
lat: parseFloat(feature.geometry.coordinates[1]),
mag: parseFloat(feature.properties.mag) || 9.0,
mag: parseFloat(parseFloat(feature.properties.mag).toFixed(1)) || 9.0,
depth: feature.properties.depth || "10 Km",
message: msg,
place: feature.properties.place,
Expand Down Expand Up @@ -1039,43 +1043,53 @@ ${feature.geometry.coordinates[0]} , ${feature.geometry.coordinates[1]}`;
lastGempaId.current = data.identifier;
const coordinates = data.info.point.coordinates.split(",");
const sentTime = DateTime.fromISO(data.sent.replace("WIB", ""), { zone: "Asia/Jakarta" });
const readAbleTime = sentTime.toISODate() + " " + sentTime.toLocaleString(DateTime.TIME_24_WITH_SECONDS)
if (parseFloat(data.info.magnitude) > 5) {
warningHandler({
id: data.identifier,
lng: parseFloat(coordinates[0]),
lat: parseFloat(coordinates[1]),
mag: parseFloat(data.info.magnitude),
depth: data.info.depth,
message: data.info.description + "\n" + data.info.instruction,
time:readAbleTime
});
} else {
var notif = new Audio(smallEarthQuakeSound);
notif.play();
map.current!.flyTo({
center: [parseFloat(coordinates[0]), parseFloat(coordinates[1])],
zoom: 7,
essential: true
});

const tg = new TitikGempa(data.identifier, {
coordinates: [coordinates[0], coordinates[1]],
pWaveSpeed: 6000,
sWaveSpeed: 3000,
map: map.current!,
description: data.info.description + "\n" + data.info.instruction,
mag: parseFloat(data.info.magnitude) || 9.0,
depth: data.info.depth || "10 Km",
time:readAbleTime
});

if (titikGempaKecil.current) {
titikGempaKecil.current.removeAllRender();
}
titikGempaKecil.current = tg;

}
const readAbleTime = sentTime.toISODate() + " " + sentTime.toLocaleString(DateTime.TIME_24_WITH_SECONDS);

warningHandler({
id: data.identifier,
lng: parseFloat(coordinates[0]),
lat: parseFloat(coordinates[1]),
mag: parseFloat(data.info.magnitude),
depth: data.info.depth,
message: data.info.description + "\n" + data.info.instruction,
time:readAbleTime
});
// if (parseFloat(data.info.magnitude) > 5) {
// warningHandler({
// id: data.identifier,
// lng: parseFloat(coordinates[0]),
// lat: parseFloat(coordinates[1]),
// mag: parseFloat(data.info.magnitude),
// depth: data.info.depth,
// message: data.info.description + "\n" + data.info.instruction,
// time:readAbleTime
// });
// } else {
// var notif = new Audio(smallEarthQuakeSound);
// notif.play();
// map.current!.flyTo({
// center: [parseFloat(coordinates[0]), parseFloat(coordinates[1])],
// zoom: 7,
// essential: true
// });

// const tg = new TitikGempa(data.identifier, {
// coordinates: [coordinates[0], coordinates[1]],
// pWaveSpeed: 6000,
// sWaveSpeed: 3000,
// map: map.current!,
// description: data.info.description + "\n" + data.info.instruction,
// mag: parseFloat(data.info.magnitude) || 9.0,
// depth: data.info.depth || "10 Km",
// time:readAbleTime
// });

// if (titikGempaKecil.current) {
// titikGempaKecil.current.removeAllRender();
// }
// titikGempaKecil.current = tg;

// }
}
})
.catch((error) => {
Expand Down Expand Up @@ -1147,6 +1161,9 @@ ${feature.geometry.coordinates[0]} , ${feature.geometry.coordinates[1]}`;
}

igs.current.push(nig)
igs.current.sort(function(a:any, b:any) {
return new Date(b.time).getTime() - new Date(a.time).getTime();
});
setInfoGempas(igs.current);
setStackAlert(nig);

Expand Down Expand Up @@ -1269,9 +1286,9 @@ ${feature.geometry.coordinates[0]} , ${feature.geometry.coordinates[1]}`;
time: readAbleTime
});

setTimeout(() => {
setInfoGempaDirasakanTerakhir(nig);
}, 6000);
// setTimeout(() => {
// setInfoGempaDirasakanTerakhir(nig);
// }, 6000);

}

Expand Down Expand Up @@ -1328,7 +1345,7 @@ ${feature.geometry.coordinates[0]} , ${feature.geometry.coordinates[1]}`;
<div>
<div id="internal" className="label bordered flex mb-2 w-full lg:w-32">
<div className="flex flex-col items-center p-1 ">
<div className="text -characters">{stackAlert.mag.toFixed(1)}</div>
<div className="text -characters">{stackAlert.mag}</div>
<div className="text">MAG</div>
</div>
<div className="decal -blink -striped"></div>
Expand Down Expand Up @@ -1369,7 +1386,7 @@ ${feature.geometry.coordinates[0]} , ${feature.geometry.coordinates[1]}`;
</div>
</div>
{stackAlert.mag >= 5 && <div className='red-bordered p-2 overflow-y-auto custom-scrollbar mt-2' style={{
maxHeight: "25vh",
maxHeight: "20vh",
}}>
<ul>
{stackAlert.listKotaTerdampak && stackAlert.listKotaTerdampak.map((kota, i) => {
Expand Down

0 comments on commit 6ec6af0

Please sign in to comment.