<!--********************************************************************
* Copyright© 2000 - 2018 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title data-i18n="resources.title_tiledMapLayer4326"></title>
<script type="text/javascript" src="../js/include-web.js"></script>
<script type="text/javascript" include='proj4' src="../../dist/openlayers/include-openlayers.js"></script>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%">
<div id="map" style="width: 100%;height:100%"></div>
<script type="text/javascript">
var map, url ="http://localhost:8090/iserver/services/map-ugcv5-3395map/rest/maps/3395map";
//定义3395坐标系
proj4.defs("EPSG:3395","+proj=merc +lon_0=0 +k=1 +x_0=0 +y_0=0 +datum=WGS84 +units=m +no_defs");
// 计算resolutions
getResolutions = function (zoom, scale, targetMinZoom, targetMaxZoom) {
var res = scaleToResolution(scale);
var minRes = res * Math.pow(2, zoom - targetMinZoom);
var resolutions = [];
for (var index = 0; index < targetMaxZoom - targetMinZoom + 1; index++) {
resolutions.push(minRes / Math.pow(2, index));
}
return resolutions;
}
scaleToResolution = function (scale) {
var inchPerMeter = 1 / 0.0254;
return 1 / (scale * 96 * inchPerMeter);
};
//第0级比例尺是0.000000015625
var resolutions = getResolutions(0,0.000000015625,0,6);
var projection =ol.proj.get('EPSG:3395');
//新的投影必设地图范围
projection.setExtent([8374565.292377971,1866182.1613285837,1.4947981223720774E7,7070412.849097984]);
//对接3395地图
map = new ol.Map({
target: 'map',
controls: ol.control.defaults({attributionOptions: {collapsed: false}})
.extend([new ol.supermap.control.Logo()]),
view: new ol.View({
center: [11661273.258049373,4468297.505213284],
zoom: 0,
projection: projection,
resolutions: resolutions
})
});
var layer = new ol.layer.Tile({
source: new ol.source.TileSuperMapRest({
url: url,
tileGrid: new ol.tilegrid.TileGrid({//手动构建自定义目标的TileGrid
extent: [8374565.292377971,1866182.1613285837,1.4947981223720774E7,7070412.849097984],
resolutions: resolutions
}),
wrapX: true,
}),
projection:projection
});
map.addLayer(layer);
//将经纬度4326的坐标系转换成3395
var pointCoord=ol.proj.transform([112.33,16.830000011511796],'EPSG:4326','EPSG:3395');
console.log(pointCoord);//转换后的结果[12504518.40080842, 1888680.285285576]
//用转换后的坐标构造矢量要素
var pointFeature = {
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [pointCoord[0],pointCoord[1]]
},
"properties": {
"name": "Dinagat Islands"
}
}
//创建矢量图层，并将要素添加到矢量图层上
var vectorSource = new ol.source.Vector({
features: (new ol.format.GeoJSON()).readFeatures(pointFeature),
wrapX: false
});
resultLayer = new ol.layer.Vector({
source: vectorSource
});
map.addLayer(resultLayer);
</script>
</body>
</html>
proj4_iClientforOpenlayerDemo
需积分: 46 171 浏览量
2019-04-02
11:16:58
上传
评论 1
收藏 2.48MB ZIP 举报
proj4_iClientforOpenlayerDemo.zip （20个子文件） 
proj4_iClientforOpenlayerDemo dist openlayers 
iclient9-openlayers.css 332KB iclient9-openlayers.min.js 1.66MB iclient9-openlayers-es6.min.js 806KB include-openlayers.js 4KB iclient9-openlayers.js 4.45MB iclient9-openlayers.min.css 328KB iclient9-openlayers-es6.js 3.03MB examples openlayers 
proj4_openlayer.html 4KB js utils.js 3KB localization.js 5KB include-web.js 9KB tokengenerator.js 112B web libs openlayers 4.6.5 ol-debug.css 5KB ol.css 4KB ol.js 531KB ol-debug.js 2.64MB i18next i18next.min.js 34KB jquery jquery.min.js 85KB proj4 2.4.4 proj4.js 74KB jquery-i18next jquery-i18next.min.js 2KB资源评论
