页面修改

src/components/global/tripMap.vue

@@ -82,37 +82,6 @@
                         center: center,
                         mapTypeId: google.maps.MapTypeId.ROADMAP
                     });
-                    // var polyOptions = {
-                    //     strokeColor: 'red',    // 颜色
-                    //     strokeOpacity: 1.0,    // 透明度
-                    //     strokeWeight: 2    // 宽度
-                    // }
-                    // let poly = new google.maps.Polyline(polyOptions);
-                    // poly.setMap(map);    // 装载
-                    // 遍历循环创建标记
-                    // this.locationArray.map(item=>{
-                    //   // let lat = parseFloat(item.lat)
-                    //   // let lng = parseFloat(item.lng)
-                    //   // var path = poly.getPath();    //获取线条的坐标
-                    //   // path.push(new google.maps.LatLng(lat, lng));
-                    //   let marker = new MarkerWithLabel({
-                    //     position: {lat:lat,lng:lng},
-                    //     // icon: '../../../static/img/qishou.png', //标记自定义图标
-                    //     draggable: false, //不可拖动
-                    //     map: map,   //地图实例 
-                    //     // labelContent: item.name,    //label的内容
-                    //     labelAnchor: new google.maps.Point(22, 100),    //label的位置，可以调
-                    //     // labelClass: "markers_labels", // the CSS class for the label
-                    //     // labelStyle: { background:'#fff',padding:'5px' }
-                    //   });
-                    //   //自定义信息窗口
-                    //   let iw = new google.maps.InfoWindow({
-                    //     content: `<div>
-                    //                 <p>景点名称：${item.name}</p>
-                    //               </div>`});
-                    //   //点击信息窗口显示
-                    //   google.maps.event.addListener(marker, "click", function (e) { iw.open(map, marker); });
-                    // })
                     this.directionsDisplay.setMap(this.map);
                     this.calcRoute()
                 }
@@ -149,29 +118,32 @@
                     let elng = parseFloat(endArray[1]);
                     let start = lat + ',' + lng;
                     let end = elat + ',' + elng;
-                    let request = { // 组装连线数据
-                        origin: start, // 起
-                        destination: end, // 止
-                        travelMode: google.maps.TravelMode.DRIVING,
-                        waypoints:[]
-                    };
-                    if (waypoints && waypoints.length > 0) {
-                        if (waypoints.length > 2) {
-                            waypoints.forEach((item, index) => {
-                                if (index != 0 && index != waypoints.length - 1) {
-                                    request.waypoints.push(item);
-                                }
-                            })
-                        } 
+                    // 线条设置
+                    var polyOptions = {
+                        strokeColor: '#000000', // 颜色
+                        strokeOpacity: 1.0, // 透明度
+                        strokeWeight: 2 // 宽度
+                    }
+                    var poly = new google.maps.Polyline(polyOptions);
+                    poly.setMap(_this.map); // 装载
+
+                    /* 循环标出所有坐标 */
+                    for (var i = 0; i < waypoints.length; i++) {
+                        var loc = waypoints[i].location.split(',');
+
+                        var path = poly.getPath(); //获取线条的坐标
+                        path.push(new google.maps.LatLng(loc[0], loc[1])); //为线条添加标记坐标
+                        //生成标记图标
+                        var marker = new google.maps.Marker({
+                            position: new google.maps.LatLng(loc[0], loc[1]),
+                            map: _this.map,
+                            icon: "http://labs.google.com/ridefinder/images/mm_20_green.png"
+                        });
+
+
                     }
-                    console.log(request, 'request')
-                    _this.directionsService.route(request, function (result, status) {
-                        if (status == google.maps.DirectionsStatus.OK) {
-                            _this.directionsDisplay.setDirections(result);
                 }
-                    });
             }
         },
-        },
     }
 </script>
\ No newline at end of file