个性化地图

功能场景

该示例介绍如何自定义地图样式。

DEMO

https://bj.bcebos.com/v1/mapopen/api-demos/video/个性化地图切换.mp4

白天模式与黑夜模式切换

核心接口

类	接口	描述	参考文档
Map	map.setMapStyleV2()	设置个性化地图	个性化地图

核心代码

            var map = new BMapGL.Map('container');
            map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 11);  
            map.enableScrollWheelZoom(true);  
            map.setMapStyleV2({styleJson: styleJson1});
            function setCustomStyle(e) {
                if (e.className.indexOf('current') === -1) {
                    var allLi = document.getElementsByClassName('btn');
                    for (var i = 0; i < allLi.length; i++) {
                        allLi[i].className = allLi[i].className.replace(' current','').trim();
                    }
                    e.className += ' current';
                    if (e.className.indexOf('light') !== -1) {
                        map.setMapStyleV2({styleJson: styleJson1});
                    } else {
                        map.setMapStyleV2({styleJson: styleJson2});
                    }
                }
            }