Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/google-maps/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Google maps InfowWindow中的方向路线迷你地图_Google Maps_Google Maps Api 3 - Fatal编程技术网

Google maps InfowWindow中的方向路线迷你地图

Google maps InfowWindow中的方向路线迷你地图,google-maps,google-maps-api-3,Google Maps,Google Maps Api 3,我正在Google Map v3中工作(实际上是将V2迁移到v3),并尝试自定义方向服务的信息窗口。 我能够使用起点、目的地和航路点显示方向。 我的地图正确显示了带有标记的路线(带有A、B、C…文本的绿色标记)。 默认情况下,单击标记信息窗口将显示该标记的地址。 我想对它进行自定义,这样在单击标记时,它应该在信息窗口中以更大的缩放显示该位置的迷你地图。 我可以取得一些进展,但问题是, -标记更改为红色指向标记而不是绿色标记(带有A、B、C…文本) -无论单击哪个标记,信息窗口都将在最后一个标记上

我正在Google Map v3中工作(实际上是将V2迁移到v3),并尝试自定义方向服务的信息窗口。 我能够使用起点、目的地和航路点显示方向。 我的地图正确显示了带有标记的路线(带有A、B、C…文本的绿色标记)。 默认情况下,单击标记信息窗口将显示该标记的地址。 我想对它进行自定义,这样在单击标记时,它应该在信息窗口中以更大的缩放显示该位置的迷你地图。 我可以取得一些进展,但问题是, -标记更改为红色指向标记而不是绿色标记(带有A、B、C…文本) -无论单击哪个标记,信息窗口都将在最后一个标记上打开 -单击标记后,它将显示小地图,但在关闭并再次单击该标记时,它将显示地址(默认行为) -我的代码实际上是用红点标记覆盖绿色标记

soboby能帮我解决这些问题吗 下面是我的代码:

       function CreateDirection (arrWaypoints) {
            if (!this.directions) {
                this.directions = new google.maps.DirectionsService();

                var origin = arrWaypoints[0];
                var destination = arrWaypoints[arrWaypoints.length - 1];

                var tripWaypoints = [];

                for (var i = 1; i < arrWaypoints.length - 1; i++) {
                    tripWaypoints.push({
                        location: new google.maps.LatLng(arrWaypoints[i].hb,     arrWaypoints[i].ib),
                        stopover: true
                    });
                }

                var myMap = MyMap.getMap();
                var steps = [];

                this.directions.route({
                    origin: origin,
                    destination: destination,
                    waypoints: tripWaypoints,
                    travelMode: google.maps.DirectionsTravelMode.DRIVING,
                    unitSystem: google.maps.DirectionsUnitSystem.METRIC
                }, function(result, status) {
                    if (status == google.maps.DirectionsStatus.OK) {
                        directionsDisplay = new google.maps.DirectionsRenderer();

// directionDiv div element in my page                           

directionsDisplay.setPanel(document.getElementById("directionDiv"));
                        directionsDisplay.setMap(myMap);
                        directionsDisplay.setDirections(result);
                    }
                });
            }
        }

        function CreateMiniMapInfoWindow (wayPointsArray) {
            for (var i = 0; i < wayPointsArray.length; i++) {
                var myMap = MyMap.getMap();
                var marker = new google.maps.Marker({
                    position: wayPointsArray[i],
                    map: myMap
                });

                google.maps.event.addListener(marker, 'click', function() {

                var myOptionsMini = {
                    zoom: 14,
                    center: wayPointsArray[i],
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                }

               var infowindow = new google.maps.InfoWindow();
                    var minimap = new google.maps.Map(document.getElementById    ("minimap"), myOptionsMini);

                    document.getElementById("minimap").style.display = 'block';
                    minimap.setCenter(marker.getPosition());
                    var minimapDiv = document.getElementById("minimap");
                    infowindow.setContent(minimapDiv);
                    infowindow.open(myMap, marker);
                });
            }
        }
函数CreateDirection(arrWaypoints){
如果(!本说明){
this.directions=new google.maps.DirectionsService();
var原点=到达点[0];
var destination=arrWaypoints[arrWaypoints.length-1];
var tripWaypoints=[];
对于(变量i=1;i
我需要解决以下问题: -如何获得所有标记的自定义信息窗口(带有小地图) -如何把绿色标记与文本A,B,C。。。 所附图片是我从上述代码中得到的 我希望我的问题是清楚的。 如果有人有任何意见,请告诉我

谢谢,
Sharath

将以下对象作为参数传递给DirectionsRenderer:

{markerOptions:{clickable:false,zIndex:1000}}
它将产生两种效果:

  • 自定义标记将放置在DirectionsRenderer创建的A、B、C标记后面(当前它们仍然存在,但位于自定义标记后面)

  • DirectionsRenderer创建的标记不可单击,底层自定义标记可以接收单击

  • 另一个选项(我更喜欢):将DirectionsRenderer的
    suppressMarkers
    -选项设置为true,并将A、B、C标记用于自定义标记(例如,)

    与信息窗口相关:您只需要一个信息窗口,其中包含一张所有标记的地图。观察标记的单击事件,当它发生时,打开信息窗口并将地图居中放置在标记位置的信息窗口内(可通过
    this.getPosition()
    在单击回调中检索)


    注意:与其使用预定义的航路点,不如分析directionsService返回的路线,将自定义标记放置在准确的位置(这些位置可能不同于预定义的航路点)

    将以下对象作为参数传递给DirectionsRenderer:

    {markerOptions:{clickable:false,zIndex:1000}}
    
    它将产生两种效果:

  • 自定义标记将放置在DirectionsRenderer创建的A、B、C标记后面(当前它们仍然存在,但位于自定义标记后面)

  • DirectionsRenderer创建的标记不可单击,底层自定义标记可以接收单击

  • 另一个选项(我更喜欢):将DirectionsRenderer的
    suppressMarkers
    -选项设置为true,并将A、B、C标记用于自定义标记(例如,)

    与信息窗口相关:您只需要一个信息窗口,其中包含一张所有标记的地图。观察标记的单击事件,当它发生时,打开信息窗口并