、、、、、、、、、、、、、、、、、、页面代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>MapBar1</title>
<script src="../jquery132min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://union.mapbar.com/apis/maps/free?f=mapi&v=31.3&k=aCW9cItqL7sqT7AxaB0zdHZoZSWmbBsuT7JhMHTsMeD6ZIl9NzFsZHT=@JBL979@Iu7lJJZWWq0IDu9xZMzMxq7I9AhH7LAAA6hqzZHZZLTbZZauxlDz7C7DD9ZCFGT="></script>
<script type="text/javascript">
var maplet = null;
var centerX = "114.0122";
var centerY = "33.31334";
var a = new Array()
var ArryX = new Array();
var ArryY = new Array();
var ArryName = new Array();
var ArryDetail = new Array();
function initMap() { //装载地图
maplet = new Maplet("mapbar");
maplet.centerAndZoom(new MPoint(centerX, centerY), 10); //参数坐标和显示比例，后一个参数越大地图现实越详细
maplet.showOverview(true, true); //显示鹰眼 设为false则不显示
maplet.addControl(new MStandardControl()); //加载左边的缩放菜单 注释掉则不显示
//循环添加标注
//var ArryX = new Array("114.02755", "114.03501", "113.98134");
//var ArryY = new Array("33.29938", "33.29278", "33.32165");
//var ArryDetail = new Array("1", "2", "3");
getInformation();
//添加单击地图事件
MEvent.addListener(maplet, "click", function(evt, point) {
getXY(evt, point); //获得经纬度
});
}
//获得数据库中的数据 并创建标准
function getInformation() {
$.ajax({
type: "post",
contentType: "application/json",
url: "MapBarWebService.asmx/GetJD",
data: "{}",
dataType: "json",
success: function(result) {
var i = 0;
$(result.d).each(function() {
//alert(this.toString());
ArryX[i] = this.toString();
i++;
});
}
});
$.ajax({
type: "post",
contentType: "application/json",
url: "MapBarWebService.asmx/GetWD",
data: "{}",
dataType: "json",
success: function(result) {
var i = 0;
$(result.d).each(function() {
//alert(this.toString());
ArryY[i] = this.toString();
i++;
});
}
});
$.ajax({
type: "post",
contentType: "application/json",
url: "MapBarWebService.asmx/GetAdrName",
data: "{}",
dataType: "json",
success: function(result) {
var i = 0;
$(result.d).each(function() {
//alert(this.toString());
ArryName[i] = this.toString();
i++;
});
}
});
$.ajax({
type: "post",
contentType: "application/json",
url: "MapBarWebService.asmx/GetDetail",
data: "{}",
dataType: "json",
success: function(result) {
var i = 0;
$(result.d).each(function() {
//alert(this.toString());
ArryDetail[i] = "<span style='font-size:smaller;'>" + this.toString() + "</span>";
createLabel(i, ArryX[i], ArryY[i], ArryName[i], ArryDetail[i]); //获得最后一个坐标信息的数据时创建标注
i++;
});
}
});
}
//循环创建标注
function createLabel(i, x, y, title, detail) {
i = i + 1;
var marker = new MMarker(
new MPoint(x, y),
new MIcon("../Images/GPS_1.png", 32, 32),
new MInfoWindow(title, detail) //参数 标题和内容
);
maplet.setIwStdSize(200, 100); //设置气泡大小
maplet.addOverlay(marker); //添加标注
MEvent.addListener(marker, "click", function(marker) {
marker.openInfoWindow();
});
//添加事件 鼠标经过和离开事件
marker.eventHandler = MEvent.addListener(marker, "mouseover", function() {
//marker.openInfoWindow();
marker.icon.updateImage("../Images/GPS_1_red.png");
});
marker.eventHandler = MEvent.addListener(marker, "mouseout", function() {
marker.icon.updateImage("../Images/GPS_1.png");
});
marker.eventHandler = MEvent.addListener(marker, "click", function() {
});
//.................
}
//获得的经纬度方法
function getXY(evt, point) {
$("#X").val(""); $("#Y").val("");
if (!point) alert("获取经纬度失败，请重新操作。");
$("#X").val(point.lon); //经度
$("#Y").val(point.lat); //纬度
}
//查询
function SeachrClick() {
maplet.centerAndZoom(new MPoint(centerX, centerY), 10);
$.ajax({
type: "post",
contentType: "application/json",
url: "MapBarWebService.asmx/SearchByAdrName",
data: "{str:'" + $("#SearchName").val() + "'}",
dataType: "json",
success: function(result) {
$("#searchDiv").html("");
$(result.d).each(function() {
//alert(this.toString());
$("#searchDiv").html(this.toString() + "<br>" + $("#searchDiv").html());
});
}
});
return false;
}
//把单击的地址显示到地图中心
function adrNameClick(x, y) {
//alert(x + "," + y);
maplet.centerAndZoom(new MPoint(x, y), 10);
}
window.onload = function() {
initMap(); //页面初始化加载地图
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="mapbar" style=" 750px; height: 450px; border: 2px #CCCCFF solid;">
</div>
<br />
Name:<asp:TextBox ID="Name" runat="server" />
X:<asp:TextBox ID="X" Width="80px" runat="server"></asp:TextBox>
Y:<asp:TextBox ID="Y" Width="80px" runat="server"></asp:TextBox>
<br />
Detail:<asp:TextBox ID="Detail" runat="server"></asp:TextBox>
<br />
<asp:Button ID="btnSave" runat="server" Text="SAVE" OnClick="Save" />
<hr />
<asp:TextBox ID="SearchName" runat="server"></asp:TextBox><asp:Button ID="Search"
runat="server" Text="Search" OnClientClick="return SeachrClick();" />
<br />
<div id="searchDiv">
</div>
</div>
</form>
</body>
</html>
、、、、、、、、、、、、、、、、、、、、、、、、、后台保存
/// <summary>
/// save
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Save(object sender, EventArgs e)
{
SqlHelper sqlHelper = SQLHelperFactory.Factory("sql");
AddressXY Model = new AddressXY();
Model.AddrName = Name.Text;
Model.X = X.Text;
Model.Y = Y.Text;
Model.Detail = Detail.Text;
string InsertStr = "Insert Into AddressXY(AdrName,X,Y,Detail) values('" + Model.AddrName + "','" + Model.X + "','" + Model.Y + "','" + Model.Detail + "')";
sqlHelper.ExecuteNonQuery(InsertStr, null);
Response.Redirect("MapBar1.aspx");
}
、、、、、、、、、、、、、、、、、、、、、、web service
/// <summary>
/// 经度
/// </summary>
[WebMethod]
public List<string> GetJD()
{
string select = "select X from AddressXY";
DataTable dt = SQLHelper.ExecuteDataSet(select, null).Tables[0];
List<string> myList = new List<string>();
for (int i = 0; i < dt.Rows.Count; i++)
{
myList.Add(dt.Rows[i][0].ToString());
}
return myList;
}
/// <summary>
/// 维度
/// </summary>
[WebMethod]
public List<string> GetWD()
{
string select = "select Y from AddressXY";
DataTable dt = SQLHelper.ExecuteDataSet(select, null).Tables[0];
List<string> myList = new List<string>();
for (int i = 0; i < dt.Rows.Count; i++)
{
myList.Add(dt.Rows[i][0].ToString());
}
return myList;
}
/// <summary>
/// 标题
/// </summary>
/// <returns></returns>
[WebMethod]
public List<string> GetAdrName()
{
string select = "select AdrName from AddressXY";
DataTable dt = SQLHelper.ExecuteDataSet(select, null).Tables[0];
List<string> myList = new List<string>();
for (int i = 0; i < dt.Rows.Count; i++)
{
myList.Add(dt.Rows[i][0].ToString());
}
return myList;
}
/// <summary>
/// 描述
/// </summary>
[WebMethod]
public List<string> GetDetail()
{
string select = "select Detail from AddressXY";
DataTable dt = SQLHelper.ExecuteDataSet(select, null).Tables[0];
List<string> myList = new List<string>();
for (int i = 0; i < dt.Rows.Count; i++)
{
myList.Add(dt.Rows[i][0].ToString());
}
return myList;
}
/// <summary>
/// 查询
/// </summary>
/// <returns></returns>
[WebMethod]
public List<string> SearchByAdrName(string str)
{
string select = "select AdrName,x,y from AddressXY where AdrName like '%" + str.Trim() + "%'";
DataTable dt = SQLHelper.ExecuteDataSet(select, null).Tables[0];
List<string> myList = new List<string>();
for (int i = 0; i < dt.Rows.Count; i++)
{
myList.Add("<a href='javascript:;' onclick=\"adrNameClick('" + dt.Rows[i][1].ToString() + "','" + dt.Rows[i][2].ToString() + "')\">" + dt.Rows[i][0].ToString() + "</a>");
}
return myList;
}
////////////////////////////////////////创建表
USE [testT]
GO
/****** 对象: Table [dbo].[AddressXY] 脚本日期: 10/13/2011 18:29:07 ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
SET ANSI_PADDING ON
GO
CREATE TABLE [dbo].[AddressXY](
[ID] [bigint] IDENTITY(1,1) NOT NULL,
[AdrName] [varchar](100) COLLATE Chinese_PRC_CI_AS NULL,
[X] [varchar](50) COLLATE Chinese_PRC_CI_AS NULL,
[Y] [varchar](50) COLLATE Chinese_PRC_CI_AS NULL,
[Detail] [varchar](1000) COLLATE Chinese_PRC_CI_AS NULL,
CONSTRAINT [PK_AddressXY] PRIMARY KEY CLUSTERED
(
[ID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
SET ANSI_PADDING OFF