leaflet+proj4调用百度地图实现常规及卫星地图效果代码

代码语言:html

所属分类:其他

代码描述:leaflet+proj4调用百度地图实现常规及卫星地图效果代码

代码标签: leaflet proj4 百度 地图 常规 卫星

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html>

<head>



    <meta charset="utf-8">

    <style type="text/css">
        body {
     
            padding: 0;
     
            margin: 0;
     
        }
     
        html,
     
        body,
     
        #map {
     
            height: 100%;
     
        }
    </style>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/leaflet.1.6.0.js"></script>
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/leaflet.1.6.0.css">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/proj4.js"></script>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/proj4leaflet.min.js"></script>

</head>

<body>

    <div id='map'></div>



<script type="text/javascript">
//如何打不开,请在http下打开,
    var baiduCRS = new L.Proj.CRS('EPSG:900913', '+proj=merc +a=6378206 +b=6356584.314245179 +lat_ts=0.0 +lon_0=0.0 +x_0=0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +wktext  +no_defs', {
     
        resolutions: function () {
     
            var 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])
     
    });
     
    var normalMapUrl = 'http://online{s}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=pl&scaler=1&p=1',
     
        satelliteMapUrl = 'http://shangetu{s}.map.bdimg.com/it/u=x={.........完整代码请登录后点击上方下载按钮下载查看

网友评论0