使用JavaScript的多个多边形 - 不工作 - 数据是JSON类型

时间:2015-03-02 17:03:37

标签: javascript arrays json google-maps polygons

我试图为伦敦自治市镇添加多个多边形,但出于某种原因,我不能有多个多边形,当我改变行政区的顺序时,我失去了多边形。 这是我在html中使用的函数代码:

<script>
function initialize() {
    var map = new google.maps.Map(document.getElementById('map_canvas'), {
        center: new google.maps.LatLng(51.50722, -0.12750), 
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 11 
    });
    var points = new google.maps.MVCArray();
    for (var y in borough) {
        var area = borough[y];
        var location = new google.maps.LatLng(area.lat,area.lng);
        points.push(location );
        }
    var polygonOptions = {path:points,map:map, fillColor:"#d3d3d3"};
    var polygon1 = new google.maps.Polygon(polygonOptions);
    var polygon2 = new google.maps.Polygon(polygonOptions);
    polygon.setMap(map); 

    var polyline = new google.maps.Polyline({path:points,map:map});
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>
var borough = [{"name":"City of London","PointID":1,"PolygonID":294,"SubPolygonID":1,"lat":51.52028098,"lng":-0.085197314,"AvgPropertyVal":532562},
{"name":"City of London","PointID":2,"PolygonID":294,"SubPolygonID":1,"lat":51.51976087,"lng":-0.08330491,"AvgPropertyVal":532562},
{"name":"City of London","PointID":3,"PolygonID":294,"SubPolygonID":1,"lat":51.52070385,"lng":-0.081741648,"AvgPropertyVal":532562},
{"name":"City of London","PointID":4,"PolygonID":294,"SubPolygonID":1,"lat":51.52189991,"lng":-0.081029725,"AvgPropertyVal":532562},
{"name":"City of London","PointID":5,"PolygonID":294,"SubPolygonID":1,"lat":51.52145663,"lng":-0.07845078,"AvgPropertyVal":532562},
{"name":"City of London","PointID":6,"PolygonID":294,"SubPolygonID":1,"lat":51.51879156,"lng":-0.079409083,"AvgPropertyVal":532562},
{"name":"City of London","PointID":7,"PolygonID":294,"SubPolygonID":1,"lat":51.51891429,"lng":-0.078061953,"AvgPropertyVal":532562},
{"name":"City of London","PointID":8,"PolygonID":294,"SubPolygonID":1,"lat":51.51841529,"lng":-0.078126209,"AvgPropertyVal":532562},
{"name":"City of London","PointID":9,"PolygonID":294,"SubPolygonID":1,"lat":51.51658307,"lng":-0.076836949,"AvgPropertyVal":532562},
{"name":"City of London","PointID":10,"PolygonID":294,"SubPolygonID":1,"lat":51.51439986,"lng":-0.073948334,"AvgPropertyVal":532562},
{"name":"City of London","PointID":11,"PolygonID":294,"SubPolygonID":1,"lat":51.5117546,"lng":-0.073042428,"AvgPropertyVal":532562},
{"name":"City of London","PointID":12,"PolygonID":294,"SubPolygonID":1,"lat":51.51075058,"lng":-0.072743252,"AvgPropertyVal":532562},
{"name":"City of London","PointID":13,"PolygonID":294,"SubPolygonID":1,"lat":51.51005109,"lng":-0.072970229,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":14,"PolygonID":294,"SubPolygonID":1,"lat":51.50969617,"lng":-0.075563381,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":15,"PolygonID":294,"SubPolygonID":1,"lat":51.51049005,"lng":-0.076264961,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":16,"PolygonID":294,"SubPolygonID":1,"lat":51.50997169,"lng":-0.077942657,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":17,"PolygonID":294,"SubPolygonID":1,"lat":51.50935818,"lng":-0.078861965,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":18,"PolygonID":294,"SubPolygonID":1,"lat":51.50900383,"lng":-0.079078631,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":19,"PolygonID":294,"SubPolygonID":1,"lat":51.5087737,"lng":-0.078700648,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":20,"PolygonID":294,"SubPolygonID":1,"lat":51.50780117,"lng":-0.079430139,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":21,"PolygonID":294,"SubPolygonID":1,"lat":51.50795307,"lng":-0.080317449,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":22,"PolygonID":294,"SubPolygonID":1,"lat":51.50833588,"lng":-0.081510465,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":23,"PolygonID":294,"SubPolygonID":1,"lat":51.50854038,"lng":-0.085438904,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":24,"PolygonID":294,"SubPolygonID":1,"lat":51.50887225,"lng":-0.088582498,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":25,"PolygonID":294,"SubPolygonID":1,"lat":51.50935403,"lng":-0.091993644,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":26,"PolygonID":294,"SubPolygonID":1,"lat":51.51006508,"lng":-0.095239637,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":27,"PolygonID":294,"SubPolygonID":1,"lat":51.51050631,"lng":-0.095219785,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":28,"PolygonID":294,"SubPolygonID":1,"lat":51.51015777,"lng":-0.096129238,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":29,"PolygonID":294,"SubPolygonID":1,"lat":51.5106974,"lng":-0.099848011,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":30,"PolygonID":294,"SubPolygonID":1,"lat":51.51075644,"lng":-0.108452199,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":31,"PolygonID":294,"SubPolygonID":1,"lat":51.51070262,"lng":-0.11147895,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":32,"PolygonID":294,"SubPolygonID":1,"lat":51.51158903,"lng":-0.111510482,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":33,"PolygonID":294,"SubPolygonID":1,"lat":51.51271566,"lng":-0.112394912,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":34,"PolygonID":294,"SubPolygonID":1,"lat":51.51314183,"lng":-0.111718632,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":35,"PolygonID":294,"SubPolygonID":1,"lat":51.51363133,"lng":-0.111960732,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":36,"PolygonID":294,"SubPolygonID":1,"lat":51.51377184,"lng":-0.111081486,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":37,"PolygonID":294,"SubPolygonID":1,"lat":51.51528447,"lng":-0.111586766,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":38,"PolygonID":294,"SubPolygonID":1,"lat":51.51820408,"lng":-0.11380106,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":39,"PolygonID":294,"SubPolygonID":1,"lat":51.51771182,"lng":-0.107806514,"AvgPropertyVal":532562 },
{"name":"City of London","PointID":40,"PolygonID":294,"SubPolygonID":1,"lat":51.51848749,"lng":-0.105329753,"AvgPropertyVal":532562},
{"name":"City of London","PointID":41,"PolygonID":294,"SubPolygonID":1,"lat":51.51961204,"lng":-0.101800545,"AvgPropertyVal":532562},
{"name":"City of London","PointID":42,"PolygonID":294,"SubPolygonID":1,"lat":51.52022984,"lng":-0.099634275,"AvgPropertyVal":532562},
{"name":"City of London","PointID":43,"PolygonID":294,"SubPolygonID":1,"lat":51.52066889,"lng":-0.097649839,"AvgPropertyVal":532562},
{"name":"City of London","PointID":44,"PolygonID":294,"SubPolygonID":1,"lat":51.5209784,"lng":-0.097603787,"AvgPropertyVal":532562},
{"name":"City of London","PointID":45,"PolygonID":294,"SubPolygonID":1,"lat":51.52153954,"lng":-0.097382896,"AvgPropertyVal":532562},
{"name":"City of London","PointID":46,"PolygonID":294,"SubPolygonID":1,"lat":51.52282395,"lng":-0.097952107,"AvgPropertyVal":532562},
{"name":"City of London","PointID":47,"PolygonID":294,"SubPolygonID":1,"lat":51.52326785,"lng":-0.096765939,"AvgPropertyVal":532562},
{"name":"City of London","PointID":48,"PolygonID":294,"SubPolygonID":1,"lat":51.5227681,"lng":-0.096449451,"AvgPropertyVal":532562},
{"name":"City of London","PointID":49,"PolygonID":294,"SubPolygonID":1,"lat":51.52308377,"lng":-0.095068249,"AvgPropertyVal":532562},
{"name":"City of London","PointID":50,"PolygonID":294,"SubPolygonID":1,"lat":51.52142965,"lng":-0.094324281,"AvgPropertyVal":532562},
{"name":"City of London","PointID":51,"PolygonID":294,"SubPolygonID":1,"lat":51.5214323,"lng":-0.09249635,"AvgPropertyVal":532562},
{"name":"City of London","PointID":52,"PolygonID":294,"SubPolygonID":1,"lat":51.52097407,"lng":-0.092354076,"AvgPropertyVal":532562},
{"name":"City of London","PointID":53,"PolygonID":294,"SubPolygonID":1,"lat":51.52066153,"lng":-0.08967301,"AvgPropertyVal":532562},
{"name":"City of London","PointID":54,"PolygonID":294,"SubPolygonID":1,"lat":51.51991658,"lng":-0.089983841,"AvgPropertyVal":532562},
{"name":"City of London","PointID":55,"PolygonID":294,"SubPolygonID":1,"lat":51.51875522,"lng":-0.08620691,"AvgPropertyVal":532562,},
{"name":"City of London","PointID":56,"PolygonID":294,"SubPolygonID":1,"lat":51.52028098,"lng":-0.085197314,"AvgPropertyVal":532562},

];

1 个答案:

答案 0 :(得分:0)

您需要动态创建多边形。

function initialize() {
    var map = new google.maps.Map(document.getElementById('map_canvas'), {
        center: new google.maps.LatLng(51.50722, -0.12750),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 11
    });
    var points = new google.maps.MVCArray();
    var areas = [];
    for (var x in borough) {
        var area = borough[x];
        if (!areas[area.name]) areas[area.name] = [];
        areas[area.name].push(new google.maps.LatLng(area.lat, area.lng));
    }
    for (name in areas) {
        var polygonOptions = {
            path: areas[name],
            map: map,
            fillColor: "#d3d3d3"
        };
        var polygon = new google.maps.Polygon(polygonOptions);
        polygon.setMap(map);

        var polyline = new google.maps.Polyline({
            path: areas[name],
            map: map
        });
    }
}
google.maps.event.addDomListener(window, 'load', initialize);

working jsfiddle

代码段:

function initialize() {
    var map = new google.maps.Map(document.getElementById('map_canvas'), {
        center: new google.maps.LatLng(51.50722, -0.12750),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 11
    });
    var points = new google.maps.MVCArray();
    var areas = [];
    for (var x in borough) {
        var area = borough[x];
        if (!areas[area.name]) areas[area.name] = [];
        areas[area.name].push(new google.maps.LatLng(area.lat, area.lng));
    }
    for (name in areas) {
        var polygonOptions = {
            path: areas[name],
            map: map,
            fillColor: "#d3d3d3"
        };
        var polygon = new google.maps.Polygon(polygonOptions);
        polygon.setMap(map);

        var polyline = new google.maps.Polyline({
            path: areas[name],
            map: map
        });
    }
}
google.maps.event.addDomListener(window, 'load', initialize);

var borough = [{
    "name": "City of London",
    "PointID": 38,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.51820408,
    "lng": -0.11380106,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 39,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.51771182,
    "lng": -0.107806514,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 40,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.51848749,
    "lng": -0.105329753,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 41,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.51961204,
    "lng": -0.101800545,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 42,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52022984,
    "lng": -0.099634275,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 43,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52066889,
    "lng": -0.097649839,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 44,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.5209784,
    "lng": -0.097603787,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 45,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52153954,
    "lng": -0.097382896,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 46,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52282395,
    "lng": -0.097952107,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 47,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52326785,
    "lng": -0.096765939,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 48,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.5227681,
    "lng": -0.096449451,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 49,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52308377,
    "lng": -0.095068249,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 50,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52142965,
    "lng": -0.094324281,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 51,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.5214323,
    "lng": -0.09249635,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 52,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52097407,
    "lng": -0.092354076,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 53,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52066153,
    "lng": -0.08967301,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 54,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.51991658,
    "lng": -0.089983841,
    "AvgPropertyVal": 532562
}, {
    "name": "City of London",
    "PointID": 55,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.51875522,
    "lng": -0.08620691,
    "AvgPropertyVal": 532562,
}, {
    "name": "City of London",
    "PointID": 56,
    "PolygonID": 294,
    "SubPolygonID": 1,
    "lat": 51.52028098,
    "lng": -0.085197314,
    "AvgPropertyVal": 532562
}, {
    "name": "Kensington and Chelsea",
    "PointID": 1,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.5301034,
    "lng": -0.227570192,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 2,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52986475,
    "lng": -0.227667393,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 3,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.53011597,
    "lng": -0.225428696,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 4,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52987182,
    "lng": -0.22361582,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 5,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52858731,
    "lng": -0.217960999,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 6,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52787514,
    "lng": -0.216010828,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 7,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.5266668,
    "lng": -0.215554931,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 8,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52681364,
    "lng": -0.212680307,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 9,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52618572,
    "lng": -0.207301665,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 10,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52568566,
    "lng": -0.205884067,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 11,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52340567,
    "lng": -0.203863227,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 12,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52268878,
    "lng": -0.201621023,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 13,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52065721,
    "lng": -0.200615665,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 14,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52084575,
    "lng": -0.202650801,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 15,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52056941,
    "lng": -0.203748556,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 16,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51774584,
    "lng": -0.20146985,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 17,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.5179234,
    "lng": -0.200729212,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 18,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51679328,
    "lng": -0.199926247,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 19,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51449785,
    "lng": -0.199189476,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 20,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51497834,
    "lng": -0.195054208,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 21,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51265905,
    "lng": -0.194348907,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 22,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51170297,
    "lng": -0.194046611,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 23,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51176008,
    "lng": -0.192966365,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 24,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50981461,
    "lng": -0.19212532,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 25,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51012551,
    "lng": -0.18791505,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 26,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50173969,
    "lng": -0.184240718,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 27,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50140731,
    "lng": -0.180317506,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 28,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.4977246,
    "lng": -0.179552223,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 29,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49816722,
    "lng": -0.17354826,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 30,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49896722,
    "lng": -0.168395756,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 31,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49824657,
    "lng": -0.167625021,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 32,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49918812,
    "lng": -0.16578483,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 33,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49864299,
    "lng": -0.165486893,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 34,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.5002386,
    "lng": -0.162580073,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 35,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50153586,
    "lng": -0.16100485,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 36,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.5021964,
    "lng": -0.158458225,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 37,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49896397,
    "lng": -0.157855138,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 38,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49745687,
    "lng": -0.156028578,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 39,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49501018,
    "lng": -0.155300376,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 40,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49444016,
    "lng": -0.15599476,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 41,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49380217,
    "lng": -0.154996195,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 42,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49314756,
    "lng": -0.155970545,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 43,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49190882,
    "lng": -0.154798953,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 44,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49139671,
    "lng": -0.155802089,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 45,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49099646,
    "lng": -0.155682829,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 46,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48999481,
    "lng": -0.155177305,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 47,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48955223,
    "lng": -0.155854906,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 48,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48603835,
    "lng": -0.150176168,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 49,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48542346,
    "lng": -0.15003519,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 50,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48314879,
    "lng": -0.167170332,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 51,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48247604,
    "lng": -0.171250184,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 52,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48170237,
    "lng": -0.17388796,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 53,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.4815676,
    "lng": -0.175744033,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 54,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48021142,
    "lng": -0.177820214,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 55,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48002258,
    "lng": -0.177531024,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 56,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.47794652,
    "lng": -0.179290082,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 57,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.47787918,
    "lng": -0.180803448,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 58,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.47734418,
    "lng": -0.182081941,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 59,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.47736152,
    "lng": -0.183599124,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 60,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.47854869,
    "lng": -0.185356432,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 61,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.47981774,
    "lng": -0.186531618,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 62,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48090654,
    "lng": -0.188262747,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 63,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48311079,
    "lng": -0.190776552,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 64,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48575956,
    "lng": -0.193602817,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 65,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48731848,
    "lng": -0.195969744,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 66,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48715198,
    "lng": -0.196429988,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 67,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.48806801,
    "lng": -0.198280802,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 68,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.4916319,
    "lng": -0.202388428,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 69,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49182343,
    "lng": -0.201860854,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 70,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49326727,
    "lng": -0.203009834,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 71,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49609479,
    "lng": -0.207370476,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 72,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49596839,
    "lng": -0.207983417,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 73,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.49772339,
    "lng": -0.209904205,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 74,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.5007165,
    "lng": -0.214115158,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 75,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50224803,
    "lng": -0.214948606,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 76,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50440944,
    "lng": -0.21699098,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 77,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50444679,
    "lng": -0.217022662,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 78,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50609253,
    "lng": -0.217972872,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 79,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50634763,
    "lng": -0.215945497,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 80,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50746549,
    "lng": -0.216126623,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 81,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50759326,
    "lng": -0.215184963,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 82,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50906119,
    "lng": -0.215799139,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 83,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50939063,
    "lng": -0.21682385,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 84,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51033864,
    "lng": -0.217191795,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 85,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.510177,
    "lng": -0.218035394,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 86,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50970601,
    "lng": -0.217870759,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 87,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.50952129,
    "lng": -0.219268627,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 88,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51167552,
    "lng": -0.220251085,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 89,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51558945,
    "lng": -0.222586173,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 90,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.51952429,
    "lng": -0.226545366,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 91,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52104428,
    "lng": -0.228283797,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 92,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52192334,
    "lng": -0.226711591,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 93,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52474268,
    "lng": -0.226602049,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 94,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52473968,
    "lng": -0.227177344,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 95,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52578912,
    "lng": -0.227357154,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 96,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52783909,
    "lng": -0.227394299,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 97,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.52982477,
    "lng": -0.228709886,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 98,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.53029975,
    "lng": -0.228485289,
    "AvgPropertyVal": 1288411
}, {
    "name": "Kensington and Chelsea",
    "PointID": 99,
    "PolygonID": 313,
    "SubPolygonID": 1,
    "lat": 51.5301034,
    "lng": -0.227570192,
    "AvgPropertyVal": 1288411
}];
html, body, #map_canvas {
    height: 100%;
    width: 100%;
    margin: 0px;
    padding: 0px
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas" style="width:750px; height:450px; border: 2px solid #3872ac;"></div>