build map icon

build-map-icon.js

const buildIcon = (data,attr) => {
      
      const value = data.attributeValues?.[attr];
      const meta = data.attributes?.find(a => a.name === attr);

      if(!value || !meta){
        throw new TypeError('Missing values'); // value at this point is string, so "0" won't fail
      }

      const min = meta.attributeTags?.min ? Number(meta.attributeTags.min) : 0;
      const max = meta.attributeTags?.max ? Number(meta.attributeTags.max) : 100;
      const unit = meta.attributeTags?.unit || '';
      const percent = (value - min) / (max - min) * 100;

      const status = statusByValue(value,meta);
      const colors = colorsByStatus[status];
      
      const icon = document.createElement("div");
      icon.innerHTML = iconHTML(attr,percent,value,colors,unit); 

      if(status === 'critical'){
        icon.classList.add('alert-icon');
      }
      
      return {
        attribute: attr,
        value,
        meta,
        unit,
        icon
      }
    }