Redraw map

In this example, we will redraw the map when clicking a button, but this could be as a result of a any user interaction or new data coming from an api. Click the button below to assign random colors to each state.

$(function() {
  var jsMap = $('#jsmap');
  jsMap.JSMaps({
    map: 'usa',
    onReady: function() {
      document.querySelector('.redraw-map').addEventListener('click', reDraw);
    }
  });
  function getRandomColor() {
    var letters = '0123456789ABCDEF';
    var color = '#';
    for (var i = 0; i < 6; i++) {
      color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
  }
  function reDraw() {
    jsMap.trigger('reDraw', {
      paths: window.JSMaps.maps.usa.paths.map(path => {
        return {
          ...path,
          color: getRandomColor()
        }
      })
    })
  }
});