2013-03-14 121 views
5

我有一些數據是通過安裝在汽車上的GPS設備收集的。所以我擁有的數據基本上都躺在街/路上/周圍。每個座標都有一定的價值。數據的格式是這樣的。谷歌地圖上沒有集羣的100k或更多標記

lat   | long  | value 
--------------------------------- 
12.979155 | 77.644925 | 6 
--------------------------------- 
12.97916833 | 77.64493667 | 2 
--------------------------------- 
12.97917167 | 77.64492167 | 8 

我的任務是在谷歌地圖上繪製這些經緯圖。當我們談論放置10個,100個或1000個標記時,這似乎是相當容易的任務。但正如我上面提到的,我們正在通過驅動器收集數據,並且兩個經緯度或兩個點之間的距離將會很少(例如2-3英尺)。

因此,在調查結束時,我會爲城市的一小部分提供90-100k lat,可能會爲整個城市增加100萬。

我已經嘗試添加9-10k標記和它的woking罰款,但是當我試圖加載40k,50k,60k它使我的瀏覽器非常慢,這是我結束的錯誤消息。

Uncaught RangeError: Maximum call stack size exceeded  main.js:1 

我一直在谷歌上搜索了很多關於它,但我不是能找到任何實例或教程,這將導致我使用的技術,我知道有點放置百萬標記。(這是asp.net )。 找到這個例子http://www.scribblemaps.com/markerComplex/ Jonathan Wagner,但我不能理解它,並在我現有的代碼中實現它,就像這樣。

//從MSSQL服務器獲取lat-long。

function PushValues(ParameterID) { 
     a = ParameterID.slice(5); 
    var CityID = $('#ddlCity').val().split('|'); 
    $.ajax({ 
     type: "POST", 
     url: "index.aspx/PushLatLong", 
     data: "{CityID:'" + CityID[0] + "',OperatorID:'" + $('#ddlOperator').val() + "',ParameterID:'" + ParameterID.slice(4) + "'}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     async: false, 
     cache: false, 
     success: function (response) { 
      GooglePlaces = response.d.split('#'); 
      if (GooglePlaces != "Blank") { 
       HasValues = 1; 
      } else { 
       HasValues = 0; 
      } 

     }, 
     Error: function (r) { 

     } 
    }); 
} 

//在谷歌地圖中放置值。

function PlaceValues() { 
    var options = { zoom: 3, center: new google.maps.LatLng(37.09, -95.71), mapTypeId: google.maps.MapTypeId.ROADMAP }; 
    var map = new google.maps.Map(document.getElementById('map'), options); 
    var bounds = new google.maps.LatLngBounds(); 
    for (var i = 0; i < GooglePlaces.length; i = i + 2) { 
     ltlg = new google.maps.LatLng(GooglePlaces[i], GooglePlaces[i + 1]); 
     var marker = new google.maps.Marker({ 
      position: ltlg, 
      map: map, 
      title: 'Place number', 
      icon: "img/GoogleIcons/" + legendfirstvalue[1] 
     }); 
     bounds.extend(ltlg); 
    } 
    map.fitBounds(bounds) 
    $('#DivLoadImage').hide(); 
} 

還有一點我想在此一提的是,標記的顏色取決於LAT-長期的價值。所以我會有多個顏色標記。我可以很容易地嘗試羣集標記,但是,我不能看到標記顏色,直到我到該區域。所以我無法使用clustring。

我確信在我的代碼中會有數百萬個錯誤。如果需要,我願意改變我的方法。 Here是應用程序的演示。

+0

http://coeindia.in/test/harry/index.html不起作用 – Kiquenet 2015-04-06 06:32:13

+0

這是我老僱主網站的一個網址。他們可能在目錄中做了一些更改。 – Ravi 2015-06-11 08:50:16

回答

1

最接近你可以得到(沒有聚類)是使用融合表來存儲數據並從那裏檢索它 - 這可能類似於你的例子已經使用 - 因爲它的閃存可以使它們比正常的API快得多可以完成。

融合表本身將在服務器端將標記渲染爲圖塊並檢索這些標記。

的谷歌地圖API,可讓您呈現包含在谷歌 Fusion Tables的使用FusionTablesLayer對象在地圖上的圖層。

例子吧in this link.

與fusiontables我會做類似的基於視窗的渲染

總之這基本上意味着僅繪製標記,以視可見 - 不是真正的「聚類技術」,但非常有用的,當我們正在考慮渲染速度。閱讀更多關於它們的信息google docs (fusiontables)viewport marker management.相同的頁面還包含更詳細的鏈接Fusiontables api和教程。

如果你最終決定在服務器端進行集羣 - 要做好準備,這不是一件容易的事情 - 但如果你這樣做,實現類似於基於網格的集羣。 (還解釋withing在同一個頁面 - 該死的好鏈接?)

另外要注意的是:

只有在一個表中的數據的第一100,000行映射或包含在查詢結果。

要了解更多信息,see from here.

乾杯。

+0

@Mauno V.我瀏覽了上面提到的細節。融合表有一些限制。在獲取和上傳數據方面存在限制,每個用戶只能存儲250 MB數據。我不認爲按照我的要求,這將是我的正確選擇。 – Ravi 2013-03-16 15:06:54

+0

那麼,它需要有一些c的限制。但有了正確的設計,它可以工作..你檢查或詢問你是否收到更多,如果你購買它的業務和支付現金?我相信谷歌也需要賺一些錢,所以他們設定了限制。 :) – 2013-03-16 15:53:36

0

融合表是大數據的途徑。這些表格可以使用GmapGIS進行查看和修改。