maptalks

一、加载不同地图的方式

1.谷歌地图：

var googleYxlayer =new maptalks.TileLayer("谷歌影像图", {

urlTemplate:"http://mt1.google.cn/vt/lyrs=s@192&hl=zh-CN&x={x}&y={y}&z={z}",

    crossOrigin:"Anonymous",

    subdomains: [0, 1, 2, 3],

    visible:false

});

var googleDxlayer =new maptalks.TileLayer("谷歌地形图", {

urlTemplate:"https://www.google.cn/maps/vt?lyrs=p&gl=cn&x={x}&y={y}&z={z}",

    crossOrigin:"Anonymous",

    subdomains: [0, 1, 2, 3],

    visible:false

});

// scale=2 是高分辨率

var googleMap = new maptalks.TileLayer("googleMap",{

'urlTemplate' : 'http://www.google.cn/maps/vt?lyrs=m@189&gl=cn&x={x}&y={y}&z={z}&scale=2',

crossOrigin: "Anonymous",

subdomains: [0, 1, 2, 3],

visible: false

});

map = new maptalks.Map('map', {

center: [lon, lat],

zoom: 12,

minZoom: initzoom*1,

maxZoom: maxzoom*1,

attribution: {

content: ""

},

baseLayer: new maptalks.GroupTileLayer(

"maps", [googleYxlayer, googleMap], {}

)

});

$('.maptalks-attribution').css('display', 'none');

2.智图

var arcUrl ='http://map.geoq.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer';

maptalks.SpatialReference.loadArcgis(arcUrl +'?f=pjson', function (err, conf) {

if (err) {

throw new Error(err);

    }

var ref = conf.spatialReference;

    ref.projection ='EPSG:3857';

    var map =new maptalks.Map('map', {

center: [104.57342169515482,  39.611912376506524],

        zoom:5,

        minZoom:4,

        maxZoom:18,

        spatialReference: ref,

        baseLayer:new maptalks.TileLayer('base', {

'tileSystem': conf.tileSystem,

            'tileSize': conf.tileSize, // [512, 512]

            'urlTemplate': arcUrl +'/tile/{z}/{y}/{x}',

            'attribution':'&copy; <a target="_blank" href="' + arcUrl +'"">ArcGIS'

        })

});

})

3.天地图

var tianditu_base = new maptalks.TileLayer('tianditu_base', {

urlTemplate: "https://t0.tianditu.com/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=", 

crossOrigin: "Anonymous",

subdomains: [0, 1, 2, 3],

visible: false

});

var tianditu_font = new maptalks.TileLayer('tianditu_font', {

urlTemplate: 'https://t0.tianditu.com/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=',

crossOrigin: "Anonymous",

subdomains: [0, 1, 2, 3],

visible: true

});

var tianYxlayer=new maptalks.WMSTileLayer("tianYxlayer", {

urlTemplate:"https://t1.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=",

    crossOrigin:"Anonymous",

    subdomains: [0, 1, 2, 3],

    visible:false

});

4.百度

var map = new maptalks.Map('mapDiv', {

            center: [120, 30],

            zoom: 7,

            pitch: 0,

            bearing: 0,

            maxPitch: 30,

            maxVisualPitch: 45,

            spatialReference: {

                projection: 'baidu'

            },

            baseLayer: new maptalks.TileLayer('base', {

                // 百度自定义地图（深蓝）

                // urlTemplate: 'http://api{s}.map.bdimg.com/customimage/tile?&x={x}&y={y}&z={z}&scale=1&udt=20181205&styles=yipxfCwhMDozKT3GDCM7UGARmSKbAMXh&styles=t%3Amanmade%7Ce%3Al.i%7Cv%3Aoff%2Ct%3Aroad%7Ce%3Al.i%7Cv%3Aoff%2Ct%3Apoi%7Ce%3Al.i%7Cv%3Aoff%2Ct%3Aadministrative%7Ce%3Al.i%7Cv%3Aoff%2Ct%3Aland%7Ce%3Ag.f%7Cc%3A%23063d6fff%2Ct%3Awater%7Ce%3Ag.f%7Cc%3A%230c2335ff%2Ct%3Agreen%7Ce%3Ag.f%7Cc%3A%23182322ff%2Ct%3Amanmade%7Ce%3Ag.f%7Cc%3A%23145387ff%2Ct%3Acontinent%7Ce%3Al.t.f%7Cc%3A%230f3451ff%2Ct%3Acontinent%7Ce%3Al.t.s%7Cc%3A%23072b47ff%2Ct%3Acountry%7Ce%3Al.t.s%7Cc%3A%230f3451ff%2Ct%3Acountry%7Ce%3Al.t.f%7Cc%3A%231c7dc8ff%2Ct%3Acity%7Ce%3Al.t.f%7Cc%3A%231c7dc8ff%2Ct%3Acity%7Ce%3Al.t.s%7Cc%3A%230f3451ff%2Ct%3Adistrict%7Ce%3Al.t.f%7Cc%3A%231c7dc8ff%2Ct%3Adistrict%7Ce%3Al.t.s%7Cc%3A%230f3451ff%2Ct%3Atown%7Ce%3Al.t.s%7Cc%3A%230f3451ff%2Ct%3Atown%7Ce%3Al.t.f%7Cc%3A%231c7dc8ff%2Ct%3Aboundary%7Ce%3Ag.f%7Cc%3A%230f3451ff%2Ct%3Aboundary%7Ce%3Ag.s%7Cc%3A%230c2d47ff%2Ct%3Ahighway%7Ce%3Ag.f%7Cc%3A%230f4d7eff%2Ct%3Ahighway%7Ce%3Ag.s%7Cc%3A%23043153ff%2Ct%3Arailway%7Ce%3Aall%7Cv%3Aoff%2Ct%3Aarterial%7Ce%3Ag.f%7Cc%3A%231a649dff%2Ct%3Aarterial%7Ce%3Ag.s%7Cc%3A%23043153ff%2Ct%3Aroad%7Ce%3Al.t.f%7Cc%3A%231a649dff%2Ct%3Aroad%7Ce%3Al.t.s%7Cc%3A%23043153ff%2Ct%3Apoi%7Ce%3Al.t.f%7Cc%3A%232475b3ff%2Ct%3Apoi%7Ce%3Al.t.s%7Cc%3A%23043153ff%2Ct%3Asubway%7Ce%3Aall%7Cv%3Aoff%2Ct%3Aall%7Ce%3Al.t.f%7Cc%3A%234d9de4ff%2Ct%3Aall%7Ce%3Al.t.s%7Cc%3A%23022743ff%2Ct%3Alocal%7Ce%3Ag.f%7Cc%3A%232475b3ff%2Ct%3Alocal%7Ce%3Ag.s%7Cc%3A%23084d81ff%2Ct%3Abuilding%7Ce%3Ag.f%7Cc%3A%230b3c61ff',

                // 百度预定义地图

                //urlTemplate: 'http://api{s}.map.bdimg.com/customimage/tile?&x={x}&y={y}&z={z}&scale=1&udt=20181205&customid=midnight',

                // 百度常规地图

                urlTemplate: 'http://online{s}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=pl&scaler=1&p=1',

                // 百度影像图

                // urlTemplate: 'http://shangetu{s}.map.bdimg.com/it/u=x={x};y={y};z={z};v=009;type=sate&fm=46',

                subdomains: ['0', '1', '2']

            }),

            layers: [

                new maptalks.VectorLayer('v')

            ]

        });