App的地图h5页面增加了地图模块的配置文件，在这里对该配置文件做出配置说明：
1.配置文件位置
首先，配置文件位于以下目录，如不需要配置则和之前无变化，如需使用固定地图则需要进行配置
fiberOpticResourcesH5/config/mapConfig.js2.配置文件内容
window.DefaultMapJson
window.DefaultMapJson
该项为一个json结构，表示进入地图时的默认地图，示例如下。配置了改选项，进入地图时将默认使用该地图。
window.DefaultMapJson = {
"type": "map",
"mapType": "XYZ",
"label": "高德矢量地图",
"name": "高德矢量地图",
"mapIndex": 1001,
"img": "/img/map/gaodedianzi.jpg",
"data": {
"layerArr": [
{
"url": "http://wprd0{1-4}.is.autonavi.com/appmaptile?style=7&x={x}&y={y}&z={z}&lang=zh_cn",
"layerName": ""
}
],
"maxZoom": 19,
"projection": "gcj02",
"configOptions": {
"tileSizes": [
256,
256
]
}
}
}window.TransformationShouXin
该配置项为地址转换接口地址，用于需要经纬度转换的项目下使用，示例如下：
window.TransformationShouXin = 'http://x:x.x:8100/gis/service/coord/transformation?ak=xxxxx'window.CustomizeMapJson
该配置项为可切换的地图配置，配置了该项右侧的图层将使用该项数据，也就是说之前的四种图层变成将变化为该配置项下的图层。该配置项为数组，里面是一个个mapJson。示例如下：
window.CustomizeMapJson = [
{
"type": "map",
"mapType": "XYZ",
"label": "高德矢量地图",
"name": "高德矢量地图",
"mapIndex": 1001,
"img": "/img/map/gaodedianzi.jpg",
"data": {
"layerArr": [
{
"url": "http://wprd0{1-4}.is.autonavi.com/appmaptile?style=7&x={x}&y={y}&z={z}&lang=zh_cn",
"layerName": ""
}
],
"maxZoom": 19,
"projection": "gcj02",
"configOptions": {
"tileSizes": [
256,
256
]
}
}
},
{
"type": "map",
"mapType": "XYZ",
"label": "高德卫星地图",
"name": "高德卫星地图",
"mapIndex": 1002,
"img": "/img/map/gaodeweixing.jpg",
"data": {
"layerArr": [
{
"url": "http://wprd0{1-4}.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}&lang=zh_cn",
"layerArr": ""
}
],
"maxZoom": 17,
"projection": "gcj02",
"configOptions": {
"tileSizes": [
256,
256
]
}
}
},
{
"type": "map",
"mapType": "WMTS",
"label": "天地图矢量地图",
"name": "天地图矢量地图",
"mapIndex": 1003,
"img": "/img/map/tianditudianzi.jpg",
"data": {
"layerArr": [
{
"url": "https://t4.tianditu.gov.cn/vec_w/wmts?tk=xxxxxxx",
"layerName": "vec"
},
{
"url": "https://t4.tianditu.gov.cn/cva_w/wmts?tk=xxxxxxxx",
"layerName": "cva"
}
],
"maxZoom": 22,
"projection": "EPSG:900913",
"WMTSTileGridParams": {},
"keyCarryingMode": "url",
"configOptions": {
"matrixSet": "w",
"format": "tiles",
"version": "1.0.0",
"style": "default",
"requestEncoding": "KVP"
}
}
},
{
"type": "map",
"mapType": "WMTS",
"label": "天地图卫星地图",
"name": "天地图卫星地图",
"mapIndex": 1004,
"img": "/img/map/tiandituweixing.jpg",
"data": {
"layerArr": [
{
"url": "https://t4.tianditu.gov.cn/img_w/wmts?tk=xxxxxxxxxxx",
"layerName": "img"
},
{
"url": "https://t4.tianditu.gov.cn/cva_w/wmts?tk=xxxxxxxxxxx",
"layerName": "cva"
}
],
"maxZoom": 22,
"projection": "EPSG:900913",
"WMTSTileGridParams": {},
"keyCarryingMode": "url",
"configOptions": {
"matrixSet": "w",
"format": "tiles",
"version": "1.0.0",
"style": "default",
"requestEncoding": "KVP"
}
}
},
{
"type": "map",
"mapType": "WMTS",
"label": "XXXXXX服务",
"name": "XXXXXX服务",
"mapIndex": 1013,
"img": "/img/map/tianditudianzi.jpg",
"isShouXinTransformation": true,
"data": {
"secretKey": "xxxxxxxxxxxxxxxxx",
"layerArr": [{
"url": "http://192.168.100.201:8100/gis/service/map/wmts?ak=xxxxxxxxxxxx",
"layerName": "vec"
}
],
"maxZoom": 20,
"center": [806363.2356422106, 636484.780788214],
"zoom": 9,
"configOptions": {
"matrixSet": "bj2000",
"layer": "Shiliang",
"style": "",
"format": "image/png"
},
"WMTSTileGridParams": {
"extent": [716637.9919559672, 546964.4106869339, 894455.6954487278, 728066.4921236223],
"origin": [-4823200, 6183000],
"matrixIds": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19],
"tileSize": 512,
"resolutions": [
52435.4584709169,
26217.72923545845,
13108.864617729225,
6554.432308864612,
3277.216154432306,
1638.608077216153,
819.3040386080766,
409.6520193040383,
204.82600965201914,
102.41300482600957,
51.206502413004785,
25.603251206502392,
12.801625603251196,
6.400812801625598,
3.200406400812799,
1.6002032004063995,
0.8001016002031998,
0.4000508001015999,
0.20002540005079994,
0.10001270002539997
]
},
"keyCarryingMode": "url"
}
},
]3.注意事项
在每一个mapJson中，都有一个以img为key的键值对，这个配置是地图在图层弹窗时显示的相对应的图片，如果需要更换可以进行修改，如果是网络图片填写相对应的地址就行，如果需要使用本地图片，则需要将图片放到对应的文件夹下并且修改图片名称，这里可以放进以下文件夹。
fiberOpticResourcesH5/img/map同时，如果是需要进行坐标转换的地图，也需要加入一个key为isShouXinTransformation的配置，值为true，如下配置就使用到了。使用了该配置，系统就会将坐标转换。
在第七个键值对使用到了
{
"type": "map",
"mapType": "WMTS",
"label": "XXXXXX服务",
"name": "XXXXXX服务",
"mapIndex": 1013,
"img": "/img/map/tianditudianzi.jpg",
"isShouXinTransformation": true,
"data": {
"secretKey": "xxxxxxxxxxxxxxxxxxx",
"layerArr": [{
"url": "http://192.168.100.201:8100/gis/service/map/wmts?ak=xxxxxxxxxxxxxxx",
"layerName": "vec"
}
],
"maxZoom": 20,
"center": [806363.2356422106, 636484.780788214],
"zoom": 9,
"configOptions": {
"matrixSet": "bj2000",
"layer": "Shiliang",
"style": "",
"format": "image/png"
},
"WMTSTileGridParams": {
"extent": [716637.9919559672, 546964.4106869339, 894455.6954487278, 728066.4921236223],
"origin": [-4823200, 6183000],
"matrixIds": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19],
"tileSize": 512,
"resolutions": [
52435.4584709169,
26217.72923545845,
13108.864617729225,
6554.432308864612,
3277.216154432306,
1638.608077216153,
819.3040386080766,
409.6520193040383,
204.82600965201914,
102.41300482600957,
51.206502413004785,
25.603251206502392,
12.801625603251196,
6.400812801625598,
3.200406400812799,
1.6002032004063995,
0.8001016002031998,
0.4000508001015999,
0.20002540005079994,
0.10001270002539997
]
},
"keyCarryingMode": "url"
}
},
