如何折线路径动画谷歌地图v2的标志?折线、路径、标志、地图

2023-09-08 08:48:37 作者:素锦.

我使用谷歌地图V2,并把2个标记在地图上已建立一个应用程序。第一标记是获取用户当前的位置,并且所述第二标记是用户的目标位置。然后我去添加$ C $℃聚方法来绘制这些标记之间的线。我还要补充的方法来提供有关持续时间的用户信息,使用警告对话框开始地址和目的地址。

I already build an app using google maps V2 and put 2 markers on the map. First marker is to get user current location, and the second marker is user destination location. And then I add decodePoly method to draw line between those markers. I also add method to give user information about durations,start address and destination address using alert dialog.

所以,当我点击第二个标志,我想该标记动画为运行首先标记。但我的问题是,第二个标志是不动的折线路径。你可以在下面的图片看到:

So, when I click the second marker, i want to animate that marker to "move" to first marker. But my problem is, the second marker is not moving on the polyline path. you can see at image below:

这是MapActivity.java:

This is MapActivity.java:

@Override
public boolean onMarkerClick(Marker arg0) { // if user click the first marker 

    if(this.lokasi_asli.equals(arg0)){
        AlertDialog.Builder alert = new AlertDialog.Builder(MapActivity.this);
        alert.setTitle("First Position")
            .setIcon(R.drawable.ic_launcher)
            .setCancelable(true)
            .setMessage("First Position : " + "\n" + loc_a)
            .setPositiveButton("Yes", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {

                    dialog.dismiss();
                }
            })
            .setNegativeButton("No", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {

                    dialog.dismiss();
                }
            });
        alert.show();
    } else if (this.lokasi_tujuan.equals(arg0)) { //if user click second marker
        final boolean hideMarker = false;
        final Handler handler = new Handler();
        final long start = SystemClock.uptimeMillis();
        Projection proj = gmap.getProjection();
        Point startPoint = proj.toScreenLocation(lokasi_tujuan.getPosition());
        final LatLng startLatLng = proj.fromScreenLocation(startPoint);
        final long duration = 5000;
        final Interpolator interpolator = new LinearInterpolator();
        handler.post(new Runnable() {

            @Override
            public void run() {
                long elapsed = SystemClock.uptimeMillis() - start;
                float t = interpolator.getInterpolation((float) elapsed / duration);
                double longid = t * lokasi_asli.getPosition().longitude + (1-t) * startLatLng.longitude;
                double latid = t * lokasi_asli.getPosition().latitude + (1-t) * startLatLng.latitude;
                lokasi_tujuan.setPosition(new LatLng(latid, longid));
                if(t < 1.0){
                    //
                    handler.postDelayed(this, 16);
                } else {
                    if(hideMarker){
                        lokasi_tujuan.setVisible(false);
                    } else {
                        lokasi_tujuan.setVisible(true);
                    }
                }
            }

        });

这是谷歌地图中获取数据:

fetch data from google map:

@Override
    protected void onPostExecute(Void result){
        super.onPostExecute(result);
        if(doc != null){
            NodeList _nodelist = doc.getElementsByTagName("status");
            Node node1 = _nodelist.item(0);
            String _status1 = node1.getChildNodes().item(0).getNodeValue();
            if(_status1.equalsIgnoreCase("OK"))
            {
                NodeList _nodelist_path = doc.getElementsByTagName("overview_polyline");
                Node node_path = _nodelist_path.item(0);
                Element _status_path = (Element)node_path;
                NodeList _nodelist_destination_path = _status_path.getElementsByTagName("points");
                Node _nodelist_dest = _nodelist_destination_path.item(0);
                String _path = _nodelist_dest.getChildNodes().item(0).getNodeValue();
                List<LatLng> directionPoint = decodePoly(_path);

                PolylineOptions rectLine = new PolylineOptions().width(10).color(Color.RED).geodesic(true);
                for (int i = 0; i < directionPoint.size(); i++) 
                {
                    rectLine.add(directionPoint.get(i));
                }

                gmap.addPolyline(rectLine);
                mark_opt.position(new LatLng(dest_lat, dest_long));
                mark_opt.draggable(true);
                mark_opt.icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_BLUE));
                lokasi_tujuan = gmap.addMarker(mark_opt);
            } else {
                Toast.makeText(MapActivity.this, "Maaf, Tidak dapat menemukan rute tujuan\nCoba pilih rute lain yang mendekati", Toast.LENGTH_LONG).show();
            }
            progres_dlg.dismiss();
            }
        }
    }

我怎样才能使多段线路径上的第二个标志举动? 任何意见或帮助将是很大的AP preciated。 环境:Windows 7中,Eclipse中,Genymotion

How can i make the second marker move on the polyline path?? Any ideas or help would be greatly appreciated. Environment : Windows 7, Eclipse, Genymotion.

推荐答案

看看这表明,如何在地图上的路线标记的动画教程。它还提供了code在GitHub上也,你可以尝试一下。

Check out the tutorial which shows that how to animate marker on the map route. It also provides the code in GitHub also which you can try out.

点击这里

希望这会引导你。

 
精彩推荐
图片推荐