文章/答案/技术大牛

发布

社区首页 >问答首页 >Google StreetView/Maps API

问Google StreetView/Maps API
EN

Stack Overflow用户

提问于 2015-07-20 15:37:30

回答 1查看 4.3K关注 0票数 3

我正试图在谷歌街景上覆盖一个标记。我可以在谷歌地图上得到一个标记，但它没有出现在GSV中。

https://jsfiddle.net/gnxnm4nt/

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
    <script>
function initialize() {
  var baltimore = new google.maps.LatLng(39.283024, -76.601765);
  var baltimore1 = new google.maps.LatLng(39.283223, -76.601851);


  var mapOptions = {
    center: baltimore,
    zoom: 14
  };
  var map = new google.maps.Map(
      document.getElementById('map-canvas'), mapOptions);
    var cafeMarker = new google.maps.Marker({
      position: baltimore1,
      map: map,
      icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|FFFF00',
      title: 'Cafe'
  });
  var panoramaOptions = {
    position: baltimore,
    pov: {
      heading: 34,
      pitch: 10
    }
  };
  var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'), panoramaOptions);
  map.setStreetView(panorama);
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>

API参考：https://developers.google.com/maps/documentation/javascript/examples/streetview-overlays https://developers.google.com/maps/documentation/javascript/examples/streetview-embed

谢谢!请检查一下我的小提琴，看看到目前为止我有什么。应该是在环形交叉路口出现的标记。

javascript

google-maps

google-street-view

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-07-20 18:59:33

您还必须将标记添加到街道视图(以及与地图上的标记不同)。

var cafeMarker2 = new google.maps.Marker({
    position: baltimore1,
    map: panorama,
    icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|FFFF00',
    title: 'Cafe'
});

更新小提琴

代码片段：

function initialize() {
  var baltimore = new google.maps.LatLng(39.283024, -76.601765);
  var baltimore1 = new google.maps.LatLng(39.283223, -76.601851);


  var mapOptions = {
    center: baltimore,
    zoom: 14
  };
  var map = new google.maps.Map(
    document.getElementById('map-canvas'), mapOptions);
  var cafeMarker = new google.maps.Marker({
    position: baltimore1,
    map: map,
    icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|FFFF00',
    title: 'Cafe'
  });
  var panoramaOptions = {
    position: baltimore,
    pov: {
      heading: 4,
      pitch: 10
    }
  };
  var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'), panoramaOptions);
  var cafeMarker2 = new google.maps.Marker({
    position: baltimore1,
    map: panorama,
    icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|FFFF00',
    title: 'Cafe'
  });
  map.setStreetView(panorama);
}

google.maps.event.addDomListener(window, 'load', initialize);

html,
body,
#map-canvas {
  height: 100%;
  margin: 0;
  padding: 0;
}

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="map-canvas" style="width: 45%; height: 100%;float:left"></div>
<div id="pano" style="width: 45%; height: 100%;float:left"></div>

票数 3

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/31520674

复制

相似问题

问Google StreetView/Maps API
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Google StreetView/Maps APIEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Google StreetView/Maps API
EN