Library to use Mapbox GL JS from Dart. Working examples here: https://andrea689.github.io/mapbox-gl-dart/
You must include Mapbox GL JS into your .html
file
to be able to use this package.
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v2.5.1mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v2.5.1/mapbox-gl.css' rel='stylesheet'/>
In the body add a container for the map.
<body>
<div id='map'></div>
</body>
In the dart file initialize the map.
import 'package:mapbox_gl_dart/mapbox_gl_dart.dart' as mapboxgl;
void main() {
Mapbox.accessToken = 'YOUR_TOKEN_HERE';
var map = MapboxMap(
MapOptions(
container: 'map',
style: 'mapbox://styles/mapbox/dark-v10',
center: LngLat(7.68227, 45.06755),
zoom: 12,
),
);
}
You can find many examples in the example folder.
pub global activate webdev
webdev serve example:8081
Open browser to localhost:8081