https://github.com/watergis/mapbox-gl-popup

This module adds popup control which can show attributes of targeted layers to mapbox-gl
https://github.com/watergis/mapbox-gl-popup

demo mapbox-gl-js popup

Last synced: 10 days ago
JSON representation

This module adds popup control which can show attributes of targeted layers to mapbox-gl

• Host: GitHub
• URL: https://github.com/watergis/mapbox-gl-popup
• Owner: watergis
• License: mit
• Created: 2020-07-25T12:27:16.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-06-22T14:37:19.000Z (over 1 year ago)
• Last Synced: 2024-10-30T05:43:06.304Z (17 days ago)
• Topics: demo, mapbox-gl-js, popup
• Language: CSS
• Homepage: https://watergis.github.io/mapbox-gl-popup/
• Size: 882 KB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        
# mapbox-gl-popup

![](https://github.com/watergis/mapbox-gl-popup/workflows/Node.js%20Package/badge.svg)

![GitHub](https://img.shields.io/github/license/watergis/mapbox-gl-popup)

This module adds popup control which can show attributes of targeted layers to mapbox-gl

## Installation:

```bash

npm i @watergis/mapbox-gl-popup --save

```

## Demo:

Try [codesandbox](https://codesandbox.io/s/mapbox-gl-popup-y8xs9).

See [demo](https://watergis.github.io/mapbox-gl-popup).

## Test:

```

npm run build

npm start

```

open [http://localhost:8080](http://localhost:8080).

## Usage:

```ts

import { MapboxPopupControl } from "mapbox-gl-popup";

import { Map as MapboxMap } from "mapbox-gl";

import "mapbox-gl-popup/css/styles.css";

const map = new MapboxMap();

map.addControl(new MapboxPopupControl([

  'targeted sourceLayer name'

]));

```

Specify your sourceLayer name which you want to show popup for attributes of layer.

If you don't provide a list of layers, the control will not enable popup function.