在Google地图中显示缩放滑块 [英] Display zoom slider in google maps

问题描述

有没有一种方法可以使用其API在Google地图中显示缩放控制滑块(就像我今天从maps.google.com拍摄的这张图片一样)?

Is there a way to show zoom control slider in google maps using their API (like in this image I have taken today from maps.google.com)?

缩放滑块控件

我尝试在init中设置 style:google.maps.ZoomControlStyle.LARGE ，但是它不起作用.

I tried setting style: google.maps.ZoomControlStyle.LARGE in the init, but it doesnt work.

您可以看一下这个简单的示例-只有缩放按钮，没有滑块

You can look at this simple example - there are only zoom buttons, but no slider

https://codepen.io/anon/pen/pNORgv

var mapOptions = {
        zoom: 14,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoomControlOptions: {                                           
                            style: google.maps.ZoomControlStyle.LARGE,
                            position: google.maps.ControlPosition.RIGHT_BOTTOM
                }
};

推荐答案

旧的缩放控件已被删除.如果要包括一个，则需要对其进行自定义.我只浏览了此博客文章，内容涉及做一个，但看起来很全面.

The old zoom control has been removed. If you want to include one you'll need to custom make it. I only skimmed over this blog post about how to make one but it seems pretty comprehensive.

基本上，您需要创建一个自定义HTML元素并绑定函数以检测滑块中的更改并将这些更改发送到Google Map

Essentially you'll need to create a custom HTML element and tie functions to detect changes in the slider and emit those to the Google Map

这篇关于在Google地图中显示缩放滑块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！