https://github.com/mapbox/mapbox-gl-framerate
A frame rate control to evaluate map rendering performance
https://github.com/mapbox/mapbox-gl-framerate
Last synced: 3 months ago
JSON representation
A frame rate control to evaluate map rendering performance
- Host: GitHub
- URL: https://github.com/mapbox/mapbox-gl-framerate
- Owner: mapbox
- License: isc
- Created: 2018-11-11T19:50:29.000Z (about 7 years ago)
- Default Branch: publisher-production
- Last Pushed: 2022-05-16T15:59:08.000Z (over 3 years ago)
- Last Synced: 2024-09-20T13:02:26.510Z (over 1 year ago)
- Language: JavaScript
- Homepage: https://labs.mapbox.com/mapbox-gl-framerate
- Size: 208 KB
- Stars: 21
- Watchers: 81
- Forks: 6
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
- awesome-maplibre - mapbox-gl-framerate - A frame rate control to evaluate map rendering performance. (Development Tools Plugins / JavaScript)
README
mapbox-gl-framerate ([demo](https://labs.mapbox.com/mapbox-gl-framerate/))
---
A frame rate control to evaluate map rendering performance
### Usage
```js
const map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/light-v9'
});
const fps = new mapboxgl.FrameRateControl({ /* optional options */ });
map.addControl(fps);
```
### Options
| Property | Value | Description |
| ---- | ---- | ---- |
| background |
rgba(0,0,0,0.9)
| Color of the background container. |
| barWidth | 4 * window.devicePixelRatio
| Width of each individual performance bar. |
| color | #7cf859
| Bar & text color. |
| font | 'Monaco, Consolas, Courier, monospace'
| Comma separated string of fonts for text. |
| graphHeight | 60 * window.devicePixelRatio
| Graph height. |
| graphWidth | 90 * window.devicePixelRatio
| Graph width. |
| graphTop | 0
| Top position of the graph. |
| graphRight | 5 * window.devicePixelRatio
| Right position of the graph. |
| width | 100 * window.devicePixelRatio
| Container width of the graph. |
### Running the demo
```sh
npm install & npm start & open http://localhost:1337/
```