高德地图API使用
1、根据地址找经纬度/修改经纬度
marker.setPosition(result.geocodes[0].location);
map.setCenter(marker.getPosition())
2、根据经纬度找地址
3、 根据当前IP获取城市
function initLocationCity() { //实例化城市查询类
var citysearch = new AMap.CitySearch();
//自动获取用户IP,返回当前城市
citysearch.getLocalCity(function (status, result) {
if (status === 'complete' && result.info === 'OK') {
if (result && result.city && result.bounds) {
var cityinfo = result.city;
var citybounds = result.bounds;
document.getElementById('txtCity').value = cityinfo;
var ipCity = cityinfo.replace("市", "");
$(".cityList ul a").each(function () {
if ($(this).text().indexOf(ipCity) != -) {
$("#hidShopAreaId").val($(this).attr("data-content"));
loadCityXY();
searchShopList();
}
}); //地图显示当前城市
mapObj.setBounds(citybounds);
}
} else {
document.getElementById('txtCity').value = result.info;
}
});
}
4、
$.ajaxRequest({
url: "接口路径",
onRequest: function (param) {
参数
},
onResponse: function (result) {
mapObj.clearMap();
$(result).each(function (i) { marker = new AMap.Marker({
position: [item.Longitude, item.Latitude],
icon: new AMap.Icon({
size: new AMap.Size(, ),
image: "/Static/Web/Images/Shop/markerIcon.png", // 覆盖标注的图标
imageOffset: new AMap.Pixel(, ) //相对于大图的取图位置 })
});
marker.setLabel({ // 设置数字
offset: new AMap.Pixel(, ),
content: (parseInt(i) + )
}); marker.on('click', function () {
// 点击当前标注,清除在这之前已生成过的覆盖标注,定义不同的overMark避免和marker冲突 if (overMarker) {
mapObj.remove(overMarker);
}; overMarker = new AMap.Marker({ //添加自定义点标记
map: mapObj,
position: [item.Longitude, item.Latitude], //基点位置
offset: new AMap.Pixel(-, -), //相对于基点的偏移位置
zIndex: ,
content: '覆盖内容’ //自定义点标记覆盖物内容
});
overMarker.setMap(mapObj);
mapObj.setZoomAndCenter(, [item.Longitude, item.Latitude]);// 定位后再缩放 });
marker.setMap(mapObj); }); mapObj.setFitView();
return result;
} });
5、循环遍历标注并自定义infoWindow窗口(自定义点标注,缩放地图比例,给标注添加点击事件并更改标注图标) 5、添加新标注,修改标注(覆盖物)
添加新标注:
marker = new AMap.Marker({
icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
position: [116.41, 39.91]
});
marker.setMap(map);
覆盖物:会替换掉原来的标注
function updateMarker() {
// 自定义点标记内容
var markerContent = document.createElement("div"); // 点标记中的图标
var markerImg = document.createElement("img");
markerImg.className = "markerlnglat";
markerImg.src = "http://webapi.amap.com/theme/v1.3/markers/n/mark_r.png";
markerContent.appendChild(markerImg); // 点标记中的文本
var markerSpan = document.createElement("span");
markerSpan.className = 'marker';
markerSpan.innerHTML = "Hi,我换新装备啦!";
markerContent.appendChild(markerSpan); marker.setContent(markerContent); //更新点标记内容
marker.setPosition([116.39, 39.93]); //更新点标记位置
}
6、根据经纬度初始化地图,并且要让地图比例放大
解决方法:
在定位完成map.setFitView();方法后设置 map.setZoomAndCenter(28, [Y,X]);// 缩放比例,经度 纬度 即可
高德地图API使用的更多相关文章
- 高德地图api实现地址和经纬度的转换(python)
利用高德地图web服务api实现地理/逆地址编码 api使用具体方法请查看官方文档 文档网址:http://lbs.amap.com/api/webservice/guide/api/georegeo ...
- 高德地图API应用
高德地图官网:http://api.amap.com/javascript/ 输入关键字,搜索地址功能的网页: 1.引用远程Map Api(js)网址形式(注册后获取) 2.定义个<div> ...
- 【高德地图API】如何解决坐标转换,坐标偏移?
http://bbs.amap.com/thread-18617-1-1.html#rd?sukey=cbbc36a2500a2e6c2b0b19115118ace519002ff3a52731f13 ...
- android 高德地图API 之 java.lang.UnsatisfiedLinkError: Couldn't load amapv3: findLibrary returned null错误
错误场景: 运行android app时,在运行到调用高德地图API时,出现 “java.lang.UnsatisfiedLinkError: Couldn't load amapv3: findLi ...
- 高德地图API
这周计划: 周一 早上 (高德地图API) 中午写(IFE PART ONE) 下午(高德地图API) 下班(IFE PART ONE)
- 【高德地图API】汇润做爱地图技术大揭秘
原文:[高德地图API]汇润做爱地图技术大揭秘 昨日收到了高德地图微信公众号的消息推送,说有[一大波免费情趣用品正在袭来],点进去看了一眼,说一个电商公司(估计是卖情趣用品的)用高德云图制作了一张可以 ...
- 【高德地图API】一句话搞定webmap(一)——轻地图组件
原文:[高德地图API]一句话搞定webmap(一)——轻地图组件 摘要: 遥想当年,在APP中加入LBS元素相当困难:要刻苦学习java,要刻苦学习iOS开发,要刻苦学习javascript…… 而 ...
- 【高德地图API】从零开始学高德JS API(七)——定位方式大揭秘
原文:[高德地图API]从零开始学高德JS API(七)——定位方式大揭秘 摘要:关于定位,分为GPS定位和网络定位2种.GPS定位,精度较高,可达到10米,但室内不可用,且超级费电.网络定位,分为w ...
- 【高德地图API】从零开始学高德JS API(八)——地址解析与逆地址解析
原文:[高德地图API]从零开始学高德JS API(八)——地址解析与逆地址解析 摘要:无论是百度LBS开放平台,还是高德LBS开放平台,其调用量最高的接口,必然是定位,其次就是地址解析了,又称为地理 ...
- 【高德地图API】从零开始学高德JS API(六)——坐标转换
原文:[高德地图API]从零开始学高德JS API(六)——坐标转换 摘要:如何从GPS转到谷歌?如何从百度转到高德?这些都是小case.我们还提供,如何将基站cell_id转换为GPS坐标? --- ...
随机推荐
- 《DirectX 9.0 3D游戏开发编程基础》 第一章 初始化Direct3D 读书笔记
REF设备 参考光栅设备,他能以软件计算方式完全支持Direct3D Api.借助Ref设备,可以在代码中使用那些不为当前硬件所支持的特性,并对这此特性进行测试. D3DDEVTYPE 在程序代码中, ...
- python读取文件下的所有文档
两类文档存储在两个路径下,假设每类文档有25个文档 def spamTest(): docList = [] classList = [] fullText = [] for i in range(1 ...
- Android apktool反编译资源文件为空解决办法(测试天猫、淘宝等apk成功)
1 Exception in thread main brut.androlib.androlibexception multiple resources 解决办法:下载最新的apktool,在goo ...
- sql笔记 获取指定数据库下的所有表
SELECT Name FROM 数据库名称..SysObjects Where XType='U' ORDER BY Name XType='U' 标识查询用户创建的表 S为系统创建的表
- CEF与JavaScript交互读取电脑信息
CefSharp中c#和JavaScript交互读取电脑信息 介绍 CEF是由Marshall Greenblatt于2008年创建的基于Google Chromium的BSD许可开源项目.与主要关注 ...
- php私有成员private的程序题目
class base { private $member; function __construct() { echo __METHOD__ . "(begin)\n"; $thi ...
- jquery中Uncaught TypeError: $(...).ajaxUpload is not a function(…)错误解决方法
错误原因:该函数不是jquery的核心函数,所以需要外部引入ajaxfileupload.js文件,可能是没有引入,或者引入的js文件互相冲突 解决方法:每次进入一个函数之前打印该函数所有的js文件, ...
- Blackey win10 + python3.6 + VSCode + tensorflow-gpu + keras + cuda8 + cuDN6N环境配置(转载)
win10 + python3.6 + VSCode + tensorflow-gpu + keras + cuda8 + cuDN6N环境配置 写在前面的话: 再弄这个之前,我对python也好 ...
- AOF 持久化策略
Redis为了解决AOF后台重写造成的数据不一致问题,设置了AOF重写缓冲区.即使设置了no-appendfsync-on-rewrite yes也会造成短暂的主进程阻塞.原因就在于子进程完成AOF重 ...
- 我的第二个java程序 循环
public class Test {//类 public Test (int num){//构造方法,和类同名,无返回值,接收传参并定义传参的类型,大小写敏感 int x = 10;//局部变量,定 ...