首页 > > 网页制作 > css >

做测试做了一个百度地图api的例子保存读取坐标

2018-06-23 22:18:27来源：未知阅读 ()

首先是页面

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="NewMap.aspx.cs" Inherits="NewMap" %>

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="keywords" content="百度地图,百度地图API，百度地图自定义工具，百度地图所见即所得工具" />
<meta name="description" content="百度地图API自定义地图，帮助用户在可视化操作下生成百度地图" />
<title>百度地图读取存储坐标</title>

<style type="text/css">
    html,body{margin:0;padding:0;}
    .iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
    .iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true"></script>
</head>

<body>

<form id="form1" runat="server">
<div style="width:697px;height:550px;border:#ccc solid 1px;" id="dituContent"></div>
<table>
<tr>
<td>
      纬度：
      <asp:TextBox ID="x" runat="server" ReadOnly="True"></asp:TextBox>
      </td>
<td>
      经度：<asp:TextBox ID="y" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td colspan="2">
      名字：
      <asp:TextBox ID="name" runat="server"></asp:TextBox></td>
</tr>

<tr>
<td colspan="2">
      地址：
      <asp:TextBox ID="address" runat="server" Width="300px"></asp:TextBox>
      </td>
</tr>
<tr>
<td colspan="2">
      说明：<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"></asp:TextBox></td>
</tr>
<tr>
<td colspan="2">
     颜色：<asp:DropDownList ID="DropDownList1" runat="server">
          <asp:ListItem Value="46">红色</asp:ListItem>
          <asp:ListItem Value="0">绿色</asp:ListItem>
      </asp:DropDownList>
</td>
</tr>
<tr>
<td colspan="2">
      <asp:Button ID="Button1" runat="server" Text="保存" onclick="Button1_Click" /></td>
</tr>
</table>
</form>
</body>
<script type="text/javascript">
    //创建和初始化地图函数：
    function initMap() {
        createMap(); //创建地图
        setMapEvent(); //设置地图事件
        addMapControl(); //向地图添加控件
        addMarker(); //向地图中添加marker

        var gc = new BMap.Geocoder();
        map.addEventListener("click", function(e) {
            var pt = e.point;

            gc.getLocation(pt, function(rs) {
                var addComp = rs.addressComponents;

                document.getElementById("x" ).innerText=e.point.lng ;
                document.getElementById("y" ).innerText=e.point.lat ;

                document.getElementById("address" ).innerText=addComp.province+ addComp.city+addComp.district+addComp.street+addComp.streetNumber;

                //map.addOverlay(new BMap.Marker(pt));
            });
        });

    }

    //创建地图函数：
    function createMap() {
        var map = new BMap.Map("dituContent"); //在百度地图容器中创建一个地图
        var point = new BMap.Point(114.522657, 38.049981); //定义一个中心点坐标
        map.centerAndZoom(point, 13); //设定地图的中心点和坐标并将地图显示在地图容器中
        window.map = map; //将map变量存储在全局


//        var pt = new BMap.Point(116.417, 39.909);
//        var myIcon = new BMap.Icon("img/iconpng.png", new BMap.Size(43,0));
//        var marker2 = new BMap.Marker(pt,{icon:myIcon}); // 创建标注
//        map.addOverlay(marker2);
    }

    //地图事件设置函数：
    function setMapEvent() {
        map.enableDragging(); //启用地图拖拽事件，默认启用(可不写)
        map.enableScrollWheelZoom(); //启用地图滚轮放大缩小
        map.enableDoubleClickZoom(); //启用鼠标双击放大，默认启用(可不写)
        map.enableKeyboard(); //启用键盘上下左右键移动地图
    }

    //地图控件添加函数：
    function addMapControl() {
        //向地图中添加缩放控件
        var ctrl_nav = new BMap.NavigationControl({ anchor: BMAP_ANCHOR_TOP_LEFT, type: BMAP_NAVIGATION_CONTROL_LARGE });
        map.addControl(ctrl_nav);
        //向地图中添加缩略图控件
        var ctrl_ove = new BMap.OverviewMapControl({ anchor: BMAP_ANCHOR_BOTTOM_RIGHT, isOpen: 1 });
        map.addControl(ctrl_ove);
        //向地图中添加比例尺控件
        var ctrl_sca = new BMap.ScaleControl({ anchor: BMAP_ANCHOR_BOTTOM_LEFT });
        map.addControl(ctrl_sca);
    }

