百度地图AP1

百度地图API的用法

百度地图API演示样例

百度地图API学习总结

<1>

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<Peer._128uu.DAL.Model.MemberRegisterInfo>" %>

<!DOCTYPE HTML>
<html>
<head>
    //百度地图的js引入
    <script type="text/javascript" src="http://api.map.baidu.com/api?

v=1.3"></script>
</head>
<body>
    <% using (Html.BeginForm("Register", "Account", FormMethod.Post, new { @id = "form1", @name = "form1" }))
       {%>
    <%: Html.ValidationSummary(true)%>

    <div style="width: 520px; height: 340px; border: 1px solid gray" id="container">
    </div>
    <input id="submit" type="submit" value="提交" class="registerBtn" />

    <% } %>
</body>
</html>
<script type="text/javascript">

    var map = new BMap.Map("container"); //在container容器中创建一个地图,參数container为div的id属性;

    var point = new BMap.Point(112.035925, 22.939858); //定位酒店的坐标(酒店的坐标冲数据库里取)

    var marker = new BMap.Marker(point)// 在当前地址处创建标注

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

    var label = new BMap.Label("云浮碧桂园凤凰酒店", { offset: new BMap.Size(20, -10) });

    marker.setLabel(label); //给标注加入文字信息

    map.addControl(new BMap.NavigationControl()); //向地图加入一个平移缩放控件
    map.addControl(new BMap.MapTypeControl()); //地图类型控件。默认位于地图右上方
    map.addControl(new BMap.ScaleControl()); //一个比例尺控件
    map.addControl(new BMap.OverviewMapControl()); //一个缩略图控件

    map.enableScrollWheelZoom(); //启用地图滚轮放大缩小
    map.enableDoubleClickZoom(); //启用鼠标双击放大。默认启用(可不写)
    map.enableDragging(); //启用地图拖拽事件。默认启用(可不写)
    map.enableKeyboard(); //启用键盘上下左右键移动地图

    function showInfo(e) {
        alert(e.point.lng + ", " + e.point.lat);
    }
    map.addEventListener("click", showInfo); //给地图加入点击事件。

    map.centerAndZoom(point, 15); //将point移到浏览器中心,而且地图大小调整为15;

    //            //创建小狐狸
    //	        var pt = new BMap.Point(116.417, 39.909);
    //	        var myIcon = new BMap.Icon("http://developer.baidu.com/map/jsdemo/img/fox.gif", new BMap.Size(300,157));
    //	        var marker2 = new BMap.Marker(pt,{icon:myIcon});  // 创建标注
    //	        map.addOverlay(marker2);  

    //定位到当前城市
    //            var city = new BMap.LocalCity();
    //            city.get(getLocalCity);
    //            function getLocalCity(result) { //获取本地城市
    //            var cityName = result.name;
    //            map.centerAndZoom(cityName, 15);

    //            //map.centerAndZoom(point,15);//将point移到浏览器中心,而且地图大小调整为15;
    //            map.addControl(new BMap.NavigationControl());
    //            map.addControl(new BMap.MapTypeControl());
    //            map.addControl(new BMap.ScaleControl());
    //            map.addControl(new BMap.OverviewMapControl());
    //
    //            }

</script>
时间: 2024-10-25 19:11:01

百度地图AP1的相关文章

百度地图API实现批量地址解析

1.前言 写这篇文章的原因是最近做一个GIS项目在网上爬取了一些数据,无奈只有地址的文字信息没有坐标信息,如何把信息显现在地图上呢?很纠结啊,查看了一下百度地图API惊奇的发现百度提供了地址解析的API,然后查看了他的Demo后豁然开朗,所以动手将自己的文字信息数据进行解析坐标信息.下面开始讲解. 2.方案 (1)自己数据库中的数据 (2)百度地图API Demo <!DOCTYPE html> <html> <head> <meta http-equiv=&qu

