码迷,mamicode.com
首页 > Windows程序 > 详细

百度地图api学习

时间:2015-06-15 18:32:32      阅读:190      评论:0      收藏:0      [点我收藏+]

标签:

实例1:画线画字

技术分享
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>济南景点步行图</title>
<style type="text/css">
#holder {
    width: 800px;
    height: 600px;
    background-color: pink;
}
</style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=tdPBKDSysoLON3V3f3k7z7p0"></script>
</head>
<body>
<div id="holder">
</div>
</body>
</html>
<script>
var map = new BMap.Map(holder);
var point = new BMap.Point(117.030568, 36.667777);
map.centerAndZoom(point, 14);
map.enableScrollWheelZoom();
var places = [
    {name: 大明湖, point: new BMap.Point(117.023669,36.679587)},
    {name: 趵突泉, point: new BMap.Point(117.023238,36.667545)},
    {name: 泉城广场, point: new BMap.Point(117.028124,36.66743)},
    {name: 植物园, point: new BMap.Point(117.027981,36.653996)},
    {name: 千佛山, point: new BMap.Point(117.03488,36.650985)}
];
var polyline = new BMap.Polyline([
        places[0].point,
        places[1].point,
        places[2].point,
        places[3].point,
        places[4].point
        ], {strokeColor: purple, strokeWeight: 5, strokeOpacity: .5});
map.addOverlay(polyline);
var style = {
    color: red,
    fontSize: 12px,
    height: 20px,
    lineHeight: 20px,
    fontFamily: 微软雅黑
};
var label0 = new BMap.Label(places[0].name, {position: places[0].point});
var label1 = new BMap.Label(places[1].name, {position: places[1].point});
var label2 = new BMap.Label(places[2].name, {position: places[2].point});
var label3 = new BMap.Label(places[3].name, {position: places[3].point});
var label4 = new BMap.Label(places[4].name, {position: places[4].point});
label0.setStyle(style);
label1.setStyle(style);
label2.setStyle(style);
label3.setStyle(style);
label4.setStyle(style);
map.addOverlay(label0);
map.addOverlay(label1);
map.addOverlay(label2);
map.addOverlay(label3);
map.addOverlay(label4);
</script>
View Code

 

百度地图api学习

标签:

原文地址:http://www.cnblogs.com/feilv/p/4578549.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!