php - Add infowindow on google map with multiple waypoints -


i creating multiple route between multiple source , destination, route created working fine want display info window custom text source , destination, tried many code not getting success

below code

            <script type="text/javascript">              var my={directionssvc:new google.maps.directionsservice(),             maps:{},             routes:{}};              /**             * base-class                  * @param points optional array array of lat+lng-values defining route             * @return object route             **/                                  function route(points)             {             this.origin       = null;             this.destination  = null;             this.waypoints    = [];             if(points && points.length>1)             {             this.setpoints(points);             }             return this;              };              /**             *  draws route on map              *                           * @param map object google.maps.map              * @return object route             **/                                 route.prototype.drawroute = function(map)             {             var _this=this;             my.directionssvc.route(             {'origin': this.origin,             'destination': this.destination,             'waypoints': this.waypoints,             'travelmode': google.maps.directionstravelmode.driving             },              function(res,sts)              {             if(sts==google.maps.directionsstatus.ok){             if(!_this.directionsrenderer)             {             _this.directionsrenderer              = new google.maps.directionsrenderer({ 'draggable':false });              }             _this.directionsrenderer.setmap(map);             _this.directionsrenderer.setdirections(res);              google.maps.event.addlistener(_this.directionsrenderer,             'directions_changed',             function()             {             _this.setpoints();             }             );             google.maps.event.addlistener(marker, 'click', (function(res, i) {             return function() {             infowindow.setcontent("hi");             infowindow.open(res, marker);             }              })(res, i));             }                });             return _this;             };              /**             * sets map directionsrenderer                  * @param map object google.maps.map             **/                          route.prototype.setgmap = function(map){             this.directionsrenderer.setmap(map);             };              /**             * sets origin, destination , waypoints route              * directionsresult or points-param when passed                 *              * @param points optional array array of lat+lng-values defining route             * @return object route                     **/             route.prototype.setpoints = function(points)             {             this.origin = null;             this.destination = null;             this.waypoints = [];             if(points)             {             for(var p=0;p<points.length;++p)             {             this.waypoints.push({location:new google.maps.latlng(points[p][0],                points[p][1]),             stopover:false});             }             this.origin=this.waypoints.shift().location;             this.destination=this.waypoints.pop().location;             }             else             {             var route=this.directionsrenderer.getdirections().routes[0];              for(var l=0;l<route.legs.length;++l)             {             if(!this.origin)this.origin=route.legs[l].start_location;             this.destination = route.legs[l].end_location;              for(var w=0;w<route.legs[l].via_waypoints.length;++w)             {             this.waypoints.push({location:route.legs[l].via_waypoints[w],             stopover:false});             }             }             //the route has been modified user when you're here             //you may call this.getpoints() , work result             }              return this;             };              /**             * retrieves points route              *                      * @return array                      **/             route.prototype.getpoints = function()             {             var points=[[this.origin.lat(),this.origin.lng()]];              for(var w=0;w<this.waypoints.length;++w)             {             points.push([this.waypoints[w].location.lat(),             this.waypoints[w].location.lng()]);             }              points.push([this.destination.lat(),             this.destination.lng()]);             return points;             };               function initialize()              {             bounds = new google.maps.latlngbounds(), markers=[], alternatemarkers=[], markersicon=[];             var latlonpos=new google.maps.latlng(-34.397, 150.644)              var myoptions = {             zoom: 0,             position:latlonpos,             maptypeid: google.maps.maptypeid.roadmap             };             my.maps.map1 = new google.maps.map(document.getelementbyid('map_canvas'),             myoptions);             /*my.maps.map2 = new google.maps.map(document.getelementbyid('map_canvas2'),             myoptions);             */                   my.maps.map1.fitbounds(bounds);              my.routes.r0 = new route([             ['22.6925763','75.8676338'],             ['22.7197596','75.8570266'],             ]).drawroute(my.maps.map1);               my.routes.r1 = new route([             ['22.7195687','75.8577258'],             ['23.2599333','77.412615'],             ]).drawroute(my.maps.map1);               my.routes.r2 = new route([             ['36.4703232','-86.6513845'],             ['34.0522342','-118.2436849'],             ]).drawroute(my.maps.map1);               my.routes.r3 = new route([             ['36.4703232','-86.6513845'],             ['34.0522342','-118.2436849'],             ]).drawroute(my.maps.map1);               my.routes.r4 = new route([             ['-33.864174','151.2052868'],             ['-37.4713077','144.7851531'],             ]).drawroute(my.maps.map1);               bounds.extend(latlonpos);             my.routes.rx=new route();             }              google.maps.event.adddomlistener(window, 'load', initialize);             function fx(route)             {             var points=my.routes[route].getpoints();             // alert('copying route '+route+'\n__________\n'+points.join('\n'));             my.routes.rx.setpoints(points).drawroute(my.maps.map2);             }              </script> 


Comments

Popular posts from this blog

Java 3D LWJGL collision -

spring - SubProtocolWebSocketHandler - No handlers -

methods - python can't use function in submodule -