Skip to content

Instantly share code, notes, and snippets.

@LosantGists
Created July 26, 2023 18:37
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save LosantGists/e71aa84a25baa556c5a7258a34fa230c to your computer and use it in GitHub Desktop.
Save LosantGists/e71aa84a25baa556c5a7258a34fa230c to your computer and use it in GitHub Desktop.
map marker setup
// set up individual marker
const setUpMarker = (id, data) => {
if(!data.attributeValues?.location){
return false;
}
// Pull marker from dictionary, or create new
let marker = markers[id];
if(!marker){
marker = new AdvancedMarkerElement({
map: map
});
// toggle selected on click
marker.addListener('click',()=>{
marker.selected = !marker.selected; // save selected state in marker obj
if(marker.selected){
marker.content.classList.add('selected');
numSelected += 1;
marker.zIndex = numSelected;
}else{
marker.content.classList.remove('selected');
numSelected -= 1;
}
});
markers[id] = marker;
}
// Create icons for all attributes for this device
// 1 of these will serve as marker on map
// others used when marker is selected
// NOTE: Must be rebuilt on every update for new data
const attributes = ['battery','temperature','humidity'];
const icons = {};
attributes.forEach( (attr) => {
try {
// Build icon
icons[attr] = buildIcon(data,attr);
} catch (error) {
if (error instanceof TypeError) {
icons[attr] = null;
return false; // we dont have this attribute for this device
}else {
console.error(error)
}
}
}, {});
// If device does not have selected attribute, show no marker for it
if(!icons[selectedAttribute]){
return false;
}
// Set up marker content = the selected icon + the expandable window
const container = document.createElement('div');
container.classList.add('marker-container');
container.appendChild(icons[selectedAttribute].icon);
container.appendChild(iconWindowHTML(data,icons));
marker.content = container;
// Update position
marker.position = parseLocation(data.attributeValues?.location);
bounds.extend(marker.position);
// if marker is already selected, make sure it still has marker window open
if(marker.selected){
marker.content.classList.add('selected');
}
return true;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment