FineUI与百度地图简单示例 (转帖)
http://www.fineui.com/bbs/forum.php?mod=viewthread&tid=4191&extra=page%3D1
前台代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Map.aspx.cs" Inherits="EmptyProjectNet40.Map" %>
<!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></title> <style type="text/css"> .columnpanel { margin-right: 5px; } .rowpanel { margin-bottom: 5px; } </style> <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.5&ak=C2c1257ee55b0cdb7d7df0ae4c3f4521"></script> </head> <body> <form id="form1" runat="server"> <x:PageManager ID="PageManager1" runat="server" /> <x:Panel ID="Panel2" runat="server" Height="500px" Width="900px" ShowBorder="True" BodyPadding="5px" Layout="Column" ShowHeader="True" Title="百度地图示例"> <Items> <x:Panel ID="Panel4" ColumnWidth="75%" EnableBackgroundColor="true" runat="server" CssClass="columnpanel" BodyPadding="5px" ShowBorder="true" ShowHeader="true" Layout="Fit" Height="464px" Title="地图"> <Toolbars> <x:Toolbar ID="Toolbar1" runat="server" Position="Top"> <Items> <x:Button runat="server" ID="Button1" Text="移动当前城市" EnablePostBack="false" OnClientClick="panTo();"> </x:Button> </Items> </x:Toolbar> </Toolbars> <Items> <x:ContentPanel runat="server" ShowBorder="True" ShowHeader="false"> <div id="container1" style="width:100%; height:400px; "></div> </x:ContentPanel> </Items> </x:Panel> <x:Panel ID="Panel3" ColumnWidth="25%" EnableBackgroundColor="true" runat="server" BodyPadding="5px" ShowBorder="true" ShowHeader="true" Height="464px" Title="坐标"> <Items> <x:Grid ID="Grid1" Title="表格" PageSize="4" ShowBorder="true" ShowHeader="False" runat="server" Height="427px" IsDatabasePaging="true" EnableRowDoubleClickEvent="true" OnRowDoubleClick="Grid1_RowClick"> <Columns> <x:BoundField Width="55px" DataField="CityName" DataFormatString="{0}" HeaderText="地区" /> <x:BoundField Width="75px" DataField="pointX" DataFormatString="{0}" HeaderText="经度" /> <x:BoundField Width="75px" DataField="pointY" DataFormatString="{0}" HeaderText="纬度" /> </Columns> </x:Grid> </Items> </x:Panel> </Items> </x:Panel> </form> <script type="text/javascript"> var map; var gridClientID = '<%= Grid1.ClientID %>'; var gc; function onReady() { map = new BMap.Map("container1"); // 创建地图实例 var point = new BMap.Point(116.404, 39.915); // 创建点坐标 map.centerAndZoom(point, 15); map.addEventListener("click", showInfo); //百度API注册单击事件 gc = new BMap.Geocoder(); } //移动到当前城市 function panTo() { var myCity = new BMap.LocalCity(); myCity.get(myFun); } //移动到某个经度和纬度 function PanToCity(x,y) { map.panTo(new BMap.Point(x, y)); } function myFun(result) { var cityName = result.name; map.setCenter(cityName); } //百度API点击回调事件 function showInfo(e) { //可以把获取到的经度和纬度保存起来,或者动态添加到Grid中 var pt = e.point; gc.getLocation(pt, function (rs) { var addComp = rs.addressComponents; __doPostBack(addComp.city + "," + e.point.lng + "," + e.point.lat, 'specialkey');//获取坐标简单拼装发送给服务端 });
} </script> </body> </html>
后台代码
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; using Newtonsoft.Json.Linq; using FineUI;
namespace EmptyProjectNet40 { public partial class Map : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { GetData(); } else { if ( Request.Form["__EVENTARGUMENT"] == "specialkey") { string req = Request.Form["__EVENTTARGET"]; string[] point=req.Split(','); if (point.Length > 1) { JObject defaultObj = new JObject(); defaultObj.Add("CityName", point[0]); defaultObj.Add("pointX", point[1]); defaultObj.Add("pointY", point[2]); DataTable dbt = (DataTable)Session["KEY_FOR_DATASOURCE_SESSION"]; dbt.Rows.Add(new object []{point[0],point[1],point[2]}); Session["KEY_FOR_DATASOURCE_SESSION"] = dbt; Grid1.DataSource = dbt; Grid1.DataBind(); } } } } protected void Grid1_RowClick(object sender, FineUI.GridRowClickEventArgs e) { DataTable dbt = (DataTable)Session["KEY_FOR_DATASOURCE_SESSION"]; DataRow dr = dbt.Rows[e.RowIndex]; string x = Convert.ToString(dr["pointX"]); string y = Convert.ToString(dr["pointY"]); PageContext.RegisterStartupScript("PanToCity(" + x + "," + y + ");"); } private DataTable dt; public void GetData() { dt = new DataTable(); dt.Columns.Add("CityName"); dt.Columns.Add("pointX"); dt.Columns.Add("pointY"); dt.Rows.Add(new object[] { "北京市", "116.222", "39.2222" }); dt.Rows.Add(new object[] { "武汉市", "114.333", "30.222"}); Grid1.DataSource = dt; Grid1.DataBind(); Session["KEY_FOR_DATASOURCE_SESSION"] = dt; } } }
FineUI与百度地图简单示例 (转帖)的更多相关文章
- 百度地图API示例之设置级别setZoom与禁止拖拽disableDragging
百度地图API示例之设置级别setZoom与禁止拖拽disableDragging 设置级别 <html> <head> <meta http-equiv="C ...
- [置顶]
Xamarin android如何调用百度地图入门示例(一)
在Xamarin android如何调用百度地图呢? 首先我们要区分清楚,百度地图这是一个广泛的概念,很多刚刚接触这个名词"百度地图api",的确是泛泛而谈,我们来看一下百度地图的 ...
- iOS百度地图简单使用详解
iOS百度地图简单使用详解 百度地图 iOS SDK是一套基于iOS 5.0及以上版本设备的应用程序接口,不仅提供展示地图的基本接口,还提供POI检索.路径规划.地图标注.离线地图.定位.周边雷达等丰 ...
- Android 百度地图 简单实现--- 美食搜索
Android 百度地图 简单实现--- 美食 依赖包: 加入 Android 百度依赖包: 1 key: <!-- 开发人员 key --> <meta-dat ...
- iOS百度地图简单使用
本文介绍三种接口: 1.基础地图2.POI检索3.定位 首先是配置环境,有两种方法,方法在官方教程里都有,不再多说 1.使用CocoaPods自动配置[这个方法特别好,因为当你使用CocoaPods配 ...
- 百度地图简单使用——添加折线,圆形等(html,js)
地图覆盖物概述 所有叠加或覆盖到地图的内容,我们统称为地图覆盖物.如标注.矢量图形元素(包括:折线和多边形和圆).信息窗口等.覆盖物拥有自己的地理坐标,当您拖动或缩放地图时,它们会相应的移动. 地图A ...
- 百度地图API示例之移动地图
级别为6 级别为8 级别为12 代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Conten ...
- 百度地图API示例之根据城市名设置地图中心点
代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" con ...
- 百度地图API示例之设置地图最大、最小级别
代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...
随机推荐
- EBS标准的查看供应商地址
--获取供应商PARTY_ID SELECT * FROM HZ_PARTIES HP WHERE HP.PARTY_NAME='XXXXXX' VO数据源:oracle.apps.pos.suppl ...
- SSH 不分配远程主机tty
$ host N参数,表示只连接远程主机,不打开远程shell:T参数,表示不为这个连接分配TTY.这个两个参数可以放在一起用,代表这个SSH连接只用来传数据,不执行远程操作.
- javaScript 删除确认实现方法小结
第一种: <a href="javascript:if(confirm('确认删除吗?'))window.location='del.php'">删除</a> ...
- javascript里的偏函数——本质函数式编程+闭包,返回函数
最终效果: var greet = function(greeting, name) { return greeting + ' ' + name; }; var sayHelloTo = _.par ...
- 国际音标en
元. 辅
- vue兄弟组件传递数据
在main.js里面设置data{eventHub:new Vue() } new Vue({ el: '#app', router, store, template: '<App/>', ...
- 【转载】oracle索引详解
原文URL;http://www.oschina.net/question/30362_4057?fromerr=FiY27yLL 作者:crazyinsomnia 一. ROWID的概念 存储了ro ...
- IntentService的用法,对比Service它会按顺序执行,不会像Service一样并发执行。
package com.lixu.intentservice; import android.app.Activity; import android.content.Intent; import a ...
- <NET CLR via c# 第4版> 读书笔记--目录
<NET CLR via c# 第4版>个别章节虽读过多次,但始终没有完整读过这本书.即使看过的那些,时间一长,也忘记了大部分.趁着最近不忙,想把这本书好好读一遍,顺便记下笔记,方便随时查 ...
- XP停服务,卡巴当后盾——卡巴斯基反病毒软件2014(一年版)
领取地址:http://xp.kaba365.com/3180000.asp 活动说明活动时间:2014年4月9日零时起赠送产品:卡巴斯基反病毒软件2014(一年版)激活码.赠送对象:中国大陆所有XP ...