Bubble map - Bubble map chart

Bubble map chart

keyboard_arrow_leftGo back
Open in JSFiddle
JavaScript
chart= new GeoChart({
    "navigation": {
        "initialLat": 37,
        "initialLng": -95,
        "initialZoom": 4,
        "minZoom": 3,
        "maxZoom": 12
    },
    "layers": [
        {
            "type": "items",
            "style": {
                "nodeStyleFunction": function (node) { 
                        node.label = node.data.name; 
                        var pop = node.data.population / 20000;
if(pop < 6) {
                            pop = 6;
                        }

                        node.radius = pop;
                        node.fillColor = "#b0dc0b";
                        node.lineColor = "#2fc32f";
                        node.lineWidth = 1;
                        node.labelStyle = {
                            backgroundStyle: {
                                fillColor:"#eab404",
                                lineColor:"#de672c",
                                lineWidth:1
                            },
                            textStyle: {
                                fillColor: "#de672c"
                            }
                        }
                    }
            }
        }
    ],
    "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>
Data