0

我想創建一個建築物內部的自定義谷歌街景。我看了很多地方,我已經看到了如何做到這一點的基本想法。 我一直在使用這個鏈接 http://googlemaps.googlermania.com/google_maps_api_v3/en/custom_streetview/index.html 以及其他的例子。 他們似乎有非常相似的代碼,但他們似乎都缺乏的是如何設置文件。 如果有人知道我在哪裏可以找到一個工作示例,我應該能夠向後工作,如果有人可以給我一些詳細的指示,我會非常感激。自定義街景

我有一個運行Ubuntu服務器的VirtualBox。

在服務器上,我有一個名爲street.html(代碼如下)的html文件。

我還有一個名爲「lab_tiles」的文件夾,其中包含「lab_test」,其中包含幾個帶命名模式XX-YY_s1.jpg的jpeg(即00-00_s1.jpg,00-01_s1.jpg,00-02_s1 .jpg)

我對html文件有以下代碼。

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Custom Street View panorama tiles</title> 
    <meta charset="utf-8"> 
    <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet"> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 

<script type='text/javascript'> 

function code3_2() { 
    // Set StreetView provider. 
    var streetViewOptions = { 
    zoom: 1, 
    pano : "lab_test", 
    panoProvider: getCustomPanorama 
    }; 
    // Create a StreetView object. 
    var streetViewDiv = document.getElementById('streetview_canvas1'); 
    streetViewDiv.style.fontSize = "15px"; 
    var streetView = new google.maps.StreetViewPanorama(streetViewDiv, streetViewOptions); 
} 

function getCustomPanoramaTileUrl(panoID, zoom, tileX, tileY) { 
    // Return a pano image given the panoID. 
    return "lab_tiles/" + panoID + '/' + tileX + '-' +tileY + '_s1.jpg'; 
} 

function getCustomPanorama(panoID) { 
    var streetViewPanoramaData = { 
    links: [], 
    copyright: 'People at my job', 
    tiles: { 
     tileSize: new google.maps.Size(256, 256), 
     worldSize: new google.maps.Size(2048, 1024), 
     centerHeading: 0, 
     getTileUrl: getCustomPanoramaTileUrl 
    } 
    }; 
    switch(panoID) { 
    case "lab_test": 
     streetViewPanoramaData["location"] = { 
     pano: 'lab_test', 
     description: "lab test", 
     latLng: new google.maps.LatLng(37.556429,-122.050745) 
     }; 
     return streetViewPanoramaData; 
    } 
} 

google.maps.event.addDomListener(window, 'load', code3_2); 
    </script> 



    </head> 
    <body> 
    <div id="map-canvas"></div> 
    </body> 
</html> 
+0

我們想通了這一點,我會在我的工作日程清除了深入的過程中張貼。 – 2013-07-12 18:20:14

回答

0

看看你提供的鏈接似乎你可以把你的(瓷磚)圖像放在任何你想要的。以下功能用於指定檢索時的位置。

function getCustomPanoramaTileUrl(panoID, zoom, tileX, tileY) { 
    // Return a pano image given the panoID. 
    return "ardenwood_tiles/" + panoID + '/' + tileX + '-' +tileY + '_s1.jpg'; 
} 

在這種情況下,圖像將被命名的文件夾中ardenwood_tiles/visitor_center/

+0

我現在試過了,沒有成功。我編輯了我的帖子,以更清楚我目前的狀況。 – 2013-05-08 16:00:10

+0

你看到任何錯誤消息嗎?什麼都顯示?當您像在示例中那樣命名圖像時會發生什麼? 0-0_si.jpg 0-1_s1.jpg等,而不是00-00_s1.jpg,00-01_s1.jpg,00-02_s1.jpg – RST 2013-05-08 18:50:32