1

I'm using the nativescript-google-maps-sdk plugin to create a Google map.

Everything works fine but I've got a problem with my custom marker icons, if you look at these pictures you can see that the icon size is not preserved on Android, making them very, very small to the point where you can barely even see them. This happens both in the emulators and on a real phone.

On IOS however the size is fine, as you can see in the 2nd image. The icon images have a size of 16x16 pixels and are in .png format.

I haven't been able to find any solution to this so this is my last resort, does anyone know why this might be happening?

android

ios

This is the code I use to create the markers:

getImage(this.getWarningIcon(warning.status)).then((result) => {

  const icon = new Image();
        icon.imageSource = result;

  const marker = new Marker();
        marker.position = warning.centerOfPolygon;
        marker.icon = icon;
        marker.flat = true;
        marker.anchor = [0.5, 0.5];
        marker.visible = warning.isVisible;
        marker.zIndex = zIndexOffset;
        marker.infoWindowTemplate = 'markerTemplate';
        marker.userData = {
          description: warning.description,
          startTime: warning.startTime,
          completionTime: warning.completionTime,
          freeText: warning.freeText
        };

  this.layers.push(marker);
  this.map.addMarker(marker);
});
Chrillewoodz
  • 27,055
  • 21
  • 92
  • 175

1 Answers1

0

In that case 16px sounds too low for a high density device. Increase the size of the image sent from server or locally resize the image before passing it to marker.

You may also consider generating a scaled bitmap natively if you are familiar with Android apis. Image processing is something always complicated in Android. Using drawables are recommend when your images are static at least.

Manoj
  • 21,753
  • 3
  • 20
  • 41