高德h5地图api接口_概述-地图 JS API | 高德地图API

var map = new AMap.Map('container', {

resizeEnable: true,

zoom:11,

center: [116.397428, 39.90923]

});

var marker, map = new AMap.Map("container", {

resizeEnable: true,

center: [116.397428, 39.90923],

zoom: 13

});

AMap.event.addDomListener(document.getElementById('addMarker'), 'click', function() {

addMarker();

}, false);

AMap.event.addDomListener(document.getElementById('updateMarker'), 'click', function() {

marker && updateMarker();

}, false);

AMap.event.addDomListener(document.getElementById('clearMarker'), 'click', function() {

if (marker) {

marker.setMap(null);

marker = null;

}

}, false);

// 实例化点标记

function addMarker() {

if (marker) {

return;

}

marker = new AMap.Marker({

icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",

position: [116.405467, 39.907761]

});

marker.setMap(map);

}

function updateMarker() {

// 自定义点标记内容

var markerContent = document.createElement("div");

// 点标记中的图标

var markerImg = document.createElement("img");

markerImg.className = "markerlnglat";

markerImg.src = "https://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.391467, 39.927761]); //更新点标记位置

}

var map = new AMap.Map('container', {

resizeEnable: true,

center: [116.397428, 39.90923],

zoom: 13

});

//实时路况图层

var trafficLayer = new AMap.TileLayer.Traffic({

zIndex: 10

});

trafficLayer.setMap(map);

var isVisible = true;

AMap.event.addDomListener(document.getElementById('control'), 'click', function() {

if (isVisible) {

trafficLayer.hide();

isVisible = false;

} else {

trafficLayer.show();

isVisible = true;

}

}, false);

var map = new AMap.Map("container", {

resizeEnable: true

});

AMap.service(["AMap.PlaceSearch"], function() {

var placeSearch = new AMap.PlaceSearch({ //构造地点查询类

pageSize: 5,

pageIndex: 1,

city: "010", //城市

map: map,

panel: "panel"

});

//关键字查询

placeSearch.search('方恒');

});

var map = new AMap.Map("container", {

resizeEnable: true,

center: [116.397428, 39.90923],//地图中心点

zoom: 13 //地图显示的缩放级别

});

//构造路线导航类

var driving = new AMap.Driving({

map: map,

panel: "panel"

});

// 根据起终点经纬度规划驾车导航路线

driving.search(new AMap.LngLat(116.379028, 39.865042), new AMap.LngLat(116.427281, 39.903719));

function geocoder() {

var geocoder = new AMap.Geocoder({

city: "010", //城市，默认：“全国”

radius: 1000 //范围，默认：500

});

//地理编码,返回地理编码结果

geocoder.getLocation("北京市海淀区苏州街", function(status, result) {

if (status === 'complete' && result.info === 'OK') {

geocoder_CallBack(result);

}

});

}

function addMarker(i, d) {

var marker = new AMap.Marker({

map: map,

position: [d.location.getLng(), d.location.getLat()]

});

var infoWindow = new AMap.InfoWindow({

content: d.formattedAddress,

offset: {

x: 0,

y: -30

}

});

marker.on("mouseover", function(e) {

infoWindow.open(map, marker.getPosition());

});

}

//地理编码返回结果展示

function geocoder_CallBack(data) {

var resultStr = "";

//地理编码结果数组

var geocode = data.geocodes;

for (var i = 0; i < geocode.length; i++) {

//拼接输出html

resultStr += "" + "地址：" + geocode[i].formattedAddress + "" + "  的地理编码结果是:    坐标：" + geocode[i].location.getLng() + ", " + geocode[i].location.getLat() + "" + "    匹配级别：" + geocode[i].level + "";

addMarker(i, geocode[i]);

}

map.setFitView();

document.getElementById("result").innerHTML = resultStr;

}