高德地图将带有自定义图片的marker用折线连接起来
今天有个哥们需要地图这方面的需求！中午花时间写了个demo！
我用的是高德地图，地图这块没有要求，随便哪个都行，但是Google地图，在由于某些原因在国内的定位不是很准确，我就选了高德的地图。
& & 高德地图的api地址：
首先按照他的介绍在开发指南中，先申请了开发密钥，然后把基本的配置都加上了，这些在这都不说了，自己可以去上面的链接去看一下。
然后进行下面的步骤，我将一些假数据用一个文件给存了起来，命名为data.json，这个文件里的格式就是json的格式，便于解析。然后编写一个在地图上添加marker点的代码：
//加marker点
private void addmarker() {
int i = 0;
int len = ll.views.size();
for (ViewInfo info : ll.views) {
MarkerOptions mo = new MarkerOptions();
mo.position(new LatLng(info.lat, info.lng));
mo.draggable(true);
mo.title(info.name);
mo.icon(BitmapDescriptorFactory.defaultMarker());//创建一个marker，并指定些属性值。
bm1 = bm.copy(Config.ARGB_8888, true);
canvas = new Canvas(bm1);
Paint paint = new Paint();
paint.setColor(Color.WHITE);
paint.setTextSize(35);
canvas.drawText("" + i, 15, 42, paint);
if (i == 0) {
mo.icon(BitmapDescriptorFactory.fromAsset("site_poi_start_s.png"));
} else if (i == (len - 1)) {
mo.icon(BitmapDescriptorFactory.fromAsset("site_poi_end_s.png"));
mo.icon(BitmapDescriptorFactory.fromBitmap(bm1));
//上面这段代码是自定义一个marker的图片并在上面写上数字。
aMap.addMarker(mo);//将marker加载到地图上
接下来，把这些点连起来，画成折线：
private void addPolyline(ArrayList list) {
PolylineOptions options = new PolylineOptions();
for (ViewInfo info : list) {
options.add(new LatLng(info.lat, info.lng));//定义每个拐点
aMap.addPolyline(options);将这些拐点加到折线中
最后，把视图修改到你指定的经纬度上就好了：
//把相机移动到指定位置
private void moveToForbiddenCity() {
CameraUpdate cu = CameraUpdateFactory.newLatLngZoom(new
LatLng(ll.lat, ll.lng), 15.0f);
aMap.moveCamera(cu);
奥，差点忘了说怎么加载数据：
//从assets中加载数据
private void loadJsonData() throws IOException {
AssetManager assetMgr = getAssets();
Gson gson = new Gson();
ll = gson.fromJson(new
InputStreamReader(assetMgr.open("data.json")), Ll.class);
以上就完成了，附上demo代码：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。1.自定义InfoWindowAdapter：
package com.onetoo.www.onetoo.abapter.home
import android.content.Context
import android.view.LayoutInflater
import android.view.View
import android.widget.ImageView
import android.widget.TextView
import com.amap.api.maps2d.AMap
import com.amap.api.maps2d.model.Marker
import com.bumptech.glide.Glide
import com.onetoo.www.onetoo.R
import com.onetoo.www.onetoo.bean.home.HomeStore
import com.onetoo.www.onetoo.utils.StoreInfoUtil
public class CustomInfoWindowAdapter implements AMap.InfoWindowAdapter{
private Context context
public CustomInfoWindowAdapter(Context context) {
this.context = context
public View getInfoWindow(Marker marker) {
View view = LayoutInflater.from(context).inflate(R.layout.map_info_window, null)
setViewContent(marker,view)
return view
//这个方法根据自己的实体信息来进行相应控件的赋值
private void setViewContent(Marker marker,View view) {
HomeStore.DataEntity storeInfo = (HomeStore.DataEntity) marker.getObject()
ImageView ivPic = (ImageView) view.findViewById(R.id.iv_info_store_pic)
Glide.with(context).load(storeInfo.getStore_pic()).centerCrop().into(ivPic)
TextView tvName = (TextView) view.findViewById(R.id.tv_info_store_name)
tvName.setText(storeInfo.getStore_name())
TextView tvType = (TextView) view.findViewById(R.id.tv_info_store_type)
String storeCategory = StoreInfoUtil.getStoreCategory(storeInfo.getFk_category_id())
tvType.setText(storeCategory)
//提供了一个给默认信息窗口定制内容的方法。如果用自定义的布局，不用管这个方法。
public View getInfoContents(Marker marker) {
return null
2.拿到AMap对象，设置adapter：
AMap aMap = mapView.getMap()
aMap.setInfoWindowAdapter(new CustomInfoWindowAdapter(getActivity()))
3.Activity或则其他地方关键代码：
MarkerOptions options = new MarkerOptions();
options.title("");
options.position(new LatLng(latitude, longitude)).icon(BitmapDescriptorFactory
.fromBitmap(BitmapFactory
.decodeResource(getResources(), R.drawable.xxx)));
Marker marker = aMap.addMarker(options);
marker.setObject(object);
aMap.setOnMarkerClickListener(this);
public boolean onMarkerClick(Marker marker) {
curShowWindowMarker =
return false;
aMap.setOnInfoWindowClickListener(this);
public void onInfoWindowClick(Marker marker) {
aMap.setOnMapTouchListener(this);
public void onTouch(MotionEvent motionEvent) {
if (aMap != null && curShowWindowMarker != null) {
if (curShowWindowMarker.isInfoWindowShown()){
curShowWindowMarker.hideInfoWindow();
本文已收录于以下专栏：
相关文章推荐
安卓高德地图之自定义infowindow
示例代码部分：
&meta name=&viewport& content=&initial-scale=1.0, user-scalable=no, width=d
先说一下项目对地图的需求：在后台新增地图管理模块，要求，每一辆车都在地图上有标注，而且点击标注时要显示出车辆的相关信息，比如车牌和车辆的当前状态。
下图就是实现的效果。
当然从高德地图api也能...
一、基础地图部分
1.获取APPKey
在高德地图注册开发者账号，然后创建应用，使用SHA1和PackageName得到Key
下载地址：http://lbs.amap.c...
Android【学习心得】- 高德地图开发【覆盖物显示——Marker的使用（一）】【第十周】【更新完毕】
Android【学习心得】- 高德地图开发【第十周】【第八天】【周一】
使用高德地图时，通过搜索便可将地址搜索出来，但是想点击当前marker获取当前的经纬度和具体地址时，如下图：
AMap.event.addListener(autocomplete, &sele...
当点击高德地图的overlay时，弹出个view，
在高德地图中自定义marker点击弹窗的气泡效果，去除高德全是的气泡框体
他的最新文章
讲师：王哲涵
讲师：韦玮
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)Android高德地图自定义Markers的例子
之前的博客里说了地图的嵌入和定位，今天就说说在地图上显示一些我们想要的。在地图中有自带的Markers（标记），但是它只显示一个椭圆的图标，一般是不符合我们的需求的，这样就要我们自己来自定义。首先标记有下面一些属性;
1.position(Required) 在地图上标记位置的经纬度值。参数不能为空。
2.title 当用户点击标记，在信息窗口上显示的字符串。
3.snippet 附加文本，显示在标题下方。
4.draggable 如果您允许用户可以自由移动标记，设置为“ true ”。默认情况下为“ false ”。
5.visible 设置“ false ”，标记不可见。默认情况下为“ true ”。
6.anchor图标摆放在地图上的基准点。默认情况下，锚点是从图片下沿的中间处。
7.perspective设置 true，标记有近大远小效果。默认情况下为 false。
8.可以通过Marker.setRotateAngle() 方法设置标记的旋转角度，从正北开始，逆时针。如设置旋转90度，Marker.setRotateAngle(90)
9.通过setFlat() 方法设置标志是否贴地显示
自定义图标通常由 BitmapDescriptor 设置。我们可以在类 BitmapDescriptorFactory 使用以下其中一种方法定义。
1.fromAsset(String assetName) 在 assets 目录中使用图像创建自定义标记。
2.fromBitmap (Bitmap image) 使用位图图像创建自定义标记。
3.fromFile (String path) 指定路径的文件创建自定义图标。
4.fromResource (int resourceId) 使用已经存在的资源创建自定义图标。
先看一下要实现的效果：
地图自带标记
实现思路是：自定义布局，获取数据填入相应位置，然后将view转成Bitmap，调用AMap.addMarker(markerOptions) 方法添加到地图上。
自定义布局并填充数据：
for (int i = 0; i & positionEneityList.size(); i++) {
if (positionEneityList.get(i).getType().equals("1")) {
View view = View.inflate(getActivity(),R.layout.view_day, null);
TextView tv_price = (TextView) view.findViewById(R.id.tv_price);
TextView tv_price_status = (TextView) view.findViewById(R.id.tv_price_status);
tv_price.setText(positionEneityList.get(i).getPrice());
tv_price_status.setText("元/时");
Bitmap bitmap = CommentActivity.convertViewToBitmap(view);
drawMarkerOnMap(new LatLng(Double.parseDouble(positionEneityList.get(i).getLatitude())
, Double.parseDouble(positionEneityList.get(i).getLongitude())), bitmap, positionEneityList.get(i).getId());
2.转成Bitmap：
//view 转bitmap
public static Bitmap convertViewToBitmap(View view) {
view.measure(View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED), View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED));
view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
view.buildDrawingCache();
Bitmap bitmap = view.getDrawingCache();
3.添加到地图上：
* 在地图上画marker
* @param point
marker坐标点位置（example:LatLng point = new LatLng(39.963175,
116.400244); ）
* @param markerIcon 图标
* @return Marker对象
private Marker drawMarkerOnMap(LatLng point, Bitmap markerIcon, String id) {
if (aMap != null && point != null) {
Marker marker = aMap.addMarker(new MarkerOptions().anchor(0.5f, 1)
.position(point)
.title(id)
.icon(BitmapDescriptorFactory.fromBitmap(markerIcon)));
这样就实现了上述效果。后使用快捷导航没有帐号？
暂时没有人问过相似的问题，你可以做第一个提问题的人
查看: 10690|回复: 15
请问如何在地图框固定位置显示一个不随地图移动的marker？
十分感谢。想在地图的中心位置显示一个marker，但是拖动地图的时候不随地图移动，只停留在地图框的中心就可以。
var cr=new BMap.CopyrightControl({anchor:BMAP_ANCHOR_TOP_LEFT,offset:new BMap.Size(150,100)});
map.addControl(cr);
cr.addCopyright({id:1,content:&&img src='./images/baidu.png' style='width:20' /&&});
统一回复各位~
& & & & var map = new BMap.Map(&allmap&);
& & & & var point = new BMap.Point(116.404, 39.915);
& & & & map.centerAndZoom(point, 15);
& & & & var marker = new BMap.Marker(point);&&// 创建标注
& & & & map.addOverlay(marker);& && && && && &// 将标注添加到地图中
& & & & map.addEventListener('ondragging', function(){
&&& & & & & & & & marker.setPosition(map.getCenter());
&&& & & & });
直接自己画一个上去不就行了啊。。。。
强烈关注！
这个问题有点自相矛盾啊。首先说不让marker移动，但是又说地图移动的时候，还要marker停留在地图中心，那不还是得移动吗？建议：地图移动的时候，实时改变marker的经纬度坐标为地图中心点坐标。
我的做法是在百度地图的状态改变监听器中不停的修改Dot的位置，不知道有没有更高明的做法。
楼主参考下，有更好的方法也请赐教~mBaiduMap.setOnMapStatusChangeListener(new OnMapStatusChangeListener(){
& & & & & & & & & & & & @Override
& & & & & & & & & & & & public void onMapStatusChange(MapStatus arg0) {
& & & & & & & & & & & & & & & & // TODO Auto-generated method stub
& & & & & & & & & & & & & & & & //将屏幕中心240，240位置的点转换为的经纬度ll
& && && && && && && && && && && && && && && && && && & LatLng ll = mBaiduMap.getProjection()
& && && && && && && && && && && && && && && && && && && && && && && && && && & .fromScreenLocation(new Point(240,300));
& && && && && && && && && && && && && && && && && &&&//重新设置中心的位置，centerMarker为已经添加到地图的Dot
& & & & & & & && && && && && && && & centerDot.setCenter(ll);
& & & & & & & & & & & & & & & &
& & & & & & & & & & & & }
& & & & & & & & & & & & @Override
& & & & & & & & & & & & public void onMapStatusChangeFinish(MapStatus arg0) {
& & & & & & & & & & & & & & & & // TODO Auto-generated method stub
& & & & & & & & & & & & }
& & & & & & & & & & & & @Override
& & & & & & & & & & & & public void onMapStatusChangeStart(MapStatus arg0) {
& & & & & & & & & & & & & & & & // TODO Auto-generated method stub
& & & & & & & & & & & & }
& & & & & & & & });
& && &&&//initMyLocation();
& & & & }复制代码
我现在也想地图移动的时候，实时改变marker的经纬度坐标为地图中心点坐标。可以不知道怎么做 我是用在网页上的 是用的百度api js版本的&&
我现在也在做这个功能，请问楼主实现了吗？
本帖最后由 ahgo2005 于
21:32 编辑
统一回复各位~
& && &&&var map = new BMap.Map(&allmap&);
& && &&&var point = new BMap.Point(116.404, 39.915);
多谢版主!更新下,版主的是移动时就开始定位到地图中心,移动结束后,位置就变了.下次开始移动时,才回到中心.
下面的是移动结束后更新marker点位置
var map = new BMap.Map(&allmap&);
& && &&&var point = new BMap.Point(116.404, 39.915);
& && &&&map.centerAndZoom(point, 15);
& && &&&var marker = new BMap.Marker(point);&&// 创建标注
& && &&&map.addOverlay(marker);& && && && && &// 将标注添加到地图中
& && &&&map.addEventListener('dragend', function(){& & //移动结束后定位
& && && && && && &marker.setPosition(map.getCenter());
& && && & });
美图上外卖就是这么定位的,口碑上的实时移动还在摸索...
顺便问下版主,addEventListener能监听哪些事件...api里面没找到
多谢版主!更新下,版主的是移动时就开始定位到地图中心,移动结束后,位置就变了.下次开始移动时,才回到中心. ...
类参考里面有啊
我的做法是在百度地图的状态改变监听器中不停的修改Dot的位置，不知道有没有更高明的做法。
楼主参考下，有 ...
这是android代码吧，我想要一个javascript的，不知道怎么实现
统一回复各位~
& & & & var map = new BMap.Map(&allmap&);
& & & & var point = new BMap.Point(116.404, 39.915);
这个方法在页面上显示会出现明显的卡顿现象，并没有微信里面的那种很流畅的效果，有改进方法吗？
这个需求跟control比较像，固定在页面上。所以我刚实现了一个自定义的control。
这个需求跟control比较像，固定在页面上。所以我刚实现了一个自定义的control。 ...
确实是，control的特点就是固定不动的。如果您原因分享出来就更好了~
确实是，control的特点就是固定不动的。如果您原因分享出来就更好了~
看例子就可以了。
后来我决定直接用自带的Copyright那个控件，就显示几个字嘛
Powered by问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
当地图多标注marker点的时候，切换位置，前面位置的marker点出现一直悬浮到窗口边上,出现概率不算太大，但是会出现，不知道是什么原因，需要刷新地图吗
就像这两张图片
左边本身就三个标注
我在这个位置多缩放几次
就变成右边的那个图了
其他地方的标注都跑到这屏幕中央了
有没有大神指导什么原因，急急急，提前谢谢了
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
暂时用笨方法解决了
每次都重绘一下
肯定很耗性能
同步到新浪微博
分享到微博？
Hi，欢迎来到 SegmentFault 技术社区！⊙▽⊙ 在这里，你可以提出编程相关的疑惑，关注感兴趣的问题，对认可的回答投赞同票；大家会帮你解决编程的问题，和你探讨技术更新，为你的回答投上赞同票。
明天提醒我
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：}