user24538254's questions

Estou tentando seguir este tutorial ( https://maplibre.org/ngx-maplibre-gl/API/ ) para implementar o MapLibre GL em um aplicativo Angular, mas não consigo.

Não entendi como implementar este código do tutorial:

import { Component } from '@angular/core';
import { MapComponent } from '@maplibre/ngx-maplibre-gl';

@NgModule({
  template: `
    <mgl-map
      [style]="'https://demotiles.maplibre.org/style.json'"
      [zoom]="[9]"
      [center]="[-74.5, 40]"
    >
    </mgl-map>
  `,
  styles: [
    `
      mgl-map {
        height: 100%;
        width: 100%;
      }
    `,
  ],
  imports: [MapComponent],
})
export class AppComponent {}

Adaptando-o a um componente como

import { Component } from '@angular/core';

@Component({
  selector: 'app-tabs',
  template: `
    <mgl-map
      [style]="'https://demotiles.maplibre.org/style.json'"
      [zoom]="[9]"
      [center]="[-74.5, 40]"
    >
    </mgl-map>
  `,
  styles: [
    `
      mgl-map {
        height: 100%;
        width: 100%;
      }
    `,
  ],
  standalone: false
})
export class MapPage {
  constructor() {}
}

só mostra uma tela preta.

Eu não entendo como o código do tutorial deveria funcionar, porque se eu apenas implementar o código do tutorial diretamente, meu compilador diz que o literal do objeto pode especificar apenas propriedades conhecidas, e 'template' não existe no tipo 'NgModule' .

Você consegue fazer o código do tutorial funcionar? Como?

Muito obrigado pela sua ajuda🙂