mapclone / mapbox-gl-framerate

A frame rate control to evaluate map rendering performance

mapbox-gl-framerate (demo)

A frame rate control to evaluate map rendering performance

Usage

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

npm install & npm start & open http://localhost:1337/