//标注点数组
var markerArr = [<%=strmapid %> ];

    //创建marker
    function addMarker() {
        for (var i = 0; i < markerArr.length; i++) {
            var json = markerArr[i];
            var p0 = json.point.split("|")[0];
            var p1 = json.point.split("|")[1];
            var point = new BMap.Point(p0, p1);
            var iconImg = createIcon(json.icon);
            var marker = new BMap.Marker(point, { icon: iconImg });
            var iw = createInfoWindow(i);
            var label = new BMap.Label(json.title, { "offset": new BMap.Size(json.icon.lb - json.icon.x + 10, -20) });
            marker.setLabel(label);
            map.addOverlay(marker);
            label.setStyle({
                borderColor: "#808080",
                color: "#333",
                cursor: "pointer"
            });

initMap(); //创建和初始化地图
</script>
</html>

代码

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using BLL;

public partial class NewMap : System.Web.UI.Page
{
    public DataTable tb = new DataTable();
    public string strmapid = "";
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            show();
        }

    }
    public void show()
    {
            string StrSql = "select * from MapXY ";
            tb = DataAccess.dataSet(StrSql).Tables[0];
            for(int i=0;i<tb.Rows.Count;i++)
            {
                int m = int.Parse(tb.Rows[i]["now"].ToString());
                string l = "";
                if (m >= 0 && m < 3)
                {
                    l = "0";
                }
                else
                {
                    l = "46";
                }
                if (tb.Rows.Count - 1 == i)
                {
                    strmapid += "{ title: \"" + tb.Rows[i]["name"].ToString() + "\", content: \"" + tb.Rows[i]["shuoming"].ToString() + "\", point: \"" + tb.Rows[i]["x"].ToString() + "|" + tb.Rows[i]["y"].ToString() + "\", isOpen: 0, icon: { w: 23, h: 25, l: " + l + ", t: 21, x: 9, lb: 12} }";
                }
                else
                {
                    strmapid += "{ title: \"" + tb.Rows[i]["name"].ToString() + "\", content: \"" + tb.Rows[i]["shuoming"].ToString() + "\", point: \"" + tb.Rows[i]["x"].ToString() + "|" + tb.Rows[i]["y"].ToString() + "\", isOpen: 0, icon: { w: 23, h: 25, l: " + l + ", t: 21, x: 9, lb: 12} },";
                }

                //if (tb.Rows.Count - 1 == i)
                //{
                //    strmapid += "{ title: \"" + tb.Rows[i]["name"].ToString() + "\", content: \"" + tb.Rows[i]["shuoming"].ToString() + "\", point: \"" + tb.Rows[i]["x"].ToString() + "|" + tb.Rows[i]["y"].ToString() + "\", isOpen: 0, icon: {\"" + tb.Rows[i]["img"].ToString() + "\",new BMap.Size(300,157)} }";
                //}
                //else
                //{
                //    strmapid += "{ title: \"" + tb.Rows[i]["name"].ToString() + "\", content: \"" + tb.Rows[i]["shuoming"].ToString() + "\", point: \"" + tb.Rows[i]["x"].ToString() + "|" + tb.Rows[i]["y"].ToString() + "\", isOpen: 0, icon: {\"" + tb.Rows[i]["img"].ToString() + "\",new BMap.Size(300,157)} },";
                //}
                //"fox.gif", new BMap.Size(300,157)

        }
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        string sqlstr = "";
        sqlstr = "INSERT INTO MapXY (name,x,y,shuoming,now,address) VALUES ('" + name.Text + "','" + Request.Form["x"].ToString() + "','" + Request.Form["y"].ToString() + "','" + TextBox1.Text + "','" + DropDownList1.SelectedValue + "','" + Request.Form["address"].ToString() + "')";
        DataAccess.excuteSql(sqlstr);
        show();
    }
}