帶有坐標的谷歌地理圖表? (Google geocharts with coordinates?)


問題描述

帶有坐標的谷歌地理圖表? (Google geocharts with coordinates?)

I want to use google geochart with coordinates (longtitute, latitute). But I cant find any example about this topic. There are a lot of example with region and city example. But with coordinates I Cant find.

Please, code example, link, tutorial any thing else?

Thanks.

‑‑‑‑‑

參考解法

方法 1:

You can check an example here:

google.load('visualization', '1', {'packages': ['geochart']}); google.setOnLoadCallback(drawVisualization);   function drawVisualization() {var data = new google.visualization.DataTable();  data.addColumn('number', 'Lat');                                  data.addColumn('number', 'Long');  data.addColumn('number', 'Value');   data.addColumn({type:'string', role:'tooltip'});                         data.addRows([[41.151636,‑8.569336,0,'tooltip']]); data.addRows([[ 39.059575,‑98.789062,0,'tooltip']]);                                    var options = {  colorAxis:  {minValue: 0, maxValue: 0,  colors: ['#6699CC']},  legend: 'none',      backgroundColor: {fill:'transparent',stroke:'#FFF' ,strokeWidth:0 },      datalessRegionColor: '#f5f5f5',  displayMode: 'markers',   enableRegionInteractivity: 'true',   resolution: 'countries',  sizeAxis: {minValue: 1, maxValue:1,minSize:5,  maxSize: 5},  region:'world',  keepAspectRatio: true,  width:400,  height:300,  tooltip: {textStyle: {color: '#444444'}}      };   var chart = new   google.visualization.GeoChart(document.getElementById('visualization'));                chart.draw(data, options);      }     <script src="https://www.google.com/jsapi?fake=.js"></script> <div id="visualization"></div>

There are many ways to do it, this is just one.

data.addColumn('number', 'Lat');                                
data.addColumn('number', 'Long');
data.addColumn('number', 'Value');
data.addColumn({type:'string', role:'tooltip'});                        

data.addRows([[41.151636,‑8.569336,0,'tooltip']]);
data.addRows([[ 39.059575,‑98.789062,0,'tooltip']]);

方法 2:

As said in the documentation:

  

Marker location [Required] The first column is a specific string   address (for example, "1600 Pennsylvania Ave").    OR The first two   columns are numeric, where the first column is the latitude, and the   second column is the longitude.

You need to define first two columns of your data set as numeric values representing latitude and longitude. 

(by AliRıza AdıyahşiCMoreirabjornd)

參考文件

  1. Google geocharts with coordinates? (CC BY‑SA 3.0/4.0)

#google-visualization






相關問題

帶有坐標的谷歌地理圖表? (Google geocharts with coordinates?)

通過 JavaScript 客戶端 API Auth 使用 Google 電子表格作為“已驗證”數據源的 Google 可視化 API (Google Visualization API using Google Spreadsheet as "Authenticated" Data Source via JavaScript Client API Auth)

在 PHP 中壓縮 JSON 字符串並在 Javascript 中解壓縮以進行 Google API 的數據庫查詢 (Compress JSON string in PHP and decompress in Javascript for Database query for Google API)

用於創建 innerHTML 的 JavaScript 循環(Google 表格) (JavaScript loop to create innerHTML (Google Sheet))

相當於 GViz setVisibleChartRange 的 Dygraphs? (Dygraphs equivalent for GViz setVisibleChartRange?)

避免 Google 圖表中 X 軸的小數點 (Avoid decimal points in X-axis in Google charts)

如何從 Google 的 Visualization API 生成的條形圖中刪除 x 軸? (How do you remove the x-axis from a bar chart produced by Google's Visualization API?)

谷歌圖表 API 加載 (Google Chart API loading)

為 Google Charts Api 編寫自定義格式化程序 (Write a custom formatter for Google Charts Api)

IE7中的谷歌圖表 (Google Chart's in IE7)

谷歌圖表 - 直方圖:刪除項目的水平劃分 (google charts - histograms: remove horizontal division of items)

與 jquery 一起使用時,Google 圖表上的 Vaxis 不顯示 (Vaxis on Google chart not showing when used with jquery)







留言討論