const map = new jsVectorMap({
  map: 'world_merc',
  selector: '#map',
  zoomOnScroll: false,
  zoomButtons: false,
  selectedMarkers: [0, 2],
  markersSelectable: true,
  markers:[
    { name: "Palestine", coords: [31.9474,35.2272] },
    { name: "Russia", coords: [61.524,105.3188] },
    { name: "Canada", coords: [56.1304,-106.3468] },
    { name: "Greenland", coords: [71.7069,-42.6043] },
  ],
  markerStyle:{
    initial: { fill: "#5c5cff" },
    selected: { fill: "red" }
  },
  labels: {
    markers: {
      render: marker => marker.name
    }
  }
})

document.querySelector('#add-marker').addEventListener('click', () => {
  map.addMarker({
    name: "Brazil",
    coords: [-14.235,-51.9253]
  })
})