How to get Leaflet Marker-Cluster Freezable methods show up in VS Code IntelliSense

Question

I am working on an Angular project where I use Leaflet map service. I came across a problem of clustering. I wanted to toggle clustering and to do so I found a package which has methods that enable/disable clustering feature: Leaflet.MarkerCluster.Freezable

I have followed the instructions for package installation:

• npm install leaflet.markercluster.freezable --save
  which installed it under my node_modules folder and it updated package.json(Installation Successfull)
• now if I try to import 'leaflet.markercluster.freezable'; in my Type-Script File my VS Code does not show the methods from the package in the IntelliSense feature.

I don't understand what had gone wrong (I think there might be problem with import).

Answer 1

Unfortunately there are no typings available yet for Leaflet.MarkerCluster.Freezable library.

You should be able to write them yourself, something in the lines of:

leaflet.markercluster.freezable.d.ts

import 'leaflet';
import 'leaflet.markercluster';

declare module 'leaflet' {
  // Augment the MCG class through an interface with the same name
  interface MarkerClusterGroup {
    freezeAtZoom(frozenZoom?: number | boolean | 'max' | 'maxKeepSpiderfy'): this;

    unfreeze(): this;

    disableClustering(): this;

    disableClusteringKeepSpiderfy(): this;

    enableClustering(): this;
  }
}

Then reference this definition file in your TypeScript project configuration.

Playground Link