百度地图-设置默认城市

1、问题背景

利用百度地图,展示某城市地图分布;初始化时,默认打开就是该城市

2、实现源码

<!DOCTYPE html>
<html>
  <head>
    <title>设置默认城市地图</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ak密钥"></script>
	<style>
		body,html,#map{
			width: 100%;
			height: 100%;
			overflow: hidden;
			margin: 0;
			font-size: 12px;
			font-family: "微软雅黑";
		}
	</style>

  </head>

  <body>
     <div id="map"></div>
  </body>
</html>
<script>
   var map = new BMap.Map("map");
   //初始化地图,centerAndZoom第一个参数为Point时,第二个参数的范围是3-19;对于移动端,centerAndZoom第一个参数为Point时,第二个参数的范围是3-18
   map.centerAndZoom(new BMap.Point(114.309531, 30.59619),50);
   //将控件添加到地图,一个控件实例只能向地图中添加一次
   map.addControl(new BMap.MapTypeControl());
   //设置地图显示的城市,默认为武汉
   map.setCurrentCity("武汉");
   //开启鼠标滚轮缩放
   map.enableScrollWheelZoom(true);
   //禁用地图拖拽
   map.disableDragging(true);
</script>

3、实现结果

时间: 2024-10-09 21:22:13

百度地图-设置默认城市的相关文章

三级联动,json数据、可设置默认城市

闲来无事,折腾个三级联动,json数据.可设置默认城市.可配置是否显示第三级select <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>省市县三级联动</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script&g

javascript调用百度地图,以及城市的初始化

地图的构建非常简单,官方的API文档也写得很清晰,我只做一总结: 一.引入JS:这个很容易理解,既然是调用JS版的百度地图,肯定得引用外部的JS文件了,而这个文件来自百度的服务器(所以必须得联网,不然就没戏..),我们以后用到的所有方法都写在这个JS文件当中. <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script> 这里的1.4为JS版

iOS 百度地图 设置显示区域 中心点和范围

在开发百度地图的时候会有这样的需求,需要设置地图显示在某个地方,虽然问题比较小,还是来记录一下. 并带有移动效果. 解决方案: BMKCoordinateRegion region ;//表示范围的结构体 region.center = coordinate;//中心点 region.span.latitudeDelta = 0.1;//经度范围(设置为0.1表示显示范围为0.2的纬度范围) region.span.longitudeDelta = 0.1;//纬度范围 [_mapView se

百度地图-设置地图最小、最大级别

1.问题背景 地图可以设置最小级别和最大级别,利用minZoom.maxZoom属性进行设置 2.实现源码 <!DOCTYPE html> <html> <head> <title>设置地图最小.最大级别</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv=&q

微信定位功能结合百度地图获取用户城市

需要结合百度地图的API,请先完成这篇文章的流程:<使用百度地图将经纬度转换成具体位置> 以vuejs为例 beforeMount () { var that = this; this.city = '正在定位城市...'; this.wxapi.getWxConfig({ url: window.location.href.split('#')[0] }).then(_ => { if (+(_.returnCode) == 0) { // 初始化微信配置 wx.config(_.da

[android] 百度地图开发 (二).定位城市位置和城市POI搜索

一. 百度地图城市定位和POI搜索知识       上一篇文章"百度地图开发(一)"中讲述了如何申请百度APIKey及解决显示空白网格的问题.该篇文章主要讲述如何定位城市位置.定位自己的位置和进行城市兴趣点POI(Point of Interest)搜索.那么如何在百度地图上定位某一个位置呢?       通过类GeoPoint可以定义经纬度,它存放着纬度值和经度值,通过getLastKnownLocation()方法可以获取Location对象,再定位经纬度设置其为地图中心即可显示当

[android] 百度地图开发 (两).所在地的城市定位和城市POI搜索

一个. 百度地图城市位置和POI搜索知识       上一篇文章"百度地图开发(一)"中讲述了怎样申请百度APIKey及解决显示空白网格的问题.该篇文章主要讲述怎样定位城市位置.定位自己的位置和进行城市兴趣点POI(Point of Interest)搜索.那么怎样在百度地图上定位某一个位置呢?       通过类GeoPoint能够定义经纬度,它存放着纬度值和经度值,通过getLastKnownLocation()方法能够获取Location对象,再定位经纬度设置其为地图中心就可以显

百度地图api - 城市列表

<!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="K

数据视化Echarts+百度地图API实现市县区级下钻

开始 这两天公司有个页面需要做数据可视化的展示,数据视化采用的是Echarts+百度地图API做展示,需要用到县级区级下钻的一个联动效果发现网上关于Echarts做到县区级下钻的资料很少,有的话也不是很详细,对于刚接触Echarts的让人来说可能有些搞不明白,在这里我把Echarts下钻开发过程中总结的知识分享给大家,也能使自己加深印象,当然啦,对于一些在软件行业折腾了几年的老油条来说,这些都是一些非常基础的东西.但是还是希望能帮助到那些刚接触Echarts遇到类似问题需要帮助的人.如果哪里写的