MapXtreme 2005自定义图层控制代码(WEB)

虽然MapXtreme 2005 6.7.1提供了图层控制的控件,但很多时候需要自己定义,所以就写了个DEMO,起个抛砖引玉的作用.
整体思路是:
1.从服务端获取待控制的图层信息(名称,是否可视,标注是否可视信息),JSON格式
2.客户端用户选择后,发送到服务端 JSON格式
3.服务端执行控制后,把得到到图象返回给客户端
客户端页面包含:
复制内容到剪贴板
代码:

<div style="width: 235px; height: 26px">
图层设置<img src="images/down.gif" alt="图层设置" id="layerimg" οnclick="return layerimg_onclick()" />
</div>
<div id="layerTag" style="display:none">
<table style="width: 292px">
<tr>
<td style="width: 57px; font: caption; color: blue;">
图层名称</td>
<td style="width: 63px; font: caption; color: blue;">
显示与否</td>
<td style="width: 57px; font: caption; color: blue;">
标注与否</td>
</tr>
<tr id="QQ">
<td style="width: 57px; font: menu; color: purple; height: 22px;">
QQ图层</td>
<td style="width: 63px; height: 22px;">
<input id="QQCheckbox1" style="width: 21px" type="checkbox" /></td>
<td style="width: 57px; height: 22px;">
<input id="QQCheckbox2" type="checkbox" /></td>
<td style="width: 36px; height: 22px;">
<input id="Button1" style="width: 38px" type="button" value="应用" οnclick="return Layercontrol()" />
</td>
</tr>
<tr id="CONTACT">
<td style="width: 57px; font: menu; color: purple;">
联系图层</td>
<td style="width: 63px;">
<input style="width: 21px" id="LLCheckbox1" type="checkbox"/></td>
<td style="width: 57px">
<input id="LLCheckbox2" style="width: 21px" type="checkbox" /></td>
<td style="width: 36px; height: 22px;">
<input id="Button2" style="width: 38px" type="button" value="应用" οnclick="return Layercontrol()"/></td>
</tr>
</table>
</div>
简要控制脚本:
复制内容到剪贴板
代码:

function layerimg_onclick() {
if ($("#layerTag").css("display")=="none"){
$("#layerimg").attr("src","images/up.gif");
$("#layerTag").css("display","block");
getlayercontrol();
}
else{
$("#layerimg").attr("src","images/down.gif");
$("#layerTag").css("display","none");
}
}
首先先做获取服务端待控制的图层信息:
客户端脚本如下:
复制内容到剪贴板
代码:
//获取图层控制信息
function getlayercontrol(){
$.ajax({
type:"post",
url:"GetCustomLayer.ashx",
data:"",
success:function(data){
var json=eval("("+data+")");
for(var i=0;i<json.items.length;i++){
if(i==0) {
form1.QQCheckbox1.checked=json.items.visible;
form1.QQCheckbox2.checked=json.items.labelvisible;
}
else{
form1.LLCheckbox1.checked=json.items.visible;
form1.LLCheckbox2.checked=json.items.labelvisible;
}
}
}
});
}
服务端执行页面是:GetCustomLayer.ashx见附件,为了使用JSON,ASP.NET AJAX的机制使用序列化和反序列化,为此先构造图层类见附件,控制当用户选择不显示/显示某个图层时的交互情况,脚本参考如下:
复制内容到剪贴板
代码:
function Layercontrol() {
//按照顺序定义button,取序号
var src=event.srcElement.id;
var index=src.substring(7,src.length-1);
//根据button序号获取td信息
var name=$("#layerTag tr:eq("+index+")").attr("id");
var visible=$("#layerTag tr:eq("+index+") td").eq(1).find(":checkbox").attr("checked");
var labelvisible=$("#layerTag tr:eq("+index+") td").eq(2).find(":checkbox").attr("checked");

//由于JSON.JS和JQERUY有些冲突,手工设置为JSON格式
var jsonstr="{\"name\":\""+name+"\",\"visible\":"+visible+",\"lablelvisible\":"+labelvisible+"}";
url = "MapController.ashx?Command=MyLayerControl&Ran=" + Math.random();
var mapImage = document.getElementById("MapControl1_Image");
if (mapImage.mapAlias)
url += "&MapAlias=" + mapImage.mapAlias;
url += "&Width=" + mapImage.width ;
url += "&Height=" + mapImage.height;
url += "&ExportFormat=" + mapImage.exportFormat ;
$.ajax({
type:"post",
url:url,
data:jsonstr,
success:function(){
mapImage.src=url;
}
});
}
服务端代码:
复制内容到剪贴板
代码:

''' <summary>
''' 自定义图层控制
''' </summary>
''' <remarks></remarks>
<Serializable()> _
Public Class MyLayerControl
Inherits MapBaseCommand
Public Sub New()
Name = "MyLayerControl"
End Sub
'Public Overrides Sub Execute()
' Dim sm As StateManager = StateManager.GetStateManagerFromSession()
' ParseContext()
' If Not (sm Is Nothing) Then
' PrepareStateManagerParamsDictionary(sm)
' sm.RestoreState()
' End If
' Process()
'End Sub
Public Overrides Sub Process()
Dim insm As Stream = HttpContext.Current.Request.InputStream '获取传入Http内容
Dim br As BinaryReader = New BinaryReader(insm, System.Text.Encoding.UTF8) '转换流
Dim by() As Byte = br.ReadBytes(insm.Length)
Dim jsonstr As String = System.Text.Encoding.UTF8.GetString(by) '转换为string类型
Dim model As MapControlModel = MapControlModel.GetModelFromSession()
Dim mainmap As Map = model.GetMapObj(MapAlias)
Dim j As Script.Serialization.JavaScriptSerializer =
New Script.Serialization.JavaScriptSerializer()
Try
Dim lcs As mylayer = j.Deserialize(Of mylayer)(jsonstr)
If lcs.visible Then '要求可视
If Not mainmap.Layers(lcs.name).IsVisible Then '原来不可视
mainmap.Layers(lcs.name).Enabled = True '设置为可视
End If
Else '要求不可视
If mainmap.Layers(lcs.name).IsVisible Then '原来可视
mainmap.Layers(lcs.name).Enabled = False '设置为不可视
End If
End If
Catch ex As Exception
Finally
Dim ms As MemoryStream = model.GetMap(MapAlias, MapWidth, MapHeight, ExportFormat)
StreamImageToClient(ms)
End Try
End Sub
End Class