diff --git a/layers/chandler/layer.js b/layers/chandler/layer.js index 85ac3f1..28a1600 100644 --- a/layers/chandler/layer.js +++ b/layers/chandler/layer.js @@ -13,15 +13,14 @@ const res = await fetch("https://whereis.chandlerswift.com/api/0/last"); const locs = await res.json(); const loc = locs[0]; -let feature = new Feature({ - geometry: new Point(fromLonLat([loc.lon, loc.lat])), - ...loc -}); +let geometry = new Point(fromLonLat([loc.lon, loc.lat])); const vectorLayer = new VectorLayer({ source: new VectorSource({ features: [ - feature, + new Feature({ + geometry: geometry, + }) ] }), style: new Style({ @@ -36,8 +35,7 @@ setInterval(async function(){ const res = await fetch("https://whereis.chandlerswift.com/api/0/last"); const locs = await res.json(); const loc = locs[0]; - feature.setProperties(loc); // TODO: this won't remove a property if it was in a previous response but not this one - feature.getGeometry().setCoordinates(fromLonLat([loc.lon, loc.lat])); + geometry.setCoordinates(fromLonLat([loc.lon, loc.lat])); }, 10 * 1000); export default vectorLayer; diff --git a/layers/dot-cams/index.js b/layers/dot-cams/index.js index 166d5b5..b047a88 100644 --- a/layers/dot-cams/index.js +++ b/layers/dot-cams/index.js @@ -20,8 +20,8 @@ const allStates = { ...castleRockStates, ...travelIqStates, 'Alabama': al, -}; - +} +console.log(allStates, castleRockStates, travelIqStates); let dot_cams = { name: "State DOT Cameras", details: `Enable All`, @@ -38,23 +38,23 @@ for (let [state, url] of Object.entries(allStates)) { return new Style({ image: new Icon({ anchor: [0.5, 1], - src: feature.getProperties().views[0].hasVideo ? pinVideo : pin, + src: feature.values_.views[0].hasVideo ? pinVideo : pin, }), }); }, }); vectorLayer.customPopup = function(feature) { - const view = feature.getProperties().views[0]; + const view = feature.values_.views[0]; if (view.hasVideo) { - return `

${feature.getProperties().name}

`; + return `

${feature.values_.name}

`; } else { return ``; } }; vectorLayer.customPopupCallback = function(feature) { - const view = feature.getProperties().views[0]; + const view = feature.values_.views[0]; if (view.hasVideo) { const video = document.getElementById('popupVideo'); diff --git a/main.js b/main.js index 24f87ab..cba5c02 100644 --- a/main.js +++ b/main.js @@ -141,7 +141,7 @@ map.on('click', function (evt) { } } else { // exclude geometry -- https://stackoverflow.com/a/208106 - const {geometry: _, ...featureData} = feature.getProperties(); + const {geometry: _, ...featureData} = feature.values_; content.innerHTML = objectToTable(featureData); } @@ -150,5 +150,3 @@ map.on('click', function (evt) { }); new ResizeObserver(() => map.updateSize()).observe(document.getElementById("map")); - -window.map = map;