谷歌地图 Android API v2 - 折线上的信息窗口？

Posted 2023-04-14

【中文标题】谷歌地图 Android API v2 - 折线上的信息窗口？

【英文标题】：Google map Android API v2 - InfoWindow on polyline?

【发布时间】：2017-01-25 09:58:38

【问题描述】：

我正在地图上绘制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);

例如我需要这个：

【参考方案1】：

我通过在折线上创建一个不可见的标记然后显示其信息窗口来做到这一点。例如：

//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();

更新以包含触摸折线和打开信息窗口的一般方法： 1. 实现一个 OnMapClickListener 2. 在 onMapClick 事件中，判断用户是否触摸了折线。我通过将折线点存储在四叉树中并在四叉树中搜索用户触摸屏幕的最近点来做到这一点。如果距离在某个阈值内（即接近折线），则创建上面引用的不可见标记并打开其信息窗口。如果触摸不在阈值内，则忽略 onMapClick 事件。 3. 在下一个 onMapClick 事件中删除之前创建的不可见标记，这样您就不会有一堆不可见标记占用内存。希望对您有所帮助。

【讨论】：

我不需要在标记上设置信息，我需要在折线上设置，比如 google map android。

我明白这一点，但没有内置的方法可以做到这一点，因此您必须使用其他方法，例如在折线上创建一个不可见的标记并打开其信息窗口以使其看起来就像您为折线打开了一个信息窗口一样。请参阅上面我修改后的答案。

我试过了，但一次只显示一个 infoWindow。我们需要同时打开所有三个 infoWindow

【参考方案2】：

使用 Google Direction 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 void onButtonShowPopupWindowClick(String count)

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;
    
);

【参考方案3】：

Hiren Patel的终极解决方案

我已经完成了如下最简单的方法：

private GoogleMap mMap;

在谷歌地图上添加标记时：

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;
    
);