自定义街景按钮/控件

迈克尔·拉米雷斯

我希望能够使用Google Maps API v3拥有自己的“街景”按钮。单击按钮后,我希望它根据标记的纬度加载街道视图。然后,我想将按钮更改为“返回地图”,然后将再次加载默认地图视图。

单击按钮时,我试图使用getStreetView(myLatlng),但它没有加载街景,因此我在这里一定会遗漏某些东西,但似乎无法在网络上找到任何帮助。这是我的代码:-

        var map;
    var myLatlng = new google.maps.LatLng(42.333029,-83.04559);

    /**
     * The HomeControl adds a control to the map that simply
     * returns the user to Chicago. This constructor takes
     * the control DIV as an argument.
     * @constructor
     */
    function customStreetView(controlDiv, map) {

      // Offset from the corner
      controlDiv.style.padding = '10px';

      // Create control div
      var controlUI = document.createElement('div');
      controlUI.innerHTML = "View on street";
      controlUI.className = "google_map_button"
      controlDiv.appendChild(controlUI);

      // Setup the click event listener
      google.maps.event.addDomListener(controlUI, 'click', function() {
        var panorama = map.getStreetView(myLatlng);
        if(panorama){panorama.setVisible(false);}
      });

    }

    function initialize() {

        var mapOptions = {
            zoom: 17,
            center: myLatlng,
            panControl: true,
            zoomControl: true,
            mapTypeControl: false,
            scaleControl: true,
            streetViewControl: false,
            overviewMapControl: true
        }

        var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

        // Set the marker
        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            icon: 'images/google-map-marker.png'
        });

        // Create the DIV to hold the control and
        // call the HomeControl() constructor passing
        // in this DIV.
        var homeControlDiv = document.createElement('div');
        var homeControl = new customStreetView(homeControlDiv, map);

        homeControlDiv.index = 1;

        map.controls[google.maps.ControlPosition.TOP_RIGHT].push(homeControlDiv);       

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

    </script>

有人可以帮忙吗?

谢谢

莫勒博士
  1. 当然,要显示全景时必须设置visibletrue
  2. position不会通过的参数进行设置getStreetView()时,必须设置该属性通过setsetValuessetPositionsetOptions

    google.maps.event.addDomListener(controlUI, 'click', function() {
      map.getStreetView().setOptions({visible:true,position:myLatlng});
    });
    

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

自定义单选按钮控件(Winforms)

来自分类Dev

将自定义控件绑定到外部按钮

来自分类Dev

自定义控件未绘制Windows窗体按钮

来自分类Dev

DataGridTemplateColumn的自定义控件

来自分类Dev

自定义gui控件

来自分类Dev

指令自定义控件

来自分类Dev

自定义控件Android

来自分类Dev

自定义控件的自定义属性

来自分类Dev

自定义控件自定义标签“for”属性放置

来自分类Dev

C#- 自定义控件的自定义属性

来自分类Dev

如何在自定义控件中创建一个按钮以触发onClick事件,并以自定义控件所在的主要形式对其进行处理?

来自分类Dev

具有自定义用户控件的WPF单选按钮组冲突

来自分类Dev

如何替换/自定义情节提要导航控件中的后退按钮图像

来自分类Dev

向控件添加自定义删除(后退到前)按钮

来自分类Dev

所有Qt快速按钮控件状态的自定义样式

来自分类Dev

如何使用辅助功能创建UWP自定义(即模板化)按钮控件

来自分类Dev

在Kendo上传控件的刷新按钮单击上执行自定义javascript功能

来自分类Dev

如何添加多个自定义控件按钮传单js?

来自分类Dev

如何用Fancybox 2.1.5中的自定义按钮替换默认控件?

来自分类Dev

如何在自定义控件的标题中添加按钮,以扩展Telerik RadTileViewItem?

来自分类Dev

在Kendo上传控件的刷新按钮单击上执行自定义javascript功能

来自分类Dev

如何添加多个自定义控件按钮传单js?

来自分类Dev

处理包含动态生成按钮的自定义控件上的单击事件 vb.net

来自分类Dev

需要修复:无法从 Listview-DataTemplate-ViewCell 内的自定义控件内的按钮打开模式

来自分类Dev

我可以使用 BindableProperty 在我的 Xamarin ContentView 自定义控件中禁用按钮吗?

来自分类Dev

自定义DatePicker按钮

来自分类Dev

自定义清除按钮

来自分类Dev

自定义按钮组

来自分类Dev

自定义单选按钮

Related 相关文章

  1. 1

    自定义单选按钮控件(Winforms)

  2. 2

    将自定义控件绑定到外部按钮

  3. 3

    自定义控件未绘制Windows窗体按钮

  4. 4

    DataGridTemplateColumn的自定义控件

  5. 5

    自定义gui控件

  6. 6

    指令自定义控件

  7. 7

    自定义控件Android

  8. 8

    自定义控件的自定义属性

  9. 9

    自定义控件自定义标签“for”属性放置

  10. 10

    C#- 自定义控件的自定义属性

  11. 11

    如何在自定义控件中创建一个按钮以触发onClick事件,并以自定义控件所在的主要形式对其进行处理?

  12. 12

    具有自定义用户控件的WPF单选按钮组冲突

  13. 13

    如何替换/自定义情节提要导航控件中的后退按钮图像

  14. 14

    向控件添加自定义删除(后退到前)按钮

  15. 15

    所有Qt快速按钮控件状态的自定义样式

  16. 16

    如何使用辅助功能创建UWP自定义(即模板化)按钮控件

  17. 17

    在Kendo上传控件的刷新按钮单击上执行自定义javascript功能

  18. 18

    如何添加多个自定义控件按钮传单js?

  19. 19

    如何用Fancybox 2.1.5中的自定义按钮替换默认控件?

  20. 20

    如何在自定义控件的标题中添加按钮,以扩展Telerik RadTileViewItem?

  21. 21

    在Kendo上传控件的刷新按钮单击上执行自定义javascript功能

  22. 22

    如何添加多个自定义控件按钮传单js?

  23. 23

    处理包含动态生成按钮的自定义控件上的单击事件 vb.net

  24. 24

    需要修复:无法从 Listview-DataTemplate-ViewCell 内的自定义控件内的按钮打开模式

  25. 25

    我可以使用 BindableProperty 在我的 Xamarin ContentView 自定义控件中禁用按钮吗?

  26. 26

    自定义DatePicker按钮

  27. 27

    自定义清除按钮

  28. 28

    自定义按钮组

  29. 29

    自定义单选按钮

热门标签

归档