【问题标题】:Custom Street View自定义街景
【发布时间】:2013-05-07 20:09:55
【问题描述】:

我正在尝试创建建筑物内部的自定义 Google 街景。我看过很多地方,我已经看到了如何做到这一点的基本想法。 我一直在使用这个链接 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(即 00-00_s1.jpg、00-01_s1.jpg、00-02_s1.jpg)的 jpeg。 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>

【问题讨论】:

  • 我们想通了,等我的工作安排好了,我会发布一个深入的过程。

标签: google-maps google-maps-api-3 google-earth google-street-view


【解决方案1】:

查看您提供的链接,您似乎可以将您的(平铺)图像放在任何您想要的地方。下面的函数用于在检索它们时指定位置。

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-0_si.jpg 0-1_s1.jpg 等等代替 00-00_s1.jpg, 00-01_s1.jpg, 00-02_s1.jpg
猜你喜欢
  • 2012-06-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-06-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多