Estoy mirando para cambiar los iconos de marcadores cuando se utiliza el DirectionsRender en un mapa de google. He descubierto a partir de aquí cómo cambiar tanto los marcadores para el mismo icono, pero estoy buscando iconos personalizados tanto en los puntos de inicio y final. Alguna idea?

Edit: estoy buscando la manera de asignar iconos separados para los marcadores de inicio y fin. Sé cómo cambiarlo para tanto, pero que tienen diferentes iconos de marcadores está resultando difícil.

InformationsquelleAutor Corey Hart | 2011-01-27

2 Comentarios

  1. 66

    Para aquellos que necesitan un ejemplo como yo lo hice, he aquí una básica:

     //Map and directions objects
    var map = new google.maps.Map( element, options );
    var service = new google.maps.DirectionsService();
    var directions = new google.maps.DirectionsRenderer({suppressMarkers: true});
    //Start/Finish icons
    var icons = {
    start: new google.maps.MarkerImage(
    //URL
    'start.png',
    //(width,height)
    new google.maps.Size( 44, 32 ),
    //The origin point (x,y)
    new google.maps.Point( 0, 0 ),
    //The anchor point (x,y)
    new google.maps.Point( 22, 32 )
    ),
    end: new google.maps.MarkerImage(
    //URL
    'end.png',
    //(width,height)
    new google.maps.Size( 44, 32 ),
    //The origin point (x,y)
    new google.maps.Point( 0, 0 ),
    //The anchor point (x,y)
    new google.maps.Point( 22, 32 )
    )
    };
    service.route( { origin: origin, destination: destination }, function( response, status ) {
    if ( status == google.maps.DirectionsStatus.OK ) {
    display.setDirections( response );
    var leg = response.routes[ 0 ].legs[ 0 ];
    makeMarker( leg.start_location, icons.start, "title" );
    makeMarker( leg.end_location, icons.end, 'title' );
    }
    });
    function makeMarker( position, icon, title ) {
    new google.maps.Marker({
    position: position,
    map: map,
    icon: icon,
    title: title
    });
    }

    La respuesta de una ruta devuelve la solicitud de una pierna(s) en función del número de paradas en la ruta. Sólo estoy haciendo una a a B de la ruta, así que tome la primera a la pierna, y obtener la posición de donde los marcadores necesidad de ir, y crear marcadores para esos lugares.

    • Lo que sobre de cambiar los marcadores dentro de las instrucciones a sí mismos?
    • Sí, buena pregunta!
    • He añadido la funcionalidad para borrar todos los marcadores antes de calcular las direcciones para el 2º tiempo. Véase también developers.google.com/maps/documentation/javascript/examples/…
    • ¿cómo puedo ocultar el marcador de viejo ? causa de los nuevos marcadores es succssefuly añadido, pero el a y B marcador showd también :((
    • Mira la directions variable. {suppressMarkers: true} apaga los marcadores por defecto.
    • El cambio de los marcadores en las instrucciones del panel fue en realidad más fácil de lo esperado (especialmente con jQuery). La imagen tiene la clase adp-marker, por lo que sólo puede establecer que el atributo src del elemento a la misma url como su marcador icono de la misma. Si quieres personalizar las ventanas de información, el uso de suppresInfoWindows: true. Buscar adp-placemark elementos y cambiar el evento click para su padre para abrir su propia ventana de información.
    • Se puede hacer un JS Violín para esta aplicación en realidad he probado este código, pero no pude agregar etiquetas para el marcador
    • ¿Por qué no pasar mapa para makeMarker?
    • Los marcadores no están alineando perfectamente con los extremos de la polilínea como los marcadores por defecto, es mejor a no suprimir los marcadores por defecto y en lugar de cambiar el markerOptions en las Direcciones Representador de opciones?
    • He utilizado el código de arriba, pero en mi caso sólo mostrar polilínea no de inicio y de fin icono no se mostrará.en la anterior línea de código :la pantalla.setDirections( respuesta ); ¿por qué utilizar la pantalla var aquí?

  2. 12

    Hacer como dicen en la página que enlaza a:

    • Conjunto de la suppressMarkers opción a true para evitar el default marcadores de inicio y fin de mostrar
    • Crear el imágenes para los dos nuevos marcadores
    • Crear el marcadores con la posición a la posición inicial y final, y el conjunto de iconos a los que se crean
    • Pero, ¿cómo se les asigne para el renderizado de objetos? Sólo se necesita una MarkerOptions objeto, no dos.
    • no se les asigne. acaba de obtener las coordenadas para ellos y crear dos nuevos marcadores.

Dejar respuesta

Please enter your comment!
Please enter your name here