如何使用谷歌地图API响应来在地图上显示驾车路线

Question

在收到来自谷歌方向API的以下响应后，我该如何像下面的图片一样在地图上显示驾驶路线？我该如何切换到街景视图？ 这是我的代码：

 RequestQueue queue = Volley.newRequestQueue(this);
        String url = "https://maps.googleapis.com/maps/api/directions/json?origin=Disneyland&destination=Universal+Studios+Hollywood4&key=AIzaSyBX40zJvRu0PBVs5iA0xG_cmdpVAUKYmmQ";
        // Request a string response from the provided URL.
        StringRequest stringRequest = new StringRequest(Request.Method.GET, url,
                new Response.Listener<String>() {
                    @Override
                    public void onResponse(String response) {
                        // Display the first 500 characters of the response string.
                        Log.e("Response is: ", response.toString());
                        ////////////////json response //////////
                        try {
                            String responseString;
                            JSONObject responseObject = (JSONObject) new JSONTokener(response.toString()).nextValue();
                            responseString = responseObject.getString("status");
                            JSONArray routesArray = responseObject.getJSONArray("routes");
                            JSONObject route = routesArray.getJSONObject(0);
                            JSONArray legs;
                            JSONObject leg;
                            JSONArray steps;
                            JSONObject dist;
                            Integer distance;
                            if (route.has("legs")) {
                                legs = route.getJSONArray("legs");
                                leg = legs.getJSONObject(0);
                                steps = leg.getJSONArray("steps");
                                int nsteps = steps.length();
                                for (int i = 0; i < nsteps; i++) {
                                    JSONObject step = steps.getJSONObject(i);
                                    if (step.has("distance")) {
                                        dist = (JSONObject) step.get("distance");
                                        if (dist.has("value"))
                                            distance = (Integer) dist.get("value");
                                    }
                                }
                            } else
                                responseString = "not found";
                        } catch (Exception e) {
                            e.printStackTrace();
                        }
                        ////////////////////////////

                    }
                }, new Response.ErrorListener() {
            @Override
            public void onErrorResponse(VolleyError error) {
                Log.e("Response is: ", "error");

            }
        });

这是响应：

{
   "geocoded_waypoints":[
      {
         "geocoder_status":"OK",
         "place_id":"ChIJRVY_etDX3IARGYLVpoq7f68",
         "types":[
            "bus_station",
            "establishment",
            "point_of_interest",
            "transit_station"
         ]
      },
      {
         "geocoder_status":"OK",
         "partial_match":true,
         "place_id":"ChIJE0RfH0m-woAROpQUDVXcp1A",
         "types":[
            "route"
         ]
      }
   ],
   "routes":[
      {
         "bounds":{
            "northeast":{
               "lat":34.1380726,
               "lng":-117.9143879
            },
            "southwest":{
               "lat":33.8068768,
               "lng":-118.3545268
            }
         },
         "copyrights":"Map data ©2016 Google",
         "legs":[
            {
               "distance":{
                  "text":"36.5 mi",
                  "value":58724
               },
               "duration":{
                  "text":"53 mins",
                  "value":3192
               },
               "end_address":"Studio way, North Hollywood, CA 91602, USA",
               "end_location":{
                  "lat":34.1378505,
                  "lng":-118.3545268
               },
               "start_address":"Disneyland (Harbor Blvd.), S Harbor Blvd, Anaheim, CA 92802, USA",
               "start_location":{
                  "lat":33.8098177,
                  "lng":-117.9154353
               },
               "steps":[
                  {
                     "distance":{
                        "text":"0.2 mi",
                        "value":310
                     },
                     "duration":{
                        "text":"1 min",
                        "value":79
                     },
                     "end_location":{
                        "lat":33.8070347,
                        "lng":-117.9154133
                     },
                     "html_instructions":"Head \u003cb\u003esouth\u003c/b\u003e on \u003cb\u003eS Harbor Blvd\u003c/b\u003e",
                     "polyline":{
                        "points":"knjmEnjunUNAb@@Z?RALA`@B~D?n@ChDA"
                     },
                     "start_location":{
                        "lat":33.8098177,
                        "lng":-117.9154353
                     },
                     "travel_mode":"DRIVING"
                  },
                  {
                     "distance":{
                        "text":"0.6 mi",
                        "value":1039
                     },
                     "duration":{
                        "text":"3 mins",
                        "value":195
                     },
                     "end_location":{
                        "lat":33.8159247,
                        "lng":-117.9152992
                     },
                     "html_instructions":"Make a \u003cb\u003eU-turn\u003c/b\u003e at \u003cb\u003eDisney Way\u003c/b\u003e",
                     "maneuver":"uturn-left",
                     "polyline":{
                        "points":"}|imEhjunU\\??_@]@cIBgC?Q@sD?wDEi@A{@?s@AqB?M@M?aB?oDB_@?y@?M?O?IAE?I?O?]?C?s@?{@@K?m@D"
                     },
                     "start_location":{
                        "lat":33.8070347,
                        "lng":-117.9154133
                     },
                     "travel_mode":"DRIVING"
                  },
                  {
                     "distance":{
                        "text":"22.9 mi",
                        "value":36928
                     },
                     "duration":{
                        "text":"27 mins",
                        "value":1593
                     },
                     "end_location":{
                        "lat":34.0255711,
                        "lng":-118.2060101
                     },
                     "html_instructions":"                     Take the ramp onto \u003cb\u003eI-5 N\u003c/b\u0

- Ahmed Esameddeen

Answer 1

你可以分析JSON响应并从中获取overview_polyline属性。在gradle文件中添加android map utils。

compile 'com.google.maps.android:android-maps-utils:0.4'

使用Android地图工具，您将拥有com.google.maps.android.PolyUtil类，它可以解码概述多段线属性中编码的多段线，并获取LatLng列表。

代码片段可能如下所示：

MapFragment mapFrag = (MapFragment)
            getFragmentManager().findFragmentById(R.id.route_map);
    if(mapFrag!=null && jsonRoute != null){
        mapFrag.getMapAsync(new OnMapReadyCallback() {
            @Override
            public void onMapReady(GoogleMap googleMap) {
                try {
                    if (jsonRoute.has("status") && jsonRoute.getString("status").equals("OK")) {
                        if (jsonRoute.has("routes")) {
                            JSONArray rts = jsonRoute.getJSONArray("routes");
                            if (rts != null && rts.length() > 0 && !rts.isNull(0)) {
                                JSONObject r = rts.getJSONObject(0);
                                if (r.has("overview_polyline") && !r.isNull("overview_polyline")) {
                                    JSONObject m_poly = r.getJSONObject("overview_polyline");
                                    if (m_poly.has("points") && !m_poly.isNull("points")) {
                                        String enc_points = m_poly.getString("points");
                                        List<LatLng> m_path = PolyUtil.decode(enc_points);
                                        PolylineOptions polyOptions = new PolylineOptions().addAll(m_path);
                                        googleMap.addPolyline(polyOptions);

                                        LatLngBounds.Builder builder = new LatLngBounds.Builder();
                                        for(LatLng coord : m_path){
                                            builder.include(coord);
                                        }
                                        LatLngBounds m_bounds = builder.build();
                                        googleMap.moveCamera(CameraUpdateFactory.newLatLngBounds(m_bounds, 10));
                                    }
                                }
                            }
                        }
                    }
                } catch (JSONException e) {
                    Log.e(LOG_TAG, "Cannot process directions JSON results", e);
                }
            }
        });
    }

希望能对您有所帮助！

- xomena