<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<title>坐标转换</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/themes/light/main.css" />
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
</style>
</head>
<body>
<div id="viewDiv">
</div>
<div style="position: absolute;left: 30px;bottom: 30px;">
<div>
<button onclick="gcjtowgs84()">gcj转wgs84</button>
<button onclick="gcjtobd09()">gcj转bd09</button>
</div>
</div>
</body>
<script>
window.dojoConfig = {
arcgisApiUrl: window.location.host
};
</script>
<script src="src/GPS.js"></script>
<script src="https://js.arcgis.com/4.16"></script>
<script>
var that = this;
require([
"esri/Map",
"esri/views/MapView",
"esri/Graphic",
"esri/geometry/Point",
"esri/widgets/LayerList",
"esri/layers/support/TileInfo",
"esri/layers/GraphicsLayer",
"esri/layers/TileLayer",
"src/TengxunMapLayer.js",
"esri/widgets/ScaleBar",
"dojo/domReady!"
], function(
Map,
MapView,
Graphic,
Point,
LayerList,
TileInfo,
GraphicsLayer,
TileLayer,
TengxunMapLayer,
TengxunLKMapLayer,
ScaleBar
) {
var lat = 22.8;
var lon = 108.26;
var tengxunMapLayer = new TengxunMapLayer(); //wkid: 102100
let point = {
type: "point", // autocasts as new Point()
longitude: lon,
latitude: lat
};
// Create a symbol for drawing the point
let markerSymbol = {
type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
color: [226, 119, 40]
};
// Create a graphic and add the geometry and symbol to it
let pointGraphic = new Graphic({
geometry: point,
symbol: markerSymbol
});
var graphicsLayer = new GraphicsLayer({
graphics: pointGraphic
})
var map = new Map({
layers: [tengxunMapLayer, graphicsLayer]
});
view = new MapView({
container: "viewDiv",
map: map,
center: [lon, lat],
zoom: 16
});
gcjtowgs84 = function(){
var WGS = GPS.gcj_decrypt_exact(lat,lon);
let point = {
type: "point", // autocasts as new Point()
longitude: WGS.lon,
latitude: WGS.lat
};
// Create a symbol for drawing the point
let markerSymbol = {
type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
color: [100, 22, 40]
};
// Create a graphic and add the geometry and symbol to it
let pointGraphic = new Graphic({
geometry: point,
symbol: markerSymbol
});
graphicsLayer.add(pointGraphic)
};
gcjtobd09 = function(){
var WGS = GPS.bd_encrypt(lat,lon);
let point = {
type: "point", // autocasts as new Point()
longitude: WGS.lon,
latitude: WGS.lat
};
// Create a symbol for drawing the point
let markerSymbol = {
type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
color: [100, 22, 40]
};
// Create a graphic and add the geometry and symbol to it
let pointGraphic = new Graphic({
geometry: point,
symbol: markerSymbol
});
graphicsLayer.add(pointGraphic)
}
});
</script>
</html>
- 1
- 2
前往页