highcharts

How in highmaps (highcharts) for Vue2 to connect module "modules/tiledwebmap.js" for "OpenStreetMap"?


How in highmaps (highcharts) for Vue to import and connect module "https://code.highcharts.com/maps/modules/tiledwebmap.js" for "OpenStreetMap"? it would also be great if you would send an example demo.


Solution

  • The setup is almost identical as it with Vanilla JS setup, with only difference that you need to import and intialize TiledWebMap module within your application.

    import Highcharts from "highcharts";
    import MapsModule from "highcharts/modules/map";
    import TiledWebMap from "highcharts/modules/tiledwebmap";
    import HighchartsVue from "highcharts-vue";
    
    MapsModule(Highcharts);
    TiledWebMap(Highcharts);
    

    Demo: https://codesandbox.io/p/sandbox/nostalgic-https-j59mgn?file=%2Fsrc%2Fmain.js%3A4%2C1-13%2C25

    References:
    https://www.highcharts.com/docs/maps/tiledwebmap
    https://github.com/highcharts/highcharts-vue?tab=readme-ov-file#importing-highcharts-modules