2

我正在使用 google geochart 在地图上放置标记。我希望能够在地图上动态添加和删除标记,而不必每次都重新绘制地图。有没有办法做到这一点?

谢谢 这是我的代码:

<div align="center">
  <div id="chart_div">
    <div id="loadingDiv"></div>
  </div>
</div>

<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type="text/javascript">
  //Load the Google Maps stuff
  google.load('visualization', '1', {'packages': ['geochart']});
  google.setOnLoadCallback(drawRegionsMap);

  //Load the Google Maps stuff
  google.load('visualization', '1', {'packages': ['geochart']});
  google.setOnLoadCallback(drawRegionsMap);


  function drawRegionsMap() {
    var data = new google.visualization.DataTable();
    data.addColumn('number', 'latitude');
    data.addColumn('number', 'longitude');
    data.addColumn('string', 'Location');
    data.addColumn('number', 'Size');

    //While iterating thru clients flag if user is in list, If not flagged add user to map.
    //Firefox doesn't seem to be including user in list
    var inList = false;
    for (i in clientInfo){ client = clientInfo[i];

      //Because new clients are creating with this connection, we don't want to add them to map.
      //Their clientInfo won't have an ipAddress. Only want to map one client per session
      if (client.ipAddress){
        //Flag if user is in client list
        if(client.ipAddress == userInfo.ipAddress){
          inList = true;
        }
        data.addRow([parseFloat(client.latitude), parseFloat(client.longitude), client.cityName, 4]);
      }
    }

    //If user is not in client list add him now.
    if(!inList){
      if(userInfo.ipAddress){
      data.addRow([parseFloat(userInfo.latitude), parseFloat(userInfo.longitude), userInfo.cityName, 4]);
      }
    }


    var options = {
      displayMode: 'markers',
      colorAxis: {colors: ['red', 'blue']},
      sizeAxis: {minValue: 0, maxValue: 5, minSize: 1, maxSize: 4},
      enableRegionInteractivity: true,
      legend: 'none'
    };

    var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
    google.visualization.events.addListener(chart, 'regionClick', function (eventData) {
      alert('You clicked: ' + eventData.region);
    });
    chart.draw(data, options);
  }
</script>
4

1 回答 1

0

您可以创建仪表板并将控件绑定到它 - 例如CategoryFilter。当控件的过滤器被修改时,图表将自动更新。

但是,这是有限的,并且考虑到您的用例,您可能必须自己调用绘图函数。

于 2012-11-17T15:52:37.067 回答