Addtileoverlay, polygons, polylines Issues with capacitor gogglemaps

Capacitor
1

Hello,
I am new for ionic 7 capacitor 5 googlemaps
Many issues:
addtileoverlay does note exist !
polygons and polylines do one point with browser, zero point with android
Can you help me for these 3 methods ?

2

Erreur of code about polylines but for polygon and addTileOverlay with Android, it’s a serius issue !
Help me please !

3
1 Like
4

Since one month, i searche about addtileoverlay on Internet a solution : 2 ou 3 comments only !

5

The fundtion:
async ajoute_map_osm() {
// alert(‘ajoute_map_osm’);
console.log(‘ajoute_map_osm’);
await this.map.addTileOverlay({
debug: false, // draw the debug information : quadrillage ave x,y et zoom

          opacity: 1,  // from 0.0 to 1.0
          
          tileSize: 256,
          
          visible: true,

          zIndex: 2,

          // modèle avec ionic 3 et cordova
		  
		  /* 
          getTile: function(x, y, zoom) {
            var url_osm="https://tile.openstreetmap.org" ;
            var url=url_osm +  "/" +zoom + "/" + x + "/" + y + ".png";
            return url;
          }
		  */
             
			
		  // autre modèle avec ionic 7 et capacitor
		  getTile: function(x:string, y:string, zoom:string) {
			
				const url="https://tile.openstreetmap.org/{x}/{y}/{zoom}.png"
				.replace("{zoom}", zoom + "")
				.replace("{x}", x + "")
				.replace("{y}", y + "");
			
				return url;
				
		 }
      })
} // fin ajoute_map_osm()the error: ERROR TypeError: _this4.map.addTileOverlay is not a function
ajoute_map_osm home.page.ts:150
Babel 3
ZoneAwarePromise Angular
_asyncToGenerator Babel
ajoute_map_osm home.page.ts:183
loadMap home.page.ts:104
Babel 2
Angular 12
6

There is an open issue to add custom tiles to the Capacitor plugin here - Google maps support for Tile images · Issue #1551 · ionic-team/capacitor-plugins · GitHub. Looks like they have been working on it but haven’t had a chance to finish it.

1 Like
7

Hello,
Thank you for your reply.
I already knew the address you gave, I had read the GIthub 1970 at the address “feat(@capacitor/google-maps): Custom tile overlay by LaravelFreelancerNL · Pull Request #1970 · ionic-team/capacitor-plugins · GitHub” and contacted LaravelFreeLancerNL which seems overwhelmed and has not yet given a solution. This is the only document that gives some hope.
I also found an addTileOverlay method in version 6 of Capacitor, but it doesn’t look like Cordova’s addTileOverlay.