如何在SIMILE Exhibit地圖視圖中添加疊加圖像？

Question

任務我正在SIMILE Exhibit中使用Google Maps，並希望在其地圖視圖中添加圖像疊加層。 例如，將歷史地圖的圖像疊加在地圖的某個區域上。

我做了什么我已經嘗試理解和編輯在圖表庫中的“地圖view.js”文件。 然后，我嘗試根據這些說明手動編輯庫文件，以將覆蓋層添加到獨立地圖上，但沒有成功。 我也在Stackoverflow上搜索了類似的問題，並使用了Internet搜索引擎，但是得到的結果都與SIMILE Widgets或SIMILE Exhibit的時間軸視圖有關，而不是地圖視圖。

其他信息我的任務特定於地圖視圖，並且我正在將Exhibit v2.3.0與Google Maps v3一起使用。 目前，我已經能夠成功將多邊形和折線添加為地圖的疊加層。

Answer 1

回答我自己的問題，但這需要大量的努力和研究才能找到答案。 希望這可以幫助其他人解決這個問題。 因此，解決方案在於JavaScript。

資料來源：我從2009年開始就Google網上論壇進行了一次討論，提出了我解決方案的核心。 對於我的情況，此解決方案需要進行大量修改，因為我使用的是Google Maps v3，而代碼是針對v2的。 確定版本沖突后，我使用Google Developers網站將解決方案翻譯為API v3語法。 我需要的特定覆蓋在文檔中稱為“地面覆蓋”。

解決方案：這是適用於Exhibit v2.3.0和Google Maps v3的最終解決方案。 該代碼段需要添加到<head>部分。

<script type="text/javascript">
    var map;
    var oldMapViewReconstruct = Exhibit.MapView.prototype._reconstruct;
    Exhibit.MapView.prototype._reconstruct = function() {
        oldMapViewReconstruct.call(this);
        map = this._map;
        var imageBounds = new google.maps.LatLngBounds(
            new google.maps.LatLng(40.712216, -74.22655),
            new google.maps.LatLng(40.773941, -74.12544));

        historicalOverlay = new google.maps.GroundOverlay(
            'https://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
            imageBounds);
        historicalOverlay.setMap(map);
    }
</script>

注意：當然，出於說明目的，我僅舉一個疊加歷史地圖的具體示例，但是可以更改此記錄以適合類似目的。 要疊加的圖像是新澤西州的紐瓦克，其坐標是手動設置的（取自地面疊加層的文檔示例）。 請注意，如果您實施此操作，則可能必須手動縮放到附近的紐約以查看解決方案的工作情況並顯示疊加圖，因為我沒有添加用於自動居中或自動縮放的代碼。 另一個注意事項是，我正在使用帶有Exhibit的MapView容器包含我的地圖，例如<div ex:role="view" id="map1" ex:viewClass="MapView" ...

如何在SIMILE Exhibit地圖視圖中添加疊加圖像？

問題描述

1 個解決方案

解決方案1
0 已采納 2014-02-08 00:26:57

如何在SIMILE Exhibit地圖視圖中添加疊加圖像？

問題描述

1 個解決方案

解決方案1 0 已采納 2014-02-08 00:26:57

解決方案1
0 已采納 2014-02-08 00:26:57