Website-Suche

Typescript-Definition d.ts für mapbox-gl-draw

Ich habe versucht, eine typisierte Definition für das mapbox-gl-draw-Projekt zu erstellen. Aber ich bin gescheitert. Könnte mir jemand ein paar Hinweise geben?

Die Javascript-Datei ist so.

'use strict';

var Setup = require('./src/setup');
var Options = require('./src/options');
var API = require('./src/api');
const Constants = require('./src/constants');

var Draw = function(options) {
  options = Options(options);

  var ctx = {
    options: options
  };

  var api = API(ctx);
  ctx.api = api;

  var setup = Setup(ctx);
  api.addTo = setup.addTo;
  api.remove = setup.remove;
  api.types = Constants.types;
  api.options = options;

  return api;
};

module.exports = Draw;

window.mapboxgl = window.mapboxgl || {};
window.mapboxgl.Draw = Draw;

Meine index.d.ts ist wie

declare namespace mapboxgl {
    export function Draw(options?:any):any

}
declare module 'mapbox-gl-draw' {
    export = mapboxgl;
}

Antwort #1

Für dieses JavaScript:

var map = new mapboxgl.Map({
  container: 'map',
  style: 'mapbox://styles/mapbox/streets-v8',
  center: [40, -74.50],
  zoom: 9
});

Sie könnten zum Beispiel mapOptions erstellen:

interface MapOptions {
 container?: string;
 style?: string,
 center?: number[];
 zoom?: number;
}


declare module "mapbox-gl-draw" {

}

Antwort #2

Die besten Typen für diese Erweiterung befinden sich derzeit in diesem Git-Problem:

https://github.com/mapbox/mapbox-gl-draw/issues/842

Es ist nicht klar, warum sie nicht erfolgreich bei DefinitelyTyped eingereicht wurden. Zur Nachwelt unten beigefügt:

declare module '@mapbox/mapbox-gl-draw' {

import {Feature, FeatureCollection} from 'geojson'
  import {IControl} from 'mapbox-gl'
  import {IMapboxDrawControls} from '@mapbox/mapbox-gl-draw'

  namespace MapboxDraw {
    export interface IMapboxDrawControls {
      point?: boolean,
      line_string?: boolean,
      polygon?: boolean
      trash?: boolean,
      combine_features?: boolean,
      uncombine_features?: boolean
    }
  }

  class MapboxDraw implements IControl {

    getDefaultPosition: () => string

    constructor(options?: {
      displayControlsDefault?: boolean,
      keybindings?: boolean,
      touchEnabled?: boolean,
      boxSelect?: boolean,
      clickBuffer?: number,
      touchBuffer?: number,
      controls?: IMapboxDrawControls,
      styles?: object[],
      modes?: object,
      defaultMode?: string,
      userProperties?: boolean
    });

    public add(geojson: object): string[]

    public get(featureId: string): Feature | undefined

    public getFeatureIdsAt(point: { x: number, y: number }): string[]

    public getSelectedIds(): string[]

    public getSelected(): FeatureCollection

    public getSelectedPoints(): FeatureCollection

    public getAll(): FeatureCollection

    public delete(ids: string | string[]): this

    public deleteAll(): this

    public set(featureCollection: FeatureCollection): string[]

    public trash(): this

    public combineFeatures(): this

    public uncombineFeatures(): this

    public getMode(): string

    public changeMode(mode: string, options?: object): this

    public setFeatureProperty(featureId: string, property: string, value: any): this

    onAdd(map: mapboxgl.Map): HTMLElement

    onRemove(map: mapboxgl.Map): any

  }

  export = MapboxDraw
}

Verwandte Artikel