基于ASP.NET技术将数据库中坐标点数据呈现到GOOGLE地图上 (google map开发高级篇)-CSDN博客

本文主要记录了将数据库中坐标点数据呈现到GOOGLE地图上的相关代码，本文主要用到的技术有asp.net、jquery、google map api等。废话不多说代码如下：

1、页面代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GoogleMap.aspx.cs" Inherits="LdConsole.Web.GoogleMap" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

type="text/javascript"></script>

var CollectorName = "";

function adjustLight() {

var text = document.getElementById('test').value;

$("#message").html("调整亮度成功！"+text);

}

function initialize() {

//创建地图对象

if (GBrowserIsCompatible()) {

var map = new GMap2(document.getElementById("map_canvas"));

map.setCenter(new GLatLng(39.917, 116.397), 14);

//jquery读取数据库灯杆信息，并创建地图标记

function createMarker(latlng, number) {

var marker = new GMarker(latlng);

marker.value = number;

GEvent.addListener(marker, "click", function () {

//在标签里面生成测量点信息（灯泡）

var myHtml = "亮度值：<input id=\"test\"> <input type=\"button\" onClick=\"adjustLight()\" value=\"调整亮度\">";

map.openInfoWindowHtml(latlng, myHtml);

});

return marker;

}

//生成灯杆地图标记

var queryString = "1=1";

var tmp = "";

$.ajax({

type: "get",

dataType: "json",

url: 'ServerAjax.ashx?method=GetMapFOI&queryString=' + queryString,

data: "tmp=" + tmp,

complete: function () { $("#load").hide(); }, //

success: function (msg) {//

var data = msg.table;

$.each(data, function (i, n) {

var latlng = new GLatLng(n.Longitude, n.Latitude);

map.addOverlay(createMarker(latlng, i + 1));

});

}

});

}

</script>

</head>

</div>

</div>

</body>

</html>

2、后台代码：

新建ServerAjax.ashx文件，代码如下：

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Data;

using System.Text;

using System.Data.SqlClient;

using System.Configuration;

using System.Web.UI;

namespace LdConsole.Web

{

/// <summary>

/// ServerAjax 的摘要说明

/// </summary>

public class ServerAjax : IHttpHandler

{

public void ProcessRequest(HttpContext context)

{

string method = System.Web.HttpContext.Current.Request.QueryString["method"].Trim();

string queryString = System.Web.HttpContext.Current.Request.QueryString["queryString"].Trim();

switch (method)

{

case "GetMapFOI"://生成地图标记

context.Response.Write(GetMapFOI(queryString));

break;

}

//根据灯杆库里的数据生成地图上灯杆标记 QueryString为查询筛选条件

private String GetMapFOI(string queryString)

{

string sql;

sql = "select * from tbCollector where " + queryString;

string dbfile = ConfigurationManager.ConnectionStrings["KwstuConn"].ToString();

SqlConnection conn = new SqlConnection(dbfile);

SqlDataAdapter da = new SqlDataAdapter(sql, conn);

DataTable dt = new DataTable("table");

da.Fill(dt);

return DataTable2Json(dt);

}

//生成Json数据格式方法

private string DataTable2Json(DataTable dt)

{

StringBuilder jsonBuilder = new StringBuilder();

jsonBuilder.Append("{\"");

jsonBuilder.Append(dt.TableName);

jsonBuilder.Append("\":[");

for (int i = 0; i < dt.Rows.Count; i++)

{

jsonBuilder.Append("{");

for (int j = 0; j < dt.Columns.Count; j++)

{

jsonBuilder.Append("\"");

jsonBuilder.Append(dt.Columns[j].ColumnName);

jsonBuilder.Append("\":\"");

jsonBuilder.Append(this.JsonStringFormat(dt.Rows[i][j].ToString()));

jsonBuilder.Append("\",");

}

jsonBuilder.Remove(jsonBuilder.Length - 1, 1);

jsonBuilder.Append("},");

}

jsonBuilder.Remove(jsonBuilder.Length - 1, 1);

jsonBuilder.Append("]");

jsonBuilder.Append("}");

return jsonBuilder.ToString();

}

//Json数据源字符串格式化方法防止返回的Json数据中有非法字符造成程序出错

public string JsonStringFormat(string JsonString)

{

return JsonString.Trim().Replace("\"", "\\\"").Replace("\\", "/").Replace("\r\n", "").Replace("\r", "").Replace("\r\r", "").Replace("\n", "").Replace("\n\r", "");

}

public bool IsReusable

{

get

{

return false;

}