Grouped location chart - Grouped Location Chart

Grouped Location Chart

keyboard_arrow_leftGo back
Open in JSFiddle
JavaScript
chart= new GeoChart({
    "layers": [
        {
            "id": "layerId",
            "type": "items",
            "data": [],
            "aggregation": {
                "enabled": true
            },
            "style": {
                "node": {
                    "lineColor": "transparent",
                    "radius": 15
                },
                "nodeStyleFunction":  function (node) {
                    		var aggr = node.data.aggregatedNodes;
                        if(aggr.length > 1) {
                        	node.display = "roundtext";
                        	node.label = aggr.length;	
                        } else {
                        	node.display = "droplet";
                        	node.label = aggr[0]["name"];
                          node.labelStyle.backgroundStyle.fillColor = "#b0dc0b";
                          node.labelStyle.backgroundStyle.lineColor = "#b0dc0b";
                        }
                    }
            }
        }
    ],
    "navigation": {
        "initialLat": 37,
        "initialLng": -95,
        "initialZoom": 4
    },
    "background": {
        "enabled": true,
        "type": "tile",
        "url": "https:\/\/maps.zoomcharts.com\/{z}\/{x}\/{y}.png",
        "params": {
            "attribution": "\u00a9 OpenStreetMap<\/a> contributors"
        }
    },
    "container": "demo",
    "data": [
        {
            "url": "\/data\/usa-largest-capitals.json"
        }
    ],
    "interaction": {
        "resizing": {
            "enabled": false
        }
    }
})
HTML
      <script src="https://cdn.zoomcharts-cloud.com/1/latest/zoomcharts.js"></script>
      <div id="demo"></div>