Google Geomap API 更改区域选项 onClick()答案

【问题标题】：Google Geomap API change region option onClick()Google Geomap API 更改区域选项 onClick()
【发布时间】：2012-12-02 16:27:18
【问题描述】：

这段代码用Google Geomap API绘制地图

<script type="text/javascript">
    google.setOnLoadCallback(drawMap);
    function drawMap() {
        var data = new google.visualization.DataTable();
        data.addColumn('string','iso'); //e.g.: mx
        data.addColumn('number','population'); //e.g.: 114
        data.addRows([["mx",114],["ec",14],["ve",28]]);
        var options = {
            region: '005',
            width: '511px',
            height: '280px',
            showLegend: true
        };
        var geomap = new google.visualization.GeoMap(document.getElementById('map'));
        geomap.draw(data,options);
    };
</script>

默认选择的地区是 005（南美洲）。以下是其他可用区域：

013 -（中美洲）
150 -（欧洲）

如何动态更改已绘制地图的区域？像这样的：

<a href="javascript:void(null);" onclick="changeRegion(150);">Europe</a>

我知道地图必须重新绘制，但我有点卡在区域属性修改步骤中。任何想法都会有所帮助。谢谢！

【问题讨论】：

标签： javascript google-api geomap

【解决方案1】：

如果您已经拥有数据，我会给您一个我在自己的应用程序中使用的 sn-p。我想更容易理解而不是冗长的解释。希望能帮助到你。就我而言，我想按国家/地区显示同一地区的数字。

geomap = new google.visualization.GeoMap(document.getElementById('geo_chart'));


        google.visualization.events.addListener( geomap, 'regionClick', 
            function(e) 
            { 
                var dataLocal = new google.visualization.DataTable();
                var grouped_cities;

                if (e['region'] == "0")
                    return;

                options['colors'] = [0xaacdf8, 0x164177]; //orange colors
                options['dataMode'] = 'markers';
                options['region'] = e['region'];
                options['showZoomOut'] = true;

                if ( previous_region !=  e['region'] )
                {
                    var indexes  = dataFull.getFilteredRows([{column: 0, value: e['region']}]);

                    dataLocal.addRows(indexes.length);
                    dataLocal.addColumn('string', 'City');
                    dataLocal.addColumn('number', 'Views');

                    for ( i=0; i<indexes.length; i++ )
                    {
                        dataLocal.setValue(i, 0, dataFull.getValue(indexes[i], 2));
                        dataLocal.setValue(i, 1, dataFull.getValue(indexes[i], 3));
                    }


                    grouped_cities = google.visualization.data.group( dataLocal, [0],[{'column': 1, 'aggregation': google.visualization.data.sum, 'type': 'number'}]);
                    previous_region =  e['region'];
                }

                geomap.draw(grouped_cities, options);
                delete grouped_cities;
                delete dataLocal;

            }
        );

【讨论】：