2013-11-26 46 views
0

我想要做的是在科羅拉多州展示葡萄園。它顯示自定義圖標,並且它們位於正確的位置;但是,它不顯示所有數據。當有超過50個時,只顯示11點。有沒有辦法解決?Google Fusion API和顯示所有數據的問題

編輯:這也是我的Google Fusion表格。也許我的格式是錯誤的? https://www.google.com/fusiontables/DataSource?docid=1pYFq7mJ1uT4YYZ3LLzY4l7X8njLmZszJt05lucY#rows:id=1

融合地圖比較這樣的:http://s5.postimg.org/f80q3qhpz/display.png

這是我的HTML和Javascript。

<!DOCTYPE html> 

<!-- 

--> 

<html> 
<head> 
<title>Vineyards in Colorado</title> 

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 

<!-- Style --> 
<style type="text/css"> 
    body { height: 100%; margin: 0px; padding: 10px; } 
    #map_canvas { height: 600px; width: 700px; } 
</style> 

<!-- Google Maps API javascript --> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 

<!-- Import the visualization javascript --> 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 

<!-- Initialize visualization --> 
<script type="text/javascript"> 
    google.load('visualization', '1', {}); 
</script> 

<script type="text/javascript"> 

var tableid = 1; //the table id 
var map; 

/* INITIALIZE - initialize the map and geocoder */ 

function initialize() { 
    geocoder = new google.maps.Geocoder(); 
    map = new google.maps.Map(document.getElementById('map_canvas'), { 
    center: new google.maps.LatLng(39,-105.547222), //the center lat and long 
    zoom: 7, //zoom 
    mapTypeId: google.maps.MapTypeId.ROADMAP //the map style 
    }); 

    //make gviz request 
    setData(); 

} 

/* GVIZ - get data from Fusion Tables */ 

function setData() { 
    //create a viz query to send to Fusion Tables 
    var query = new google.visualization.Query('http://www.google.com/fusiontables/gvizdata?tq=' + encodeURIComponent("SELECT name, address FROM 1pYFq7mJ1uT4YYZ3LLzY4l7X8njLmZszJt05lucY")); 

    //set the callback function that will be called when the query returns 
    query.send(getData); 
} 

//define callback function, this is called when the results are returned 
function getData(response) { 

    //for more information on the response object, see the documentation 
    //http://code.google.com/apis/visualization/documentation/reference.html#QueryResponse 
    numRows = response.getDataTable().getNumberOfRows(); 
    numCols = response.getDataTable().getNumberOfColumns(); 

    //create an array of row values 
    for (i = 0; i < numRows; i++) { 
    var row = []; 
    for (j = 0; j < numCols; j++) { 
     row.push(response.getDataTable().getValue(i, j)); 
    } 
    codeAddress(row); 
    } 
} 

/* GEOCODING - geocode data in Fusion Tables, if the data is a String Address */ 

var geocoder; 
var lastWindow; 

//geocode the address, and create a new marker and InfoWindow at the geocoded location 
function codeAddress(row) { 
    geocoder.geocode({ 'address': row[1] }, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
     var coordinate = results[0].geometry.location; 

     //create the marker 
     var marker = new google.maps.Marker({ 
      map: map, 
      position: coordinate, 
      //this is where the magic happens! 
      icon: new google.maps.MarkerImage("http://s5.postimg.org/icgrcg88j/vineyard_2.png") 
     }); 

     //add a click listener to the marker to open an InfoWindow, 
     google.maps.event.addListener(marker, 'click', function(event) { 
     if(lastWindow) lastWindow.close(); //close the last window if it exists 
     lastWindow = new google.maps.InfoWindow({ 
      position: coordinate, 
      content: row[0] //this is the row data, you can use HTML here for the content 
     }); 
     lastWindow.open(map); 
     }); 
    } 
    }); 
} 


</script> 

</head> 
<body onload="initialize()"> 
    <div id="map_canvas"></div> 
</body> 
</html> 

回答

1

您地理編碼地址,將運行到OVER_QUERY_LIMIT錯誤(約10左右):

添加其他像這樣看到他們:

if (status == google.maps.GeocoderStatus.OK) { 
// .. your code 
} else { 
    alert("geocode failed:"+status); 
} 

你有表格中的緯度和經度,使用它們來顯示標記,不要使用地理編碼器。

your data with FusionTableLayer

+0

謝謝,它現在可行! – essy77896