<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>SuperMap iClient for JavaScript:TiledDynamicRESTLayer</title>
<script src="libs/SuperMap.Include.js"></script>
<script type="text/javascript">
var map, layer, lineLayer, drawLine;
var url = "http://localhost:8090/iserver/services/map-World/rest/maps/World_Image";
var style = {
strokeColor:"#red",
strokeWidth:2,
pointerEvents:"visiblePainted",
fillColor:"red",
fillOpacity:0.8
}
function onPageLond() {
/*--------------------------------------------矢量图层-------------------------------------------*/
lineLayer = new SuperMap.Layer.Vector("lineLayer");
//创建绘制线段的控件
drawLine = new SuperMap.Control.DrawFeature(lineLayer, SuperMap.Handler.Path,{multi:true});
//设置绘制线段控件的监听事件
drawLine.events.on( {"featureadded":drawCompleted} );
/*--------------------------------------------地图图层-------------------------------------------*/
map = new SuperMap.Map('map',{controls:[
new SuperMap.Control.PanZoomBar(),
new SuperMap.Control.ScaleLine(),
new SuperMap.Control.LayerSwitcher(),
drawLine
]}
);
layer = new SuperMap.Layer.TiledDynamicRESTLayer(
"World_Image",
url,
{transparent:true, cacheEnabled:true},
{maxResolution:"auto", scales:[1/150000000]}
);
layer.events.on({"layerInitialized": addLayer});
}
function addLayer() {
var objs = [layer,lineLayer];
map.addLayers(objs);
map.setCenter(new SuperMap.LonLat(0, 0), 0);
}
function drawCompleted(arguments) {
drawLine.deactivate();
//获取绘制的线段
var geometry = arguments.feature.geometry;
var parameters = new SuperMap.REST.MeasureParameters(geometry);
//交互
var measureService = new SuperMap.REST.measureService(
url,
{
measureMode: SuperMap.REST.MeasureMode.DISTANCE,
eventListeners:{
"processCompleted":measureCompleted,
"processFailed":measureFailed
}
}
);
measureService.processAsync(measureParam);
}
function measureCompleted(arguments) {
if(arguments.result.distance != -1) {
alert(arguments.result.distance);
} else {
alert("没距离");
}
}
function measureFailed(arguments) {
alert(arguments.error);
}
function distanceMeasure() {
lineLayer.removeAllFeatures();
drawLine.activate();
}
</script>
</head>
<body onload="onPageLond()">
<div id="map" style="position:relative; left:0px; right:0px; width:1000px;height:500px;" >
</div>
<form id="f1">
<input id="t1" type="button" value="绘制测量" onclick="distanceMeasure()" />
</form>
</body>
</html>
