高德地图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坐标? --- ...
随机推荐
- 自行控制loadrunner的socket协议性能测试 (转)
一前言 二任务的提出 三实现方案讨论 四技术要点讲解 如何开始录制一个最简单的收发数据包脚本 写日志文件 一行一行读数据包文件 字符串转换为十六进制数据包 发送自己定义的数据包 接收数据包到自定义缓冲 ...
- UICollectionViews有了简单的重排功能
代码地址如下:http://www.demodashi.com/demo/13213.html 一.前言 我是UICollectionView的忠实粉丝.这个类比起它的老哥UITableView类具有 ...
- JUDE工具类图制作
1. 类图图形元素 2. 连接线条 线的关系解释如下: 3. 创建一个类
- JSON.parse 函数
JSON.parse 函数 JavaScript JSON.parse 函数 (JavaScript) 将 JavaScript 对象表示法 (JSON) 字符串转换为对象. JSON.parse(t ...
- springboot学习(三) springboot文件配置
1.简介 springboot没有了原来自己整合Spring应用时繁多的XML配置内容,替代它的是在pom.xml中引入模块化的Starter POMs,其中各个模块都有自己的默认配置,所以如果不是特 ...
- mac apt-get--> Homebrew
在最近采集linux进程网络指标的时候,为了对比采集结果,需要linux系统查看进程网络流量命令,最后查到nethogs 这个工具好用,但是在下载安装过程中碰到问题: 1:http://blog.cs ...
- vivado与modelsim的联合仿真(二)
最近在做Zynq的项目,曾经尝试使用ISE+PlanAhead+XPS+SDK组合和Vivado+SDK来搭建工程,使用中发现前者及其不方便后者有诸多不稳定.近期得闻Xilinx退出Vivado20 ...
- script
实例 链接一个外部脚本文件: <script type="text/javascript" src="myscripts.js"></scri ...
- 类matlab find函数
逻辑矩阵,找出元素1并记录其位置索引. int main(int argc, char** argv) { unsigned ][] = { , , , , , , , , , , , , , , , ...
- linux学习之vimrc配置推荐
,gb2312,gbk,gb18030,big5 "去掉vi一致性 set nocompatible ""设置行号 set number "打开文件类型自动检测 ...