js实现高德地图中修改icon的imagesize

精神抖擞王大鹏 2016-12-06 12:33:45
怎样修改标注的图片大小
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<style type="text/css">
body,html,#container{
height: 100%;
margin: 0px;
font: 12px Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial;
}
.title{
margin: 0px;
color: white;
font-size: 14px;
background-color: rgba(0,155,255,0.8);
line-height: 22px;
padding: 0px 0 0 6px;
font-weight: lighter;
letter-spacing: 1px;
}
.content{
padding: 4px;
color: #666;
line-height: 18px;
}
.amap-info-content{
padding: 0 0 2px 0px;
}
</style>
<title>自定义marker</title>

</head>
<body>
<div id="container" tabindex="0"></div>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=eaa2d3c0f7797919e4545ef2555e822c"></script>
<script type="text/javascript">
var map = new AMap.Map('container',{
resizeEnable: true,
zoom: 16,
center: [113.673192,34.688124]
});
var marker = new AMap.Marker({
map:map,
icon:"as/01.ico",
//点标记在地图上显示的位置
size: new AMap.Size(128,128), //图标大小
imageSize: new AMap.Size(25,25),
position: [113.673192,34.688124],
offset : new AMap.Pixel(-12,-12)
});
//为Marker指定目标显示地图。当参数值取null时,地图上移除当前Marker:setMap(null)
marker.setMap(map);
//设置覆盖物形状为圆
var circle = new AMap.Circle({
//设置圆心位置
center: [113.673192,34.688124],
//设置圆的半径
redius: 100,
//设置圆形填充透明度
fillOpacity:0.1,
//圆形填充颜色
fillColor:'#09f',
//设置线条颜色
strokeColor:'#09f',
//轮廓线宽度
strokeWeight:1
})
//将圆形扩状物加载到地图上
circle.setMap(map);
//根据地图上添加的覆盖物分布情况,自动缩放地图到合适的视野级别
map.setFitView()
var info = new AMap.InfoWindow({
//要显示的内容
content: '<div class="title">王帅鹏</div><div class="content">'+
'莫等闲,白了少年头,空悲切<br/>',
//相当于基点的偏移量
offset:new AMap.Pixel(0,-28),
//信息窗体尺寸
size:new AMap.Size(200,0)
})
//在地图的指定位置打开信息窗体
info.open(map,marker.getPosition())
</script>
<script type="text/javascript" src="http://webapi.amap.com/demos/js/liteToolbar.js"></script>
</body>
</html>
...全文
605 7 打赏 收藏 转发到动态 举报
写回复
用AI写文章
7 条回复
切换为时间正序
请发表友善的回复…
发表回复
sxper 2020-06-24
  • 打赏
  • 举报
回复
css里面改 .icon:height: 128px,wdith:128px
  • 打赏
  • 举报
回复
原图片的大小为128*128的
一支糖包仔 2016-12-06
  • 打赏
  • 举报
回复
引用 5 楼 qq_29027865 的回复:
嗯嗯,对的!
你要点下面的引用别人才能看到你回复的消息。不然别人根本不知道你回复了。 随便加在一个事件上啊。例如: 这是一个按钮,按钮有一个onclick事件(点击事件) <input type="button" onclick="click()"> js代码: function click(){ $("#img").css("width","1280px"); //$("#img")是通过图片的id获取这个控件,.css是改变控件的style样式,width或者height //(宽度和高度只改变一个就能等比例扩大),1280px是需要扩大到的像素 }
  • 打赏
  • 举报
回复
嗯嗯,对的!
  • 打赏
  • 举报
回复
引用 1 楼 qq_29027865 的回复:
原图片的大小为128*128的
你说的是 var marker = new AMap.Marker({ map:map, icon:"as/01.ico", //点标记在地图上显示的位置 size: new AMap.Size(128,128), //图标大小 imageSize: new AMap.Size(25,25), position: [113.673192,34.688124], offset : new AMap.Pixel(-12,-12) }); 这部分的?
  • 打赏
  • 举报
回复
添加到哪里呢?
一支糖包仔 2016-12-06
  • 打赏
  • 举报
回复
$("#img").css("width","1280px");

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