Angular-google-maps: ¿Cómo cambio el tamaño de un icono?

Creado en 18 jul. 2016  ·  19Comentarios  ·  Fuente: SebastianM/angular-google-maps

Descripcion del problema
Me gustaría cambiar el tamaño de un icono a un tamaño predefinido. ¿Cómo debo hacer eso?

Pasos para reproducir y una demostración mínima del problema.
Comportamiento actual
No hay opción para el tamaño escalado presente.

Comportamiento esperado / deseado
Quiero poder cambiar el tamaño de un icono.

versión angular2 y angular2-google-maps
último

Otra información

AgmMarker stale feature-request

Comentario más útil

Puedo usar el objeto Icon contra la propiedad iconUrl del marcador.

Mi icono se parece a:

{
      url: require('../images/vehicle-active.png'), // gives a data://<value>
      scaledSize: {
        height: 40,
        width: 40
      }
}

Y luego ato esto a [iconUrl] . La variable 'iconUrl' puede tener un nombre deficiente, pero si miras la fuente, simplemente se pasa a la propiedad 'icon' para gmaps.

Todos 19 comentarios

Estoy tratando de hacer lo mismo, pero mirando las fuentes, no hay forma de hacerlo, la única forma en que puede asignar un ícono es a través de una URL, no puede usar el objeto google.maps.Icon. Estaba pensando en modificar el código y crear una solicitud de extracción para él.

@SebastianM Escribí un código para manejar google.maps.Symbol y google.maps.Icon para la propiedad de icono del marcador, lo presionaré mañana para que puedas echarle un vistazo

Estoy de acuerdo en que deberíamos admitir objetos de cadena e ícono y cambiar el nombre de la propiedad a ícono
icon?: string|Icon;

Rompí 4 pruebas unitarias, pero tengo la actualización del ícono en mi bifurcación. También agregué al archivo google-maps-types.ts.

@cdarken Acabo de ver tu PR y

@ rc3media Traté de mantenerlo compatible con versiones anteriores, es por eso que agregué el acceso 'ícono' en el marcador

¿Cuándo se agregará esta función? este número es de agosto X_X

Puedo usar el objeto Icon contra la propiedad iconUrl del marcador.

Mi icono se parece a:

{
      url: require('../images/vehicle-active.png'), // gives a data://<value>
      scaledSize: {
        height: 40,
        width: 40
      }
}

Y luego ato esto a [iconUrl] . La variable 'iconUrl' puede tener un nombre deficiente, pero si miras la fuente, simplemente se pasa a la propiedad 'icon' para gmaps.

@bradseefeld ¿dónde coloca el código que define el icono: en su componente mecanografiado? Recibí un error No se puede encontrar el nombre 'require' .

Estamos usando webpack para procesar y empaquetar nuestra aplicación. Maneja las llamadas requeridas. No creo que esta solución funcione a menos que esté usando un paquete web o algo similar.

Sí, uso webpack. Funciona, pero tuve que agregar:
declare function require(path: string);

Requerir no es necesario (al menos con Ionic)

{
      url: 'assets/img/marker-me.png',
      scaledSize: {
        height: 40,
        width: 40
      }
}

@ sebrojas14 esto ya no funciona en las últimas versiones 1.0.0.x.
Ahora realmente se requiere "Cadena", si no se proporciona, arroja un error.

¿Tiene algunas ideas sobre cuándo estará disponible esta función tan solicitada?

Gracias

@pdanysz funciona bien para mí, versión 1.0.0-beta.3

@grreeenn Ya instalé esa versión y me arroja un error, así es como pregunto :)

¿Puedes compartir tu código? ... tal vez estoy haciendo algo mal :)

Gracias

@pdanysz Hemos perdido nuestras varitas mágicas y no podemos ver tu error desde aquí. Realmente ayudaría si pudiera compartir el error para que sepamos con qué está lidiando realmente. También necesitaremos su código para saber cómo corregir el error. En otras palabras, para poder ayudarlo, necesitamos una reproducción completa para que podamos inspeccionar el problema. ¿Podrías darnos eso?

Intenté usar este objeto:

icon = {
        url: '/assets/images/img.png', 
        scaledSize: {
          height: 40,
          width: 20
        }
      };

y eso me funciona.
Sin embargo, se supone que el marcador se debe usar para varios establecimientos en mi mapa, y no puedo usar una sola propiedad en mi clase ts para que esto funcione como se esperaba. Entonces, en lugar de usar [iconUrl] = "icon" en mi html, estoy tratando de usar [iconUrl] = "getIcon (establecimiento)", que devolvería el objeto descrito anteriormente con diferentes URL para cada establecimiento. Esto hace que la aplicación se congele al intentar cargar el mapa de agm. ¿Lo que escribí aquí es suficiente para saber si esto es posible? Puedo enviar más detalles si es necesario.
¡Gracias!

Encontré este comentario de hrdkisback en StackOverflow, que le permite cambiar dinámicamente el icono del marcador del mapa y especificar el tamaño:

[iconUrl]='{"url": marker,"scaledSize": {"height": 10, "width": 10}}'

https://stackoverflow.com/questions/50812678/add-user-image-to-agm-marker-in-angular-5#comment88677807_50812678

Este problema se ha marcado automáticamente como obsoleto porque no ha tenido actividad reciente. Se cerrará si no se produce más actividad. Gracias por sus aportaciones.

¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

matishw picture matishw  ·  3Comentarios

shedar picture shedar  ·  4Comentarios

n1t3w0lf picture n1t3w0lf  ·  3Comentarios

marcelinobadin picture marcelinobadin  ·  3Comentarios

supran2811 picture supran2811  ·  4Comentarios