JSFiddle - React, Tailwind, and code Playground

by WoJWoJ

HTML

<script src="https://code.highcharts.com/maps/highmaps.js"></script>
<script src="https://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="https://code.highcharts.com/mapdata/custom/world-highres.js"></script>
<script src="https://code.highcharts.com/maps/modules/data.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.3/vue.js"></script>
<script src="https://unpkg.com/vue-highcharts/dist/vue-highcharts.min.js"></script>
<div id="sentinels">
  <highmaps :options="options"></highmaps>
</div>

JavaScript

Vue.use(VueHighcharts, {
  Highcharts: Highcharts
});

var options = {
  series: [{
    name: 'Basemap',
    mapData: Highcharts.maps['custom/world-highres']
  }, {
    type: 'mapppoint',
    data: [{
      name: 'London',
      lat: 51.507222,
      lon: -0.1275
    }],
  }]
};


var vm = new Vue({
  el: '#sentinels',
  data: {
    options: options
  }
});