js中实现高德地图坐标经纬度转百度地图坐标

1 function tobdMap(x, y) { 2 var x_pi = 3.14159265358979324 * 3000.0 / 180.0; 3 var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * x_pi); 4 var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * x_pi); 5 var bd_lon = z * Math.cos(theta) + 0.00

Vue2.0与 [百度地图] 结合使用———vue+webpack+axios+百度地图实现组件之间的通信

Vue2.0与 [百度地图] 结合使用: 1.vue init webpack-simple vue-baidu-map 2.下载axios cnpm install axios; 3.在main.js中引入axios,并使用 import axios from 'axios' /* 把axios对象挂到Vue实例上面,其他组件在使用axios的时候直接 this.$http就可以了 */ Vue.prototype.$http = axios; 4.引入百度地图的js秘钥--->最好在inde

百度地图标注图标太小

1.1.1  现象 百度地图中,定位点的标注示意图标太小: 实际期望的图标是这样的: 1.1.2  原因 检查了很久,以为是打开地图时的设置问题,后来慢慢查找地图上的元素定位,终于发现原来这个图标大小是被CSS控制的,在地图元素的内部可以找到如下代码: 这个img元素就是用来显示定位图标的,可以修改这个元素的CSS属性来改变大小. 1.1.3  解决 如果要使用默认大小,则需要配置如下CSS: img {     max-width: inherit; } 原来图标变小,是因为其它CSS配置导致

Android 百度地图开发(一)--- 申请API Key和在项目中显示百度地图

标签: Android百度地图API Key  分类: Android 百度地图开发(2)  最近自己想研究下地图,本来想研究google Map,但是申请API key比较坑爹,于是从百度地图入手,其实他们的用法都差不多,本篇文章就带领大家在自己的Android项目中加入百度地图的功能,接下来我会写一系列关于百度地图的文章,欢迎大家到时候关注!   一 申请API key 在使用百度地图之前,我们必须去申请一个百度地图的API key,申请地址http://lbsyun.baidu.com/a

HTML5结合百度地图API创建地图应用

具体的百度地图API的使用方法查看百度地图API里的DEMO <style> #div1{ width:400px; height:400px; border:1px #000 solid;} </style> <script src="http://api.map.baidu.com/api?v=1.3"></script> <script> window.onload = function(){ var oInput =

百度地图SDK开发过程中遇到的问题解析

问题1. 在运行显示百度地图是出现如下错误,导致程序停止: 01-30 06:49:49.935: E/AndroidRuntime(9132): Caused by: java.lang.UnsatisfiedLinkError: Couldn't load BaiduMapSDK_v3_2_0_15 from loader dalvik.system.PathClassLoader[dexPath=/data/app/com.example.getsmsinfo-1.apk,libraryP

Android如何申请百度地图key

在开发过程中,有时候会使用到地图定位之类的功能,在使用百度地图之前,我们先要申请一个百度地图的key方才能使用,接下来,一步步教给大家如何去申请一个百度地图key 登录你的百度帐号,之后搜索---"百度地图api",如下图所示: 选择第一个,点击进去之后,往下拉,如图所示: 点击申请密钥,如图所示: 接下来如图所示: 接下去找Android SDK安全码,如图所示: 之后回到页面,将复制的东西拷贝到安全码那,之后写一个英文分号;   ,之后加上项目包名,就好,如下图: 点击提交之后,

Android百度地图开发(一)之初体验

转载请注明出处:http://blog.csdn.net/crazy1235/article/details/42614603 做关于位置或者定位的app的时候免不了使用地图功能,本人最近由于项目的需求需要使用百度地图的一些功能,所以这几天研究了一下,现写一下blog记录一下,欢迎大家评论指正! 一.申请AK(API Key) 要想使用百度地图sdk,就必须申请一个百度地图的api key.申请流程挺简单的. 首先注册成为百度的开发者,然后打开http://lbsyun.baidu.com/ap