ZingChart: My map doesn't exist in your library

If you do not see the map you are looking for you can still use it with ZingChart! For example we do not have any maps with cities or counties. Our maps only support countries and states. You can hook up custom map files for cities with Geo JSON. To do this you will need to:

load maps-geojson module
use the .loadGeoJSON method to render the chart

zingchart.loadModules('maps, maps-geojson', function (e) { //Required. Load the maps-geojson module.
  zingchart.maps.loadGeoJSON({ //Required. Add the loadGeoJSON() method.
    id: 'customMapName', //Required. Provide the id name, which will  correspond to the name below.
    url: 'https://storage.googleapis.com/zingchart-com.appspot.com/maps/sd-boundaries.json', //Required. Provide the GeoJSON file source.
    //Source: https://github.com/blackmad/neighborhoods/blob/master/gn-san-diego.geojson?short_path=c5454cc
    mappings: { //Recommended. Allows you to property names from the GeoJSON file to ZingChart.
      id: 'name',
      name: 'name'
    },
    style: { //Optional.
    },
    callback: function () { //Recommended. Use the function to render the map.
      zingchart.render({
        id: 'myChart',
        data: {
          shapes: [{
            type: 'zingchart.maps',
            options: {
              name: 'customMapName', //This corresponds with the id above.
              style: {
                controls: {
                  visible: false
                },
                label: {
                  visible: false
                },
                items: {
                  PACIFIC_BEACH: {
                    backgroundColor: 'red',
                    label: {
                      visible: true
                    }
                  }
                }
              },
              zoom: false,
              zooming: false,
              panning: false,
            }
          }]
        },
        height: '100%',
        width: '100%'
      });
    }
  });
});

Note: You can typically find any Geo JSON map configurations on github or searching the web.

ZingChart: My map doesn't exist in your library

Related Documentation