共享单车轨迹界面如:小黄车和摩拜单车界面布局采用的是高德地图,并且每个轨迹线段都是有对应的地图纹理
首先,我们在高德地图开发环境下进行地图线段纹理开发需要明确几个前提:
- 线段添加纹理根据官方文档是在PolylienOptions 类中进行设置
- PolylienOptions 类所在的包是:com.amap.api.maps.model.PolylineOptions;
- 对于com.amap.api.maps2d.AMap所对应的AMap中也有一个PolylienOptions 类,但是该类不能进行纹理的设置
官方文档说明如下:
名称 | 说明 |
---|---|
setCustomTexture(BitmapDescriptor customTexture) | 设置线段的纹理,建议纹理资源长宽均为2的n次方 |
setCustomTextureIndex(java.util.List custemTextureIndexs) | 设置分段纹理index数组 |
setCustomTextureList(java.util.List customTextureList) | 设置分段纹理list |
setDottedLine(boolean isDottedLine) | 设置是否画虚线,默认为false,画实线 |
setUseTexture(boolean useTexture) | 是否使用纹理贴图 |
useGradient(boolean useGradient) | 设置是否使用渐变色 |
visible(boolean isVisible) | 设置线段的可见性 |
width(float width) | 设置线段的宽度,单位像素 |
zIndex(float zIndex) | 设置线段Z轴的值 |
首先,你需要你自己的纹理图。如下三个纹理图片
代码开发:
将纹理图片放置到Asset文件目录下面
工具类代码如下:
/**
* Created by adminZPH on 2017/4/14.
* 设置线条中的纹理的方法
* @return PolylineOptions
* */
public static PolylineOptions GetPolylineOptions(){
//添加纹理图片
List<BitmapDescriptor> textureList = new ArrayList<BitmapDescriptor>();
BitmapDescriptor mRedTexture = BitmapDescriptorFactory
.fromAsset("icon_road_red_arrow.png");
BitmapDescriptor mBlueTexture = BitmapDescriptorFactory
.fromAsset("icon_road_blue_arrow.png");
BitmapDescriptor mGreenTexture = BitmapDescriptorFactory
.fromAsset("icon_road_green_arrow.png");
textureList.add(mRedTexture);
textureList.add(mBlueTexture);
textureList.add(mGreenTexture);
// 添加纹理图片对应的顺序
List<Integer> textureIndexs = new ArrayList<Integer>();
textureIndexs.add(0);
textureIndexs.add(1);
textureIndexs.add(2);
PolylineOptions polylienOptions=new PolylineOptions();
polylienOptions.setCustomTextureList(textureList);
polylienOptions.setCustomTextureIndex(textureIndexs);
polylienOptions.setUseTexture(true);
polylienOptions.width(7.0f);
return polylienOptions;
}
上面方法用来返回一个polylienOptions,如果你有N个经纬度点的话,需要在地图上两两连线添加纹理显示,就可直接使用
比如:
for (int i =0; i < a.size() - 1; ++i) {
amap.addPolyline(GetPolylineOptions()).add(
new LatLng(a.get(i).getLatLonPoint().getLatitude(), a.get(i).getLatLonPoint().getLongitude()),
new LatLng(a.get(i + 1).getLatLonPoint().getLatitude(), a.get(i + 1).getLatLonPoint().getLongitude())
);
}
通过上述就可以实现,具体业务逻辑具体编写。
这片海 2017.04.14 13:06