Google API,从数据表中获取值

发布于 2024-11-06 15:11:36 字数 3881 浏览 0 评论 0原文

google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log(data.getValue(e["region"],1));
          }); 

我使用此代码来查看单击了哪个区域。 e["region"] 给出该区域的行号,然后我使用 getValue 来查看区域(标记)名称。

现在,在控制台日志中显示此错误:

Uncaught Error: Invalid row index 1. Should be in the range [0-14]

行索引 1 为何无效,因为它位于范围 [0-14] ?

编辑:

就这样,更多代码:)

     <!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Google Visualization API Sample</title>
  <script type="text/javascript" src="http://www.google.com/jsapi"></script>
 <script type="text/javascript">

   google.load("visualization", "1", {"packages": ["geomap"]});

   google.setOnLoadCallback(drawMap);



    function drawMap() {

      var data = new google.visualization.DataTable();

      data.addRows(24);

      data.addColumn("string", "City");

      data.addColumn("number", "Numar anunturi");data.setValue(0, 0, 'Ilfov');

    data.setValue(0, 1, 19);



     data.setValue(1, 0, 'Giurgiu');

    data.setValue(1, 1, 7);



     data.setValue(2, 0, 'Brasov');

    data.setValue(2, 1, 6);



     data.setValue(3, 0, 'Buzau');

    data.setValue(3, 1, 3);



     data.setValue(4, 0, 'Valcea');

    data.setValue(4, 1, 3);



     data.setValue(5, 0, 'Dolj');

    data.setValue(5, 1, 3);



     data.setValue(6, 0, 'Neamt');

    data.setValue(6, 1, 2);



     data.setValue(7, 0, 'Calarasi');

    data.setValue(7, 1, 2);



     data.setValue(8, 0, 'Dambovita');

    data.setValue(8, 1, 2);



     data.setValue(9, 0, 'Prahova');

    data.setValue(9, 1, 2);



     data.setValue(10, 0, 'Braila');

    data.setValue(10, 1, 2);



     data.setValue(11, 0, 'Constanta');

    data.setValue(11, 1, 2);



     data.setValue(12, 0, 'Suceava');

    data.setValue(12, 1, 2);



     data.setValue(13, 0, 'Caras-Severin');

    data.setValue(13, 1, 2);



     data.setValue(14, 0, 'Cluj');

    data.setValue(14, 1, 2);



     data.setValue(15, 0, 'Bihor');

    data.setValue(15, 1, 1);



     data.setValue(16, 0, 'Bacau');

    data.setValue(16, 1, 1);



     data.setValue(17, 0, 'Maramures');

    data.setValue(17, 1, 1);



     data.setValue(18, 0, 'Arges');

    data.setValue(18, 1, 1);



     data.setValue(19, 0, 'Gorj');

    data.setValue(19, 1, 1);



     data.setValue(20, 0, 'Ialomita');

    data.setValue(20, 1, 1);



     data.setValue(21, 0, 'Bucuresti');

    data.setValue(21, 1, 1);



     data.setValue(22, 0, 'Mures');

    data.setValue(22, 1, 1);



     data.setValue(23, 0, 'Sibiu');

    data.setValue(23, 1, 1);





      var options = {width: 800,height:400};

      options["region"] = "RO";

      options["colors"] = [0xFF8747, 0xFFB581, 0xc06000]; //orange colors

      options["dataMode"] = "markers";



      var container = document.getElementById("map_chart_div");

      var geomap = new google.visualization.GeoMap(container);

        google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log(data.getValue(e["region"],1));
          }); 

      geomap.draw(data, options);

    }

  </script> 
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="map_chart_div" style="width: 800px; height: 400px;"></div>
</body>
</html>
​
google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log(data.getValue(e["region"],1));
          }); 

I use this code to see which region is clicked. The e["region"] gives the row number of that region, and then I use getValue to see the region(marker) name.

Now, in the console log shows up this error:

Uncaught Error: Invalid row index 1. Should be in the range [0-14]

How can the row index 1 be invalid, as it is in the range [0-14] ?

EDIT:

There you go, more code :)

     <!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Google Visualization API Sample</title>
  <script type="text/javascript" src="http://www.google.com/jsapi"></script>
 <script type="text/javascript">

   google.load("visualization", "1", {"packages": ["geomap"]});

   google.setOnLoadCallback(drawMap);



    function drawMap() {

      var data = new google.visualization.DataTable();

      data.addRows(24);

      data.addColumn("string", "City");

      data.addColumn("number", "Numar anunturi");data.setValue(0, 0, 'Ilfov');

    data.setValue(0, 1, 19);



     data.setValue(1, 0, 'Giurgiu');

    data.setValue(1, 1, 7);



     data.setValue(2, 0, 'Brasov');

    data.setValue(2, 1, 6);



     data.setValue(3, 0, 'Buzau');

    data.setValue(3, 1, 3);



     data.setValue(4, 0, 'Valcea');

    data.setValue(4, 1, 3);



     data.setValue(5, 0, 'Dolj');

    data.setValue(5, 1, 3);



     data.setValue(6, 0, 'Neamt');

    data.setValue(6, 1, 2);



     data.setValue(7, 0, 'Calarasi');

    data.setValue(7, 1, 2);



     data.setValue(8, 0, 'Dambovita');

    data.setValue(8, 1, 2);



     data.setValue(9, 0, 'Prahova');

    data.setValue(9, 1, 2);



     data.setValue(10, 0, 'Braila');

    data.setValue(10, 1, 2);



     data.setValue(11, 0, 'Constanta');

    data.setValue(11, 1, 2);



     data.setValue(12, 0, 'Suceava');

    data.setValue(12, 1, 2);



     data.setValue(13, 0, 'Caras-Severin');

    data.setValue(13, 1, 2);



     data.setValue(14, 0, 'Cluj');

    data.setValue(14, 1, 2);



     data.setValue(15, 0, 'Bihor');

    data.setValue(15, 1, 1);



     data.setValue(16, 0, 'Bacau');

    data.setValue(16, 1, 1);



     data.setValue(17, 0, 'Maramures');

    data.setValue(17, 1, 1);



     data.setValue(18, 0, 'Arges');

    data.setValue(18, 1, 1);



     data.setValue(19, 0, 'Gorj');

    data.setValue(19, 1, 1);



     data.setValue(20, 0, 'Ialomita');

    data.setValue(20, 1, 1);



     data.setValue(21, 0, 'Bucuresti');

    data.setValue(21, 1, 1);



     data.setValue(22, 0, 'Mures');

    data.setValue(22, 1, 1);



     data.setValue(23, 0, 'Sibiu');

    data.setValue(23, 1, 1);





      var options = {width: 800,height:400};

      options["region"] = "RO";

      options["colors"] = [0xFF8747, 0xFFB581, 0xc06000]; //orange colors

      options["dataMode"] = "markers";



      var container = document.getElementById("map_chart_div");

      var geomap = new google.visualization.GeoMap(container);

        google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log(data.getValue(e["region"],1));
          }); 

      geomap.draw(data, options);

    }

  </script> 
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="map_chart_div" style="width: 800px; height: 400px;"></div>
</body>
</html>
​

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

流心雨 2024-11-13 15:11:36

我无法用您发布的代码重现您的问题 - 我似乎根本无法触发 RegionClick 函数 - 但您看到的错误消息让我怀疑您的问题是 e [“region”] 返回一个字符串,而不是数字。

尝试将其添加到您的函数中:

google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log("Type of value is: " + typeof(e["region"]));
          console.log(data.getValue(e["region"],1));
          }); 

然后,如果您得到一个字符串,您可以尝试:

google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log("Type of value is: " + typeof(e["region"]));
          console.log(data.getValue(Math.floor(e["region"]),1));
          }); 

I can't reproduce your problem with the code you've posted - I can't seem to get the regionClick function to fire at all - but the error message you're seeing makes me suspect that your problem is that e["region"] is returning a string, not a number.

Try adding this to your function:

google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log("Type of value is: " + typeof(e["region"]));
          console.log(data.getValue(e["region"],1));
          }); 

Then, if it turns out you are getting a string, you might try:

google.visualization.events.addListener( 
          geomap, "regionClick", function(e) {
          console.log(e["region"]);
          console.log("Type of value is: " + typeof(e["region"]));
          console.log(data.getValue(Math.floor(e["region"]),1));
          }); 
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文