[ASP.net WebForm/Google] Google Map标记点(Marker)更改图示icon、加入对话框／API 3版

延续上一篇文章：[ASP.net WebForm/Google] 在Google Map上放置多个标记地点(Marker)／API 3版

这次要想办法把Marker更改icon

(顺道一提，我一直以为使用Google Map API的话，网站一定要对外开放，目前发现只要本机电脑网络有通

有引用 就可以玩了)

另外，为了配合项目需求，程序有稍做重构且追加DB数据

Create database GoogleMapDB
Go
Use GoogleMapDB
Go
/*在C#的纬度经度类型为double，在SQL Server的类型为float
  参考：http://*.com/questions/1440620/which-sql-server-data-type-best-represents-a-double-in-c
*/
Create table tb_company
(
 id int identity primary key,/*主键*/
 zip_no int,/*邮递区号*/
 company_title nvarchar(50),/*公司名称*/
 [address] nvarchar(500),   /*公司地址*/
 lat float default(0) ,     /*公司所在纬度*/
 lng float default(0) ,     /*公司所在经度*/
 company_desc nvarchar(50),/*公司简介*/
 iconName varchar(50) /*标记点的icon文件名*/
)
Go
Insert into tb_company (zip_no,company_title,[address],company_desc,iconName) values
(100,'精诚资讯','中国台北市中正区罗斯福路2段100号','在恒逸资讯上过课的日子受您照顾了<(_ _)>','flower.jpg'),
(100,'中国*师范大学','中国台北市和平东路一段162号','在捷运古亭站附近的大学','bar.jpg'),
(100,'捷运古亭站','中国台北市中正区罗斯福路2段164-1号','南京松山线啥时会开？','airplane.jpg')

 
 

新增一个DBUtil.cs类，做为数据存取层

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Configuration;
using System.Data;
using System.Data.SqlClient;

/// 

/// DBUtil 的摘要描述
/// 
public class DBUtil
{

    //连线字符串
    string connStr = WebConfigurationManager.ConnectionStrings["connStr"].ConnectionString;

    /// 

    /// 传入SQL语句，回传DataTable对象
    /// 
    /// 
    /// 
    public DataTable queryDataTable(string sql)
    {
       
        DataSet ds = new DataSet();
        using (SqlConnection conn=new SqlConnection(this.connStr))
        {
            SqlDataAdapter da = new SqlDataAdapter(sql,conn);
            da.Fill(ds);
        }
        return ds.Tables.Count > 0 ? ds.Tables[0] : new DataTable();
    }


    
}

用来输出JSON字符串的getSpot.ashx

<%@ WebHandler Language="C#"  %>

using System;
using System.Web;
/*要引用以下的命名空间*/
using System.Data;
using System.Data.SqlClient;
using System.Net;
using System.IO;
/*Json.NET相关的命名空间*/
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;

public class getSpot : IHttpHandler {

    int zip_no = 100;//中正区的邮递区号
    DBUtil db = new DBUtil();
    
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        if (!string.IsNullOrEmpty(context.Request["zip_no"]))
        {
            int.TryParse(context.Request["zip_no"], out this.zip_no);//防SQL Injection，转类型失败就用默认值
        }

         
        //取得DataTable原始数据
        DataTable dt = db.queryDataTable(@"SELECT zip_no,company_title,address,company_desc,iconName,lat,lng
                                            from tb_company
                                            Where zip_no="+this.zip_no+@"
                                            Order by ID ASC");
        //因为本范例的数据都没有纬度和经度，所以把原始数据DataTable传入取得一个新的DataTable(有纬度、经度的)
        DataTable dt_new  = this.fillLatLng(dt);
        //利用Json.NET将DataTable转成JSON字符串，请参考另一篇文章：http://www.dotblogs.com.tw/shadow/archive/2011/11/30/60083.aspx
        string str_json = JsonConvert.SerializeObject(dt_new, Formatting.Indented);
        context.Response.Write(str_json);
    }
 
    /// 

    /// 回传有纬度和经度的DataTable
    /// 
    /// 
     private DataTable fillLatLng(DataTable dt)
    {

        DataTable dt_new = dt.Copy();
        for (int i=0;i
    /// 传入JSON字符串，取得经纬度
    /// ;i++)>