Símbolos de flecha (polilínea) para AGM (mapa angular de Google)

1 minuto de lectura

Avatar de usuario de Md. Nashir Uddin
Dr. Nashir Uddin

En angular 6. Estoy usando código de flujo para agm-polyline. Quiero agregar símbolos de flecha (polilínea) (https://developers.google.com/maps/documentation/javascript/examples/overlay-symbol-arrow) en agm-polilínea. Pero el compilador muestra un error como Can’t bind to ‘icon’ ya que no es una propiedad conocida de ‘agm-polyline’…

<agm-polyline [strokeColor]="color" [icon]="icon"  >
          <agm-polyline-point  *ngFor="let marker of markers ; let i=index"  [latitude]="marker.lat" [longitude]="marker.lng">
          </agm-polyline-point>
    
        </agm-polyline>

Para los símbolos de flecha agm-polyline (Polyline), ¿qué debo hacer?

  • ¿Tienes alguna solución a esto…?

    – janaka aravinda

    2 de abril de 2019 a las 11:12

  • @janakaaravinda Todavía no.

    – Dr. Nashir Uddin

    2 abr 2019 a las 12:20


<agm-polyline [strokeColor]="'red'" [strokeWeight]="'1.5'">
                                        <agm-icon-sequence [fixedRotation]="false"
                                            [repeat]= "'50px'"
                                            [offset]="100" 
                                            [path]="'FORWARD_OPEN_ARROW'">
                                        </agm-icon-sequence>
                                        <agm-polyline-point *ngFor="let line of circles_path" 
                                        [latitude]="line.lat"
                                        [longitude]="line.long" >
                                        </agm-polyline-point>
                                    </agm-polyline>

  • Si quiero mostrar la línea de puntos, entonces lo que debería estar en la entrada “ruta” @Rambabu Padimi

    – Segador

    4 de agosto de 2022 a las 9:13

usos agm [iconUrl] en vez de [icon].Pruébalo y configura la URL en el archivo .ts de esta manera:


  public icon = {
    url: 'http://earth.google.com/images/kml-icons/track-directional/track-4.png',
    scaledSize: {
      width: 30,
      height: 30
    }
}

¿Ha sido útil esta solución?