如何在Google Maps InfoWindow中爲多個位置實現分頁？

我有谷歌地圖與多位置和多個標記在同一位置。如何在Google Maps InfoWindow中爲多個位置實現分頁？

我的地圖數據會是這樣

[{"DisplayText": "Test Window 1 - 1", "LatitudeLongitude": "61.095,10.547", "Location": "Oslo"}, 
{"DisplayText": "Test Window 1 - 2", "LatitudeLongitude": "61.095,10.547", "Location": "Oslo"}, 
{"DisplayText": "Test Window 2 - 1", "LatitudeLongitude": "61.585,8.369", "Location": "Ringebu Municipality"}, 
{"DisplayText": "Test Window 2 - 2", "LatitudeLongitude": "61.585,8.369", "Location": "Ringebu Municipality"}, 
{"DisplayText": "Test Window 1 - 3", "LatitudeLongitude": "61.095,10.547", "Location": "Oslo"}, 
{"DisplayText": "Test Window 3 - 1", "LatitudeLongitude": "61.778,11.3609", "Location": "Oslo Municipality"}, 
{"DisplayText": "Test Window 4 - 1", "LatitudeLongitude": "63.485,10.449", "Location": "Trondheim"}]

我需要顯示它具有相同的經緯度數據，長期在谷歌信息窗口中的滑塊。

有一個FIDDLE要顯示那樣。但我需要顯示與分頁功能

來源

2017-06-27 RaGu

「我需要顯示具有相同經度，Google in infowindow中的滑動條長的數據」，您可以稍微多解釋一下，還是可以舉個例子 –

爲了給你一個完整的工作答案真的會需要一些時間和實驗多個標誌，所以這些步驟，我會做：

找到所有接近一個製造商已被點擊。在你的情況下，他們在相同的位置，所以也許半徑10米的工作。 Finding all the markers inside a given radius

創建一個變量來包含infoWindow內容並將其添加到每個位於該位置的製造商。然後顯示該位置。

另一種可行的解決方案是首先將一組標記所需的所有infoWindow內容組合起來，然後添加一個製造商來表示該組標記。以某種方式將多個製造商添加到同一位置是違反直覺的，因爲只有一個人會被點擊。

來源

2017-06-30 09:55:58

這可以手動實施，利用InfoWindow上的setContent方法。

幾年前，我做了類似的事情 - 看到它的實際演示，加載以下頁面，並等待一會兒標記出來： http://www.auctionsearchkit.co.uk/search.php?satitle=test&site=UK。然後點擊幾個標記，直到您來到一個infowindow頂部有«<>»圖標（這是多個易趣搜索結果針對同一賣家的地方）。您可以檢查出的JavaScript的HTML頁面獲得更多細節，但基本上（有一些位切斷），你需要的東西是這樣的：

function getInfoWindowHtml(pc) { 
    var infoWindowHtml = '<span' + MOUSE_OVER_HAND 
           + ' title="View the first item at this location"' 
           + ' onclick="viewFirstItem(\'' + pc + '\')">' 
        + '&laquo;</span>&nbsp;' 
        + '<span' + MOUSE_OVER_HAND 
           + ' title="View the previous item at this location"' 
           + ' onclick="viewPrevItem(\'' + pc + '\')">' 
        + '&lt;</span>&nbsp;' 
        + '<span' + MOUSE_OVER_HAND 
           + ' title="View the next item at this location"' 
           + ' onclick="viewNextItem(\'' + pc + '\')">' 
        + '&gt;</span>&nbsp;' 
        + '<span' + MOUSE_OVER_HAND 
           + ' title="View the last item at this location"' 
           + ' onclick="viewLastItem(\'' + pc + '\')">' 
        + '&raquo;</span>&nbsp;&nbsp;' : 
         '') 
        + '...etc...'; 
    } 

    return infoWindowHtml; 
}

...和如下代碼打開它：

// Open the Info Window 
    var html = getInfoWindowHtml(pc); 
    infoWindow.setContent(html); 
    infoWindow.open(map, marker);

然後您就需要實現viewFirstItem，viewLastItem，viewNextItem和viewPrevItem功能適當地改變信息窗口的HTML。

來源

2017-07-06 12:50:36

如何在Google Maps InfoWindow中爲多個位置實現分頁？

回答

相關問題