OpenLayers3加载高德地图

AMapSource.js

ol.source.AMap = function(options){
    var options = options ? options : {};

    var attributions;
    if(options.attributions !== undefined){
        attributions = option.attributions;
    }else{
        attributions = [ol.source.AMap.ATTRIBUTION];
    }

    var url;
    if(options.mapType == "sat"){
        url ="http://webst0{1-4}.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}";
    }else{
        url = "http://webrd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}";
    }

    ol.source.XYZ.call(this, {
        crossOrigin: 'anonymous',   //跨域
        cacheSize: options.cacheSize,
        projection: ol.proj.get('EPSG:3857'),
        // urls:urls,
        url:url,
        wrapX: options.wrapX !== undefined ? options.wrapX : true

    });

}

ol.inherits(ol.source.AMap,ol.source.XYZ);

ol.source.AMap.ATTRIBUTION = new ol.Attribution({
    html: '&copy; <a class="ol-attribution-amap" ' +
        'href="http://ditu.amap.com/">' +
        '高德地图</a>'
});

调用:

var aMapSat = new ol.layer.Tile({
    title: "高德地图卫星",
    source: new ol.source.AMap({mapType:"sat"})
});
map.addLayer(aMapSat);

实现效果:
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值