javascript - Google map 上的 .setZoom() 函数

Question

我使用以下方法创建 map :

var mapOptions = {
        zoom : 15
    };
    //Create map.
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

我在 html 文件上添加了一个 slider :

 <div class="sliderBar" id="sliderBar">
                <input type="range" min="1" max="100" value="1" step="1"
                    onchange="showValue(this.value)" /> <span id="range">1</span>
</div>

因此，当 slider 的值发生变化时，我会调用 showValue(this.value) 函数

使用此功能我必须更改 map 缩放，但它仅在第一次时有效。 因此，当我更改值时有效，但如果我再次更改值则不起作用。

这是我的功能:

function showValue(newValue) {
    document.getElementById("range").innerHTML = newValue;

    //var value=1;
    value = newValue;  

    if(50<value<=100){
        map.setZoom(11);
    }else if(25<value<=50){
        map.setZoom(12);
    }else if(10<value<=25){
        map.setZoom(13);
    }else if(5<value<=10){
        map.setZoom(14);
    }else{
        map.setZoom(15);
    }
}

如何解决这个问题？

Answer 1

找到/解决了。 if 条件有问题

以这种方式尝试条件

function showValue(newValue) {
    document.getElementById("range").innerHTML = newValue;


    value = newValue;  

    if ( value > 10 &&  value <= 25){
        map.setZoom(13);
        return 
    }
    if ( value > 25 &&  value <= 50){
        map.setZoom(12);
        return; 
    }
    if ( value > 50 && value <= 100){
        map.setZoom(11);
        return
    }
    if (  value > 5 && value <= 10){
        map.setZoom(14);
        return
    }

    map.setZoom(15);
    return 
}