• leaflet生成地图封装成jquery插件使用


     公司业务里一直都有使用leaflet地图插件来做地图展示、绘图等操作。公司有个项目已经有好几年了,由于项目原因一直在使用,今年由于google 地图 api过期,导致已经使用的地图无法加载。我作为现在该项目的维护者,虽然未参与项目的开发阶段,但是事情在我手上了还是要处理的。

    上面说到api过期,无法加载地图了。我首先想到的是更换api key,翻墙出去,搞了许久,没有成功。想想也是,就我这个英语水平成功就是偶然。当然也不全是英语问题,在我在墙外的世界捣鼓来捣鼓去的时候,隐约的发现谷歌api 有关的认证加强了(事情过了1一个月了,也忘记了)。

    在最简单的方法尝试无效后,下定决心重写吧。好,写,一顿搜索猛如虎(差点写成:猛如狗了^_^),最后找了个现成的代码来改吧改吧就可用了。其实改完效果还可以,比以前多了 图层切换功能,而且使用国内地图也不怕哪天项目上说用谷歌不行了。

    上面的事情距离我现在写这个文章的时候有一个月了。我是按照用一个项目改一个项目的原则,有些项目无人问津了,我便没改了。按照之前的套路,合并了其他已改项目的分支,项目类似,基本合并无冲突。代码到了现在的项目上了,由于这个项目用到了这套系统且要更新功能,我真nm的欲哭无泪,好老的项目了(用的还是php yii1的框架,前端用的是一框bjui的框架,说起它可能知道的人不多,但是jui框架应该要多点,它就是基于jui的框架)。

    埋怨项目老,技术老之后还是要做事,因为在系统升级完成之前必须用它苟延残喘下去。翻看着代码,终于忍不住了,怎么可以这么重复的做某件事呢,难道是对它不想忘记吗? 重复不说,js里面混入php的判断,这些老的套路,越看越那啥了

    又吐槽了代码之后,我先来展示一下那些 旋转代码吧(╯﹏╰)

        var mainLayer = new L.Google('HYBRID', {
            // maxNativeZoom : 3,
             // maxZoom : 4,
            // minZoom : 3,
            // noWrap : true,
            errorTileUrl : '<?php echo Yii::app()->baseUrl; ?>/images/tiles/empty.jpg?t=<?php echo time(); ?>',
            // continuousWorld : true,
            attribution : ''
        });
    
        var mainMap = L.map('map', {
                zoomControl: false
            })
            .setView([31.2288614009,104.0252005317], 17)
            .addLayer(mainLayer);
    
        <?php foreach ($lands as $key => $land) {
            if (!empty($land->polygon)) {
                $isBindPopup = $hasWarning = 'false';
                $labelContent = $land->name;
                if ((!empty($land->nodes) && count($land->nodes[0]->tempDataArr > 0) || count($land->devices) > 0)) {
                    $isBindPopup = 'true';
                }
                if ($land->hasWarning()) {
                    $hasWarning = 'true';
                    $labelContent .= '<br><span style="font-weight:normal; color:#c00;">' . $land->warningMessage . '</span>';
                }
                ?>
                land_polygon(<?php echo $land->polygon; ?>, mainMap, '<?php echo $labelContent; ?>', <?php echo $land->id; ?>, <?php echo $isBindPopup; ?>, <?php echo $hasWarning; ?>);
    
        <?php } } ?>
    
        <?php foreach ($hikvideos as $video) {
            if (!empty($video->marker)) {
                $isNull = 'true';
                if (!empty($video->land->nodes) && count($video->land->nodes[0]->tempDataArr) > 0) {
                    $isNull = 'false';
                }
                
                if (BUtils::isLocalClient()) {
                    $video->ip = $video->local_ip;
                    $video->http_port = $video->local_http_port;
                }
        ?>
    
            videoMarker(mainMap, <?php echo $video->marker; ?>, <?php echo $video->id; ?>, '<?php echo $video->name; ?>', <?php echo CJSON::encode($video); ?>, <?php echo $isNull ?>);
    
        <?php } } ?>
    
        <?php if (!empty($this->_config['xph_marker'])) {?>
            (function weatherStationMarker (map, latLng, labelContent) {
                var myIcon = L.divIcon({
                    iconSize: [50, 67],
                    className: 'weather-station-marker'
                });
                var marker = new L.Marker(latLng, {
                    icon: myIcon
                });
                map.addLayer(marker);
                if (labelContent) {
                    // marker.bindLabel(labelContent, {noHide: false}).addTo(map);
                    var label = new L.Label({
                        noHide: true
                    });
                    label.setContent(labelContent).setLatLng({lat: latLng.lat, lng:latLng.lng + 1.4});
                    map.showLabel(label);
                }
                marker.on('popupopen', function(event) {
                    $('#map').bjuiajax('refreshDiv', 'leaflet_land_popup_xph');
                }).on('mouseout', function(event) {
    
                }).bindPopup(document.getElementById('leaflet_land_popup_xph'), {
                    minWidth: 500,
                    className: 'leaflet-popup'
                });
            })(mainMap, <?php echo $this->_config['xph_marker']; ?>, '气象站');
        <?php }?>
    
        <?php if (!empty($this->_config['xph_soil_marker'])) {?>
            (function soilStationMarker (map, latLng, labelContent) {
                var myIcon = L.divIcon({
                    iconSize: [50, 67],
                    className: 'soil-station-marker'
                });
                var marker = new L.Marker(latLng, {
                    icon: myIcon
                });
                map.addLayer(marker);
                if (labelContent) {
                    // marker.bindLabel(labelContent, {noHide: false}).addTo(map);
                    var label = new L.Label({
                        noHide: true
                    });
                    label.setContent(labelContent).setLatLng({lat: latLng.lat, lng:latLng.lng + 1.4});
                    map.showLabel(label);
                }
                marker.on('popupopen', function(event) {
                    $('#map').bjuiajax('refreshDiv', 'leaflet_land_popup_xph_soil');
                }).on('mouseout', function(event) {
    
                }).bindPopup(document.getElementById('leaflet_land_popup_xph_soil'), {
                    minWidth: 500,
                    className: 'leaflet-popup'
                });
            })(mainMap, <?php echo $this->_config['xph_soil_marker']; ?>, '土壤墒情监测点');
        <?php }?>
    
        function videoMarker (map, latLng, id, labelContent, videoOption, isNull) {
            var myIcon = L.divIcon({
                iconSize: [25, 41],
                className: 'video-marker'
            });
            var marker = new L.Marker(latLng, {
                icon: myIcon
            });
    
            wth = 350;
            if (!isNull) {
                wth = 800;
            }
    
            map.addLayer(marker);
            if (labelContent) {
                marker.bindLabel(labelContent, {noHide: false}).addTo(map);
                // var label = new L.Label({
                //     noHide: true
                // });
                // label.setContent(labelContent).setLatLng(latLng);
                // map.showLabel(label);
            }
            marker.on('mouseover', function(event) {
    
            }).on('mouseout', function(event) {
    
            }).bindPopup(document.getElementById('leaflet_video_popup'), {
                minWidth: wth,
                className: 'leaflet-popup',
            });
    
            marker.on('popupopen', function(event) {
                setTimeout(function () {
                    $('#leaflet_video_refresh').show();
                    $('#leaflet_video_name').text(videoOption.name);
    
                    video_window = '';
                    var html = $('#bjui-navtab .tabsPageContent').find('#video_window').html();
                    if (html) {
                        video_window = $('#video_window').remove();
    
                        $('#leaflet_video_window').html(video_window);
                        $('#video_window').addClass('video_window');
    
                        WebVideoCtrl.I_ChangeWndNum(1);
                    }
    
                    videoInit();
                    videoLogin(videoOption);
    
                    if (!isNull) {
                        $('#refresh_land_info').show();
                    } else {
                        $('#refresh_land_info').hide();
                    }
    
                    $('#leaflet_video_window').bjuiajax('doLoad', {url:"<?php echo $this->createUrl('land/realdata', ['id' => '_ID_']); ?>".replace('_ID_', videoOption.land_id), target:"#refresh_land_info"});
    
                }, 10);
            }).on('popupclose', function(event) {
                console.log('popupclose', videoOption);
            });
        }
    
        function land_polygon (polygon, map, labelContent, id, isBindPopup, hasWarning) {
            var initColor = 'pink',
                initOpacity = 0.3,
                hoverColor = 'orange',
                hoverOpacity = 0.3;
            if (hasWarning) {
                initColor = 'red';
            }
            var land = new L.Polygon(polygon, {
                weight: 2,
                opacity: initOpacity,
                fillOpacity: initOpacity,
                color: initColor
            });
            var domId = 'leaflet_land_popup_' + id;
            map.addLayer(land);
            var label = new L.Label();
            label.setContent(labelContent).setLatLng(land.getBounds().getCenter());
            map.showLabel(label);
            land.on('mouseover', function(event) {
                land.setStyle({
                    color: hoverColor,
                    opacity: hoverOpacity,
                    fillOpacity: hoverOpacity,
                });
            }).on('mouseout', function(event) {
                land.setStyle({
                    color:initColor,
                    opacity: initOpacity,
                    fillOpacity: initOpacity,
                });
            }).on('popupopen', function(event) {
                $('#map').bjuiajax('refreshDiv', domId);
            });
    
            if (isBindPopup) {
                land.bindPopup(document.getElementById(domId), {
                    minWidth: 500,
                    className: 'leaflet-popup'
                });
            }
        }
    </script>

    就这样的代码,能在一个代码里面好几个地方重复出现,你说是有多大的心去维护啊,又难受了。

    说了这么的故事,该说重点了,基于上面的情况呢,必须有个什么东西来优化它,想来想去,考虑地图是基于dom生成加载的,那这样的话,写一个jquery的插件应该是比较好的了,当然的话自己封装一个类也行。

    对于jquery插件的话,我分享一个网址吧:jquery插件

    附上巨人的肩膀

    1、ChineseTmsProviders:Leaflet.ChineseTmsProviders

    2、tileLayer.baidu

    L.CRS.Baidu = new L.Proj.CRS('EPSG:3395', '+proj=merc +lon_0=0 +k=1 +x_0=1440 +y_0=255 +datum=WGS84 +units=m +no_defs', {
        resolutions: function () {
            level = 19
            var res = [];
            res[0] = Math.pow(2, 18);
            for (var i = 1; i < level; i++) {
                res[i] = Math.pow(2, (18 - i))
            }
            return res;
        }(),
        origin: [0, 0],
        bounds: L.bounds([20037508.342789244, 0], [0, 20037508.342789244])
    });
    
    L.tileLayer.baidu = function (option) {
        option = option || {};
    
        var layer;
        var subdomains = '0123456789';
        switch (option.layer) {
            //单图层
            case "vec":
            default:
                //'http://online{s}.map.bdimg.com/tile/?qt=tile&x={x}&y={y}&z={z}&styles=pl&b=0&limit=60&scaler=1&udt=20170525'
                layer = L.tileLayer('http://online{s}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=' + (option.bigfont ? 'ph' : 'pl') + '&scaler=1&p=1', {
                    name:option.name,subdomains: subdomains, tms: true
                });
                break;
            case "img_d":
                layer = L.tileLayer('http://shangetu{s}.map.bdimg.com/it/u=x={x};y={y};z={z};v=009;type=sate&fm=46', {
                    name: option.name, subdomains: subdomains, tms: true
                });
                break;
            case "img_z":
                layer = L.tileLayer('http://online{s}.map.bdimg.com/tile/?qt=tile&x={x}&y={y}&z={z}&styles=' + (option.bigfont ? 'sh' : 'sl') + '&v=020', {
                    name: option.name, subdomains: subdomains, tms: true
                });
                break;
    
            case "custom"://Custom 各种自定义样式
                //可选值:dark,midnight,grayscale,hardedge,light,redalert,googlelite,grassgreen,pink,darkgreen,bluish
                option.customid = option.customid || 'midnight';
                layer = L.tileLayer('http://api{s}.map.bdimg.com/customimage/tile?&x={x}&y={y}&z={z}&scale=1&customid=' + option.customid, {
                    name: option.name, subdomains: "012", tms: true
                });
                break;
    
            case "time"://实时路况
                var time = new Date().getTime();
                layer = L.tileLayer('http://its.map.baidu.com:8002/traffic/TrafficTileService?x={x}&y={y}&level={z}&time=' + time + '&label=web2D&v=017', {
                    name: option.name, subdomains: subdomains, tms: true
                });
                break;
    
            //合并
            case "img":
                layer = L.layerGroup([
                    L.tileLayer.baidu({ name: "底图", layer: 'img_d', bigfont: option.bigfont }),
                    L.tileLayer.baidu({ name: "注记", layer: 'img_z', bigfont: option.bigfont })
                ]);
                break;
        }
        return layer;
    };

    再谈谈我心路吧,其实也是司空见惯的东西了。

    1. 为了更好的配置,我选择了两种配置,也就是除了自己传递配置参数的话,也可以通过标签属性传递
    2. 不好解决坐标系问题,我选择了加一个参数来区分百度和其它地图
    3. 外部更好的使用,必须在需要的地方添加回调参数
    4. 为了统一的管理和不重复的添加,我选择了使用一个变量存储所有加载的图层。在设置的时候,已经出现的图层会直接返回

    最后我贴上目前的一个代码,改代码下午才写,不完善,下周应该会完善自己需要使用的地方。虽然已过了青葱的岁月,可是代码水平还是难^_^。

    /**
     * jQuery and leaflet Plugin createMap
     * jquery插件:生成百度、谷歌、高德、天地图等地图到页面
     *
     * version 1.0, 2020-03-20
     * by jcy
     * Git repository : https://github.com/jiechengyang/jqLeafletCreateMap
     */
    
    /**
     * example:
     *
     * 默认生成谷歌等多图层【查看地图右上角图层管理工具】:var mapService = $("#map").createMap({center: [lat, lng]});
     *
     * 生成百度地图:var mapService = $("#map").createMap({center: [lat, lng], imap: 'Bd.Normal.Map'});
     *
     * 生成单张地图请传递:single:true
     *
     * 修改默认加载地图请传:iLayer:'对应chinaProviderKeys的key值'
     * */
    
    /**
     * add method:
     * iconMarker: 图标加载
     * addPolygon: 面加载
     *
     */
    (function ($) {
        function arrIndexOf(array, find, field) {
            var index = -1;
            for (var i = 0; i < array.length; i++) {
                var arr = array[i];
                if (arr[field] === find) {
                    index = i;
                    break;
                }
            }
    
            return index;
        }
    
        function mapService() {
            this.layers = [];
            this.chinaProviderKeys = [
                {
                    key: 'Geoq.Normal.Map',
                    name: '智图地图',
                    group: 'Geog'
                },
                {
                    key: 'Geoq.Normal.PurplishBlue',
                    name: '智图午夜蓝',
                    group: 'Geog'
                },
                {
                    key: 'Geoq.Normal.Gray',
                    name: '智图灰色',
                    group: 'Geog'
                },
                {
                    key: 'Geoq.Normal.Warm',
                    name: '智图暖色',
                    group: 'Geog'
                },
                {
                    key: 'TianDiTu.Normal.Map',
                    name: '天地图',
                    group: 'TianDiTu'
                },
                {
                    key: 'TianDiTu.Normal.Annotion',
                    name: '',
                    group: 'TianDiTu'
                },
                {
                    key: 'TianDiTu.Satellite.Map',
                    name: '天地图影像',
                    group: 'TianDiTu'
                },
                {
                    key: 'TianDiTu.Satellite.Annotion',
                    name: '',
                    group: 'TianDiTu'
                },
                {
                    key: 'Google.Normal.Map',
                    name: '谷歌地图',
                    group: 'Google'
                },
                {
                    key: 'Google.Satellite.Map',
                    name: '谷歌影像',
                    group: 'Google'
                },
                {
                    key: 'GaoDe.Normal.Map',
                    name: '高德地图',
                    group: 'GaoDe'
                },
                {
                    key: 'GaoDe.Satellite.Map',
                    name: '高德影像',
                    group: 'GaoDe'
                },
                {
                    key: 'GaoDe.Satellite.Annotion',
                    name: '',
                    group: 'GaoDe'
                }
            ];
            this.map = null;
            this.get = function (key) {
                return this.layers.indexOf(key) === 1 ? this.layers[key] : null;
            }
            this.set = function (key, options) {
                if (this.layers.indexOf(key) >= 0) {
                    return this.get(key);
                }
    
                if (arrIndexOf(this.chinaProviderKeys, key, 'key') === -1) {
                    return null;
                }
    
                var layer = L.tileLayer.chinaProvider(key, options);
                this.layers[key] = layer;
                return layer;
            }
    
            this.delete = function (key) {
                delete this.layers[key];
            }
    
            this.getMap = function () {
                return this.map;
            }
    
            this.destroy = function () {
                this.layers = [];
                this.map = null;
            }
    
            this.init = function (domId, settings) {
                if (!settings.hasOwnProperty('iLayer')) {
                    settings.iLayer = settings.imap;
                }
                var defaultMapOpts = {
                    zoom: settings.zoom,
                    zoomControl: settings.zoomControl,
                    center: settings.center
                };
    
                var bdMap = false;
                if (settings.imap === 'Bd.Normal.Map') {
                    defaultMapOpts.crs = L.CRS.Baidu;
                    bdMap = true;
                }
    
                var mainMap = L.map(domId, defaultMapOpts);
                this.map = mainMap;
                var opts = {
                    maxZoom: settings.maxZoom,
                    minZoom: settings.minZoom,
                };
    
                if (bdMap) {
                    opts.layer = settings.bdLayer ? settings.bdLayer : 'custom';
                    opts.customid = settings.bdCustomid ? settings.bdCustomid : 'googlelite';
                    var firstLayer = this.getBdMap(opts);
                    settings.single = true;
                } else {
                    var firstLayer = this.set(settings.iLayer, opts);
                }
                if (firstLayer) {
                    mainMap.addLayer(firstLayer);
                }
    
                if (!settings.single) {
                    var baseLayers = this.addLayers(settings.method, opts);
                    if (baseLayers) {
                        var providerName = this.chinaProviderKeys[arrIndexOf(this.chinaProviderKeys, settings.iLayer, 'key')]['name'];
                        baseLayers[providerName] = firstLayer;
                        L.control.layers(baseLayers, null).addTo(mainMap);
                    }
                }
                L.Util.requestAnimFrame(mainMap.invalidateSize, mainMap, !1, mainMap._container);
            }
    
            this.addLayers = function (method, opts) {
                method = 'add' + method;
                if (this.hasOwnProperty(method)) {
                    return this[method].call(this, opts);
                }
    
                return {};
            }
    
            /**
             * 智图内容
             */
            this.addGeoNorMaps = function (options) {
                var layers = {};
                for (var i = 0; i < this.chinaProviderKeys.length; i++) {
                    var provider = this.chinaProviderKeys[i];
                    if (provider.group !== 'Geog') continue;
                    var layer = this.set(provider.key, options);
                    if (layer) {
                        layers[provider.name] = layer;
                    }
                }
    
                return layers;
            }
    
    
            /**
             * 百度地图
             */
            this.getBdMap = function (options) {
                options = $.extend({
                    // maxZoom: 18,
                    // minZoom: 4,
                    attribution: 'ⓒ 2020 Bd Map',
                    layer: 'custom',
                    customid: 'grassgreen',
                    // crs: L.CRS.Baidu
                }, options);
                //百度:titleLayer.baidu.js
                //TODO: 请引入 proj4.js 和 proj4leaflet.js
                var layer = new L.tileLayer.baidu(options);
                this.layers['Bd.Normal.Map'] = layer;
                return layer;
            }
    
            /**
             * 天地图内容
             */
            this.addTianDiMaps = function (options) {
                var normalm = this.set('TianDiTu.Normal.Map', options),
                    normala = this.set('TianDiTu.Satellite.Annotion', options),
                    imgm = this.set('TianDiTu.Satellite.Map', options),
                    imga = this.set('TianDiTu.Normal.Map', options);
                var normal = L.layerGroup([normalm, normala]),
                    image = L.layerGroup([imgm, imga]);
    
                return {
                    "天地图": normal,
                    "天地图影像": image,
                }
            }
    
            /**
             * 谷歌地图内容
             */
            this.addGoogleMaps = function (options) {
                var normalMap = this.set('Google.Normal.Map', options),
                    satelliteMap = this.set('Google.Satellite.Map', options);
                return {
                    "谷歌地图": normalMap,
                    "谷歌影像": satelliteMap,
                }
            }
    
            /**
             * 高德地图
             */
            this.addGaoDeMaps = function (options) {
                var Gaode = this.set('GaoDe.Normal.Map', options);
                var Gaodimgem = this.set('GaoDe.Satellite.Map', options);
                var Gaodimga = this.set('GaoDe.Satellite.Annotion', options);
                var Gaodimage = L.layerGroup([Gaodimgem, Gaodimga]);
                return {
                    "高德地图": Gaode,
                    "高德影像": Gaodimage,
                }
    
            }
    
            /**
             *  所有地图
             */
            this.addAllMaps = function (options) {
                var keys = [
                    'GeoNorMaps',
                    'TianDiMaps',
                    'GoogleMaps',
                    'GaoDeMaps',
                ];
                var layers = {};
                for (var i in keys) {
                    var method = 'add' + keys[i];
                    if (this.hasOwnProperty(method)) {
                        layers = $.extend(layers, this[method](options));
                    }
                }
    
                return layers;
            }
        }
    
        /**
         *
         * 图表标记
         */
        mapService.prototype.iconMarker = function (icon, marker, labelContent, popupOpts, events) {
            events = events || null;
            labelContent = labelContent || null;
            var defaultOpts = {
                minWidth: 500,
                className: 'leaflet-popup'
            };
            popupOpts = $.extend(defaultOpts, popupOpts);
            var marker = new L.Marker(marker, {
                icon: icon
            });
            this.getMap().addLayer(marker);
            if (labelContent) {
                var label = new L.Label({
                    noHide: true
                });
                label.setContent(labelContent).setLatLng({lat: marker.lat, lng: marker.lng + 1.4});
                this.getMap().showLabel(label);
            }
            if (popupOpts.id) {
                marker.bindPopup(document.getElementById(popupOpts.popupId), popupOpts);
            }
    
            if (events) {
                for (var eKey in events) {
                    marker.on(eKey, events[eKey]);
                }
            }
    
            return marker;
        };
    
        /**
         *
         * 多边形地块
         */
        mapService.prototype.landPolygon = function (polygonObj, opts, events) {
            var defaultOpts = {
                initColor: 'pink',
                initOpacity: 0.3,
                hoverColor: 'orange',
                hoverOpacity: 0.3,
                domId: 'leaflet_land_popup_' + polygonObj.id,
            };
            events = events || {};
            opts = $.extend(defaultOpts, opts);
            if (polygonObj.hasWarning) {
                opts.initColor = 'red';
            }
            var land = new L.Polygon(polygonObj.polygon, {
                weight: 2,
                opacity: opts.initOpacity,
                fillOpacity: opts.initOpacity,
                color: opts.initColor
            });
            this.getMap().addLayer(land);
            var label = new L.Label();
            label.setContent(polygonObj.labelContent).setLatLng(land.getBounds().getCenter());
            this.getMap().showLabel(label);
            var defaultEvent = {
                mouseover: function (event) {
                    land.setStyle({
                        color: opts.hoverColor,
                        opacity: opts.hoverOpacity,
                        fillOpacity: opts.hoverOpacity,
                    });
                },
                mouseout: function (event) {
                    land.setStyle({
                        color: opts.initColor,
                        opacity: opts.initOpacity,
                        fillOpacity: opts.initOpacity,
                    });
                }
            };
    
            events = $.extend(defaultEvent, events);
    
            for (var eKey in events) {
                land.on(eKey, events[eKey]);
            }
    
            if (polygonObj.isBindPopup) {
                land.bindPopup(document.getElementById(polygonObj.domId), {
                    minWidth: 500,
                    className: 'leaflet-popup'
                });
            }
    
            return land;
        };
    
        var methods = {
            init: function (options) {
                var tData = this.data() || {};
                // TODO: 参数合并:隐式参数与显示参数;隐式参数:dom标签的data-属性 显示参数:调用对象传参
                options = $.extend(tData, options);
                var settings = $.extend({
                    maxZoom: 18,// leaflet 参数
                    minZoom: 5,// leaflet 参数
                    zoom: 14,// leaflet 参数
                    zoomControl: false,// leaflet 参数
                    center: [30.29898916168688, 103.57831210632321],// leaflet 参数
                    imap: 'Google.Normal.Map',// 插件 参数:默认地图加载谷歌地图,Bd.Normal.Map:由于坐标系问题,暂时只能加载它一个地图
                    bdLayer: 'custom',// 百度地图图层选择,
                    bdCustomid: 'googlelite',// 插件 参数:百度地图图层样式选择
                    single: false,// 插件 参数:是否加载单个地图图层:默认是加载多张
                    method: 'AllMaps'// 插件 参数:加载多张地图图层时有几种类型选择:智图、天地图、百度、谷歌、高德
                }, options);
                var service = new mapService();
                service.init(this.attr('id'), settings);
                return service;
            },
            destroy: function () {
                this.empty();
            }
        };
    
        $.fn.createMap = function (method) {
            method = method || null;
            if (methods[method]) {
                return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
            } else if (typeof method === 'object' || !method) {
                return methods.init.apply(this, arguments);
                // return methods.init(this, methods);
            } else {
                $.error('Method' + method + 'does not exist on jQuery.tooltip');
            }
        }
    })(jQuery);

     最后再说一下,我们提升代码质量的唯一途径只有看源码。愿得到指点,愿共勉。

                                                                                                                                         -------------------------垃圾猿

  • 相关阅读:
    asp.net中分页与存储过程的一些总结
    Ajax与Json的一些总结
    aspx页面与服务器控件间运行原理
    ASP.NET中Server对象的几个方法
    Cookie与Session的一些总结
    ASP.NET的学习之asp.net整体运行机制
    Find offset of first/last found substring
    由于DNS反向解析导致的登录BI启动版速度变慢问题
    4-自定义BI启动版Logon界面
    3-自定义BI启动版是否隐藏CMS名称
  • 原文地址:https://www.cnblogs.com/YangJieCheng/p/12535952.html
Copyright © 2020-2023  润新知