Google 地图 Android API v2 - 折线上的信息窗口?
Google map Android API v2 - InfoWindow on polyline?
我正在地图上绘制 polyline
,我现在需要向用户显示一些数据。
如何在每个 polyline
上绘制文本或信息窗口?
我添加 polyline
喜欢 :
ArrayList<LatLng> points = null;
PolylineOptions lineOptions = null;
MarkerOptions markerOptions = new MarkerOptions();
// Traversing through all the routes
for(int i=0;i<result.size();i++){
points = new ArrayList<LatLng>();
lineOptions = new PolylineOptions();
String color = colors[i % colors.length];
// Fetching i-th route
List<HashMap<String, String>> path = result.get(i);
// Fetching all the points in i-th route
for(int j=0;j<path.size();j++){
HashMap<String,String> point = path.get(j);
double lat = Double.parseDouble(point.get("lat"));
double lng = Double.parseDouble(point.get("lng"));
LatLng position = new LatLng(lat, lng);
points.add(position);
}
// Adding all the points in the route to LineOptions
lineOptions.addAll(points);
lineOptions.width(5);
lineOptions.color(Color.parseColor(color));
// Drawing polyline in the Google Map for the i-th route
mMap.addPolyline(lineOptions);
}
例如我需要这样:
我通过在折线上创建一个不可见的标记然后显示其信息来做到这一点 window。例如:
//use a transparent 1px & 1px box as your marker
BitmapDescriptor transparent = BitmapDescriptorFactory.fromResource(R.drawable.transparent);
MarkerOptions options = new MarkerOptions()
.position(new LatLng(someLatitide, someLongitude))
.title(someTitle)
.snippet(someSnippet)
.icon(transparent)
.anchor((float) 0.5, (float) 0.5); //puts the info window on the polyline
Marker marker = mMap.addMarker(options);
//open the marker's info window
marker.showInfoWindow();
更新以包含触摸折线和打开信息的一般方法window:
1. 实现一个 OnMapClickListener
2. 在 onMapClick 事件中,确定用户是否触摸了多段线。为此,我将折线点存储在四叉树中,并在四叉树中搜索距离用户触摸屏幕最近的点。如果距离在某个阈值内(即接近折线),请创建上面引用的不可见标记并打开其信息 window。如果触摸不在阈值内,则忽略 onMapClick 事件。
3. 在下一个 onMapClick 事件中删除之前创建的不可见标记,这样就不会有一堆不可见标记占用内存。希望对您有所帮助。
使用Google方向API获取路线并绘制折线
在Map中添加OnPolylineClickListener并使用getTag获取引用
mMap.setOnPolylineClickListener(new GoogleMap.OnPolylineClickListener() {
@Override
public void onPolylineClick(Polyline polyline) {
Log.e("Polyline position", " -- " + polyline.getTag());
onButtonShowPopupWindowClick(" " + polyline.getTag());
}
});
使用 setTag 方法在多段线中设置任何引用
Polyline line = mMap.addPolyline(lineOptions);
line.setTag("" + i);
line.setClickable(true);
点击折线打开PopupWindow
public 无效 onButtonShowPopupWindowClick(字符串计数){
String[] timeDistance = count.split(",");
// get a reference to the already created main layout
LinearLayout mainLayout = (LinearLayout)
findViewById(R.id.whole_layout);
// inflate the layout of the popup window
LayoutInflater inflater = (LayoutInflater)
getSystemService(LAYOUT_INFLATER_SERVICE);
View popupView = inflater.inflate(R.layout.polyline_window, null);
((TextView) popupView.findViewById(R.id.time)).setText("30 mins");
((TextView) popupView.findViewById(R.id.distance)).setText("20 km");
// create the popup window
int width = LinearLayout.LayoutParams.WRAP_CONTENT;
int height = LinearLayout.LayoutParams.WRAP_CONTENT;
boolean focusable = true; // lets taps outside the popup also dismiss it
final PopupWindow popupWindow = new PopupWindow(popupView, width, height, focusable);
// show the popup window
popupWindow.showAtLocation(mainLayout, Gravity.CENTER, 0, 0);
// dismiss the popup window when touched
popupView.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
popupWindow.dismiss();
return true;
}
});
}
Hiren Patel
的最终解决方案
我已经用最简单的方法完成了,如下所示:
private GoogleMap mMap;
在 Google 地图上添加标记时:
LatLng mLatLng = new LatLng(YourLatitude, YourLongitude);
//transparent 1x1 drawable
BitmapDescriptor transparent = BitmapDescriptorFactory.fromResource(R.drawable.transparent_box_1dp);
// add marker
mMap.addMarker(new MarkerOptions().position(mLatLng).title("My Title").snippet("My Snippet"+"\n"+"1st Line Text"+"\n"+"2nd Line Text"+"\n"+"3rd Line Text").icon(transparent);
之后,在 Google 地图上放置下面的 InfoWindow 适配器代码,如果需要,在 onMapReady()
中:
mMap.setInfoWindowAdapter(new GoogleMap.InfoWindowAdapter() {
@Override
public View getInfoWindow(Marker arg0) {
return null;
}
@Override
public View getInfoContents(Marker marker) {
LinearLayout info = new LinearLayout(mContext);
info.setOrientation(LinearLayout.VERTICAL);
TextView title = new TextView(mContext);
title.setTextColor(Color.BLACK);
title.setGravity(Gravity.CENTER);
title.setTypeface(null, Typeface.BOLD);
title.setText(marker.getTitle());
TextView snippet = new TextView(mContext);
snippet.setTextColor(Color.GRAY);
snippet.setText(marker.getSnippet());
info.addView(title);
info.addView(snippet);
return info;
}
});
我正在地图上绘制 polyline
,我现在需要向用户显示一些数据。
如何在每个 polyline
上绘制文本或信息窗口?
我添加 polyline
喜欢 :
ArrayList<LatLng> points = null;
PolylineOptions lineOptions = null;
MarkerOptions markerOptions = new MarkerOptions();
// Traversing through all the routes
for(int i=0;i<result.size();i++){
points = new ArrayList<LatLng>();
lineOptions = new PolylineOptions();
String color = colors[i % colors.length];
// Fetching i-th route
List<HashMap<String, String>> path = result.get(i);
// Fetching all the points in i-th route
for(int j=0;j<path.size();j++){
HashMap<String,String> point = path.get(j);
double lat = Double.parseDouble(point.get("lat"));
double lng = Double.parseDouble(point.get("lng"));
LatLng position = new LatLng(lat, lng);
points.add(position);
}
// Adding all the points in the route to LineOptions
lineOptions.addAll(points);
lineOptions.width(5);
lineOptions.color(Color.parseColor(color));
// Drawing polyline in the Google Map for the i-th route
mMap.addPolyline(lineOptions);
}
例如我需要这样:
我通过在折线上创建一个不可见的标记然后显示其信息来做到这一点 window。例如:
//use a transparent 1px & 1px box as your marker
BitmapDescriptor transparent = BitmapDescriptorFactory.fromResource(R.drawable.transparent);
MarkerOptions options = new MarkerOptions()
.position(new LatLng(someLatitide, someLongitude))
.title(someTitle)
.snippet(someSnippet)
.icon(transparent)
.anchor((float) 0.5, (float) 0.5); //puts the info window on the polyline
Marker marker = mMap.addMarker(options);
//open the marker's info window
marker.showInfoWindow();
更新以包含触摸折线和打开信息的一般方法window: 1. 实现一个 OnMapClickListener 2. 在 onMapClick 事件中,确定用户是否触摸了多段线。为此,我将折线点存储在四叉树中,并在四叉树中搜索距离用户触摸屏幕最近的点。如果距离在某个阈值内(即接近折线),请创建上面引用的不可见标记并打开其信息 window。如果触摸不在阈值内,则忽略 onMapClick 事件。 3. 在下一个 onMapClick 事件中删除之前创建的不可见标记,这样就不会有一堆不可见标记占用内存。希望对您有所帮助。
使用Google方向API获取路线并绘制折线
在Map中添加OnPolylineClickListener并使用getTag获取引用
mMap.setOnPolylineClickListener(new GoogleMap.OnPolylineClickListener() {
@Override
public void onPolylineClick(Polyline polyline) {
Log.e("Polyline position", " -- " + polyline.getTag());
onButtonShowPopupWindowClick(" " + polyline.getTag());
}
});
使用 setTag 方法在多段线中设置任何引用
Polyline line = mMap.addPolyline(lineOptions);
line.setTag("" + i);
line.setClickable(true);
点击折线打开PopupWindow
public 无效 onButtonShowPopupWindowClick(字符串计数){
String[] timeDistance = count.split(",");
// get a reference to the already created main layout
LinearLayout mainLayout = (LinearLayout)
findViewById(R.id.whole_layout);
// inflate the layout of the popup window
LayoutInflater inflater = (LayoutInflater)
getSystemService(LAYOUT_INFLATER_SERVICE);
View popupView = inflater.inflate(R.layout.polyline_window, null);
((TextView) popupView.findViewById(R.id.time)).setText("30 mins");
((TextView) popupView.findViewById(R.id.distance)).setText("20 km");
// create the popup window
int width = LinearLayout.LayoutParams.WRAP_CONTENT;
int height = LinearLayout.LayoutParams.WRAP_CONTENT;
boolean focusable = true; // lets taps outside the popup also dismiss it
final PopupWindow popupWindow = new PopupWindow(popupView, width, height, focusable);
// show the popup window
popupWindow.showAtLocation(mainLayout, Gravity.CENTER, 0, 0);
// dismiss the popup window when touched
popupView.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
popupWindow.dismiss();
return true;
}
});
}
Hiren Patel
的最终解决方案我已经用最简单的方法完成了,如下所示:
private GoogleMap mMap;
在 Google 地图上添加标记时:
LatLng mLatLng = new LatLng(YourLatitude, YourLongitude);
//transparent 1x1 drawable
BitmapDescriptor transparent = BitmapDescriptorFactory.fromResource(R.drawable.transparent_box_1dp);
// add marker
mMap.addMarker(new MarkerOptions().position(mLatLng).title("My Title").snippet("My Snippet"+"\n"+"1st Line Text"+"\n"+"2nd Line Text"+"\n"+"3rd Line Text").icon(transparent);
之后,在 Google 地图上放置下面的 InfoWindow 适配器代码,如果需要,在 onMapReady()
中:
mMap.setInfoWindowAdapter(new GoogleMap.InfoWindowAdapter() {
@Override
public View getInfoWindow(Marker arg0) {
return null;
}
@Override
public View getInfoContents(Marker marker) {
LinearLayout info = new LinearLayout(mContext);
info.setOrientation(LinearLayout.VERTICAL);
TextView title = new TextView(mContext);
title.setTextColor(Color.BLACK);
title.setGravity(Gravity.CENTER);
title.setTypeface(null, Typeface.BOLD);
title.setText(marker.getTitle());
TextView snippet = new TextView(mContext);
snippet.setTextColor(Color.GRAY);
snippet.setText(marker.getSnippet());
info.addView(title);
info.addView(snippet);
return info;
}
});