c# 引用百度地图

<script type="text/javascript">

        //创建和初始化地图函数

        var map = new BMap.Map("home");//在百度地图容器中创建一个地图

        function initMap() {

            createMap();//创建地图

            setMapEvent();//设置地图事件

            addMapControl();//向地图添加控件

        }      

        var opts = {

            width: 250,     // 信息窗口宽度

            height: 100,     // 信息窗口高度

            title: "Hello"  // 信息窗口标题

        }       

        //显示弹框信息

        function ShowForm(info) {

            var infoWindow = new BMap.InfoWindow(info, opts);  // 创建信息窗口对象

            map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口

        }

        //创建地图函数：

        function createMap() {

            var point = new BMap.Point(116.404, 39.915);//定义一个中心点坐标

            map.centerAndZoom(point, 17);//设定地图的中心点和坐标并将地图显示在地图容器中

            window.map = map;//将map变量存储在全局 

            var marker = new BMap.Marker(point);        // 创建标注

            map.addOverlay(marker);                     // 将标注添加到地图中

            addMarker(point, 0);

            ShowForm("111111111111111");

            //监听标注事件mouseover

            marker.addEventListener("mouseover", function () {

                ShowForm("333333333333");

                //alert("您点击了标注121");

            });

            //可托拽的标注

            //marker.enableDragging();

            //marker.addEventListener("dragend", function (e) {

            //    alert("当前位置1：" + e.point.lng + ", " + e.point.lat);

            //})

        }

        //map.addEventListener("click", function () {

        //    alert("您点击了地图。");

        //});

        // 创建图标对象

        function addMarker(point, index) {

            var myIcon = new BMap.Icon("markers.png", new BMap.Size(23, 25), {

                // 指定定位位置。

                // 当标注显示在地图上时，其所指向的地理位置距离图标左上

                // 角各偏移10像素和25像素。您可以看到在本例中该位置即是

                // 图标*下端的尖角位置。

                offset: new BMap.Size(10, 25),

                // 设置图片偏移。

                // 当您需要从一幅较大的图片中截取某部分作为标注图标时，您

                // 需要指定大图的偏移位置，此做法与css sprites技术类似。

                imageOffset: new BMap.Size(0, 0 - index * 25)   // 设置图片偏移

            });

            // 创建标注对象并添加到地图(可以自定义图片)

            //var marker = new BMap.Marker(point, { icon: myIcon });

            //map.addOverlay(marker);

        }

        //地图事件设置函数：

        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);

        }

        initMap();//创建和初始化地图

</script>

删除百度的logo,覆盖样式即可

.anchorBL {
display: none;
}

 //根据输入地址确定经纬度

        var localSearch = new BMap.LocalSearch(map);

        localSearch.enableAutoViewport(); //允许自动调节窗体大小

        function searchByStationName() {

            map.clearOverlays();//清空原来的标注

            var keyword = document.getElementById("text_").value;

            localSearch.setSearchCompleteCallback(function (searchResult) {

                var poi = searchResult.getPoi(0);

                document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat;

                map.centerAndZoom(poi.point, 13);

                var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat));  // 创建标注，为要查询的地方对应的经纬度

                map.addOverlay(marker);

                var content = document.getElementById("text_").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;

                var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");

                marker.addEventListener("mouseover", function () { this.openInfoWindow(infoWindow); });

            });

            localSearch.search(keyword);

        }

　　要查询的地址：<input id="text_" type="text" value="宁波天一广场" style="margin-right:100px;"/>
查询结果(经纬度)：<input id="result_" type="text" />

秒客网

c# 引用百度地图

相关文章