要学习百度地图,最好的地方就是去看百度地图API;

案例:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script> //需要你自己申请的密匙才有效
<title>设置点的新图标</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.404, 39.915);
map.centerAndZoom(point, 15); //创建小狐狸
var pt = new BMap.Point(116.417, 39.909);
var myIcon = new BMap.Icon("http://lbsyun.baidu.com/jsdemo/img/fox.gif", new BMap.Size(300,157));
var marker2 = new BMap.Marker(pt,{icon:myIcon}); // 创建标注
map.addOverlay(marker2); // 将标注添加到地图中
</script>

 

效果图:

js百度地图-简单的1个坐标点的更多相关文章

  1. iOS百度地图简单使用详解

    iOS百度地图简单使用详解 百度地图 iOS SDK是一套基于iOS 5.0及以上版本设备的应用程序接口,不仅提供展示地图的基本接口,还提供POI检索.路径规划.地图标注.离线地图.定位.周边雷达等丰 ...

  2. Android 百度地图 简单实现--- 美食搜索

    Android 百度地图 简单实现---  美食 依赖包: 加入 Android 百度依赖包: 1  key:  <!--        开发人员 key --> <meta-dat ...

  3. JS 百度地图 地图线路描绘

    JS 百度地图 地图线路描绘 <script type="text/javascript" src="http://api.map.baidu.com/api?v= ...

  4. JS 百度地图 换地图主题颜色(自定义)

    JS 百度地图 换地图主题颜色(自定义) 可通过这个在线编辑得到自己想要的主题:https://developer.baidu.com/map/custom/ <div id="all ...

  5. JS 百度地图 换地图主题颜色(API自带)

    JS 百度地图 换地图主题颜色(API自带) <script type="text/javascript" src="http://api.map.baidu.co ...

  6. JS 百度地图-右键菜单

    JS 百度地图-右键菜单 /*-----------------标注右键删除-------------------------*/ var markerMenu = new BMap.ContextM ...

  7. JS 百度地图路书---动态路线

    JS 百度地图路书---动态路线 <!DOCTYPE html> <head> <meta http-equiv="Content-Type" con ...

  8. 百度地图简单使用——添加折线,圆形等(html,js)

    地图覆盖物概述 所有叠加或覆盖到地图的内容,我们统称为地图覆盖物.如标注.矢量图形元素(包括:折线和多边形和圆).信息窗口等.覆盖物拥有自己的地理坐标,当您拖动或缩放地图时,它们会相应的移动. 地图A ...

  9. JS 百度地图导航

    上一篇文章中我们就简单的学习了HTML5 地理定位,那么今天告诉大家我在项目中遇到的一个问题吧,就是怎么实现点击一个按钮就可以调到百度地图,并且获取到你当前的位置,并且导航到指定的地方去. 不想看步骤 ...

随机推荐

  1. 四大关键步骤掌握CloudOps模型

    [TechTarget中国原创] 要让IT运维向云演进,企业必须拥抱自动化,并且改变资源预配的思考方式. 新涌现的术语CloudOps——云运维的简写,指代企业如何运行以及管理基于云的系统.并且,随着 ...

  2. 找出Xcode没有使用的图片

    #! /bin/sh PROJ=`find . -name '*.xib' -o -name '*.[mh]'` for png in ` find . -name '*.png'` do name ...

  3. copyEvens

    public int[] copyEvens(int[] nums, int count) { int newIndex=0; int i=0; int newArray[] = new int[co ...

  4. 剑指Offer - 九度1523 - 从上往下打印二叉树

    剑指Offer - 九度1523 - 从上往下打印二叉树2013-12-01 00:35 题目描述: 从上往下打印出二叉树的每个节点,同层节点从左至右打印. 输入: 输入可能包含多个测试样例,输入以E ...

  5. 用js做的表单的增,删,以及全选

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>创 ...

  6. Python全栈工程师(异常(基础))

    ParisGabriel                每天坚持手写  一天一篇  决定坚持几年 为了梦想为了信仰     Python人工智能从入门到精通 补充:包的相对导入 只对后两种导入方式有用 ...

  7. 课时5:闲聊之Python的数据类型

    目录: 一.引言 二.数据类型 >整型 >浮点型 >布尔类型 三.类型转换 四.获得关于类型的信息 五.课时05课后习题及答案 *********** 一.引言 ********** ...

  8. UVa 11426 - GCD - Extreme (II) 转化+筛法生成欧拉函数表

    <训练指南>p.125 设f[n] = gcd(1, n) + gcd(2, n) + …… + gcd(n - 1, n); 则所求答案为S[n] = f[2]+f[3]+……+f[n] ...

  9. __PRETTY_FUNCTION__,__func__,__FUNCTION__

    今天在看苹果的官方demo的时候,发现这个打印调用方法的参数,很是好奇,遂bing了一番. NSLog(@"----------------%s",__PRETTY_FUNCTIO ...

  10. hdu 2829 斜率DP

    思路:dp[i][x]=dp[j][x-1]+val[i]-val[j]-sum[j]*sum[i]+sum[j]*sum[j]; 其中val[i]表示1~~i是一段的权值. 然后就是普通斜率dp做法 ...