web端创建地图
1》在首部引入标签
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css" />
<script src="http://webapi.amap.com/maps?v=1.4.2&key=17c8ae918f4e9d678da9e4c077b3301b"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
2》HTML需要的位置
<!--地图-->
<div id="container" class="ditu" style=" margin: 0 auto;height:41%;">
</div>
3》js中(记得更改需要位置的经纬度center,以及地名)
//地图
var map = new AMap.Map('container', {
resizeEnable: true,
center: [113.949754,22.550679],
zoom: 13
});
var marker = new AMap.Marker({
position: map.getCenter()
});
marker.setMap(map);
// 设置鼠标划过点标记显示的文字提示
marker.setTitle('深圳市南山区科技园科丰路2号特发信息港D栋612');
// 设置label标签
marker.setLabel({ //label默认蓝框白底左上角显示,样式className为:amap-marker-label
offset: new AMap.Pixel(20, 20), //修改label相对于maker的位置
content: "深圳市南山区科技园科丰路2号特发信息港D栋612"
});
以上基本完成
拓展》
1:高德地图获取当前位置经纬度:http://lbs.amap.com/console/show/picker
2:高德地图具体代码实现(张国荣):http://lbs.amap.com/api/javascript-api/example/callapp/markonapp
web端创建地图的更多相关文章
- web端高德地图javascript API的调用
[转载https://www.cnblogs.com/zimuzimu/p/6202244.html]web端高德地图javascript API的调用 关于第三放地图的使用,腾讯.百度.高德 具体怎 ...
- 【原创】web端高德地图javascript API的调用
关于第三放地图的使用,腾讯.百度.高德 具体怎么选择看你自己怎么选择了. 高德地图开放平台:http://lbs.amap.com/ 本次使用的是高德的javascript API http://lb ...
- web端百度地图API实现实时轨迹动态展现
最近在工作中遇到了一个百度地图api中的难题,恐怕有的程序员可能也遇到过.就是实时定位并显示轨迹,网上大部分都是通过创建polyline对象贴到地图上.当然,百度地图的画线就是这样实现的,但是好多人会 ...
- 创建您的 ActiveReports Web端在线报表设计器
概述 ActiveReports Web端在线报表设计器已经正式上线!看到它这么帅气.实用,你是不是也想自己动手创建一个? 现在我们就来教您,如何创建一个简单的 ActiveReports Web端在 ...
- 高德地图web 端智能围栏
最近有个项目,需要在web上批量给设备设置智能围栏,设备超出范围报警,查看高德地图webJS API,web端操作案例如,后台判断没有提供源码 <!-- 重点参数:iconStyle --> ...
- web端测试总结
1.数值型输入框: 条件:demcial(x,y) ,界面显示小数点到y位 通常要检查以下几点: (1)边界值:最大值.最小值.最大值+1.最小值-1 (2)位数:最小位数.最大位数.最小位数-1最 ...
- 移动web端的react.js组件化方案
背景: 随着互联网世界的兴起,web前端开发的方式越来越多,出现了很多种场景开发的前端架构体系,也对前端的要求日益增高,早已经不是靠一个JQuery.js来做前端页面的时代了,而今移动端变化最大,近 ...
- 基于SignalR的web端即时通讯 - ChatJS
先看下效果. ChatJS 是基于SignalR实现的Web端IM,界面风格模仿的是“脸书”,可以很方便的集成到已有的产品中. 项目官网:http://chatjs.net/ github地址:htt ...
- Web端即时通讯技术盘点:短轮询、Comet、Websocket、SSE
1. 前言 Web端即时通讯技术因受限于浏览器的设计限制,一直以来实现起来并不容易,主流的Web端即时通讯方案大致有4种:传统Ajax短轮询.Comet技术.WebSocket技术.SSE(Serve ...
随机推荐
- 如何在Git中撤销一切 | 干货
翻译:李伟 审校:张帆 译自:Github JF杰微刊:如何在Git中撤销一切 任何一个版本控制系统中,最有用的特性之一莫过于 "撤销(undo)"操作.在Git中,"撤 ...
- C++对象模型(四):class成员初始化列表(Member Initialization List)
本文是Inside C++ Object Model Chapter 2 部分的读书笔记. 编译器如何处理初始化成员列表的. 下列情况中,必须要使用member initialization list ...
- 【Unity Shaders】Diffuse Shading——使用2D ramp texture来创建一个假的BRDF(双向反射分布函数)
本系列主要参考<Unity Shaders and Effects Cookbook>一书(感谢原书作者),同时会加上一点个人理解或拓展. 这里是本书所有的插图.这里是本书所需的代码和资源 ...
- EBS R12 LOG files 位置
- Apache, OC4J and OPMN: $LOG_HOME/ora/10.1.3/Apache$LOG_HOME/ora/10.1.3/j2ee$LOG_HOME/ora/10.1.3/op ...
- 【一天一道LeetCode】#39. Combination Sum
一天一道LeetCode系列 (一)题目 Given a set of candidate numbers (C) and a target number (T), find all unique c ...
- 算法学习笔记(一)C++排序函数、映射技巧与字典树
1.头文件algorithm中有函数sort()用于排序,参数为:排序起始地址,排序结束地址,排序规则(返回bool型)例如,要将array[] = {5,7,1,2,9}升序排列,则使用: bool ...
- centos 下安装mysql-5.6.11
这次是在centos6.4下安装mysql,在安装之前,你要先确定你的linux已经安装了这些包: wget, gcc-c++, ncurses-devel ,cmake, make ,perl 如果 ...
- LeetCode之“链表”:Merge Two Sorted Lists && Merge k Sorted Lists
1. Merge Two Sorted Lists 题目链接 题目要求: Merge two sorted linked lists and return it as a new list. The ...
- Leetcode_202_Happy Number
+ 92 = 82 82 + 22 = 68 62 + 82 = 100 12 + 02 + 02 = 1 思路: (1)题意为判断给定的整数是否为一个"快乐的数",所谓快乐的数需 ...
- Java-ServletRequestEvent-ServletRequestAttributeEvent
/** * Events of this kind indicate lifecycle * events for a ServletRequest. * The source of the even ...