A vue plugin for maplibre-gl-js. Only additional dependency is mitt.
Size: 36 KB
- Typescript support
- Components for map, controls, sources, marker and layers
- Support for custom controls
- Customizable style switch which reloads sources and layers automatically
- Frame rate control included
- Support for multiple instances and global access by
useMap(key: string | symbol)
yarn add vue-maplibre-gl maplibre-gl
Global Install:
import VueMaplibreGl from 'vue-maplibre-gl';
app.use(VueMaplibreGl);
Add CSS:
@import 'vue-maplibre-gl/dist/style.css';
Use specific components:
import { MglMap } from 'vue-maplibre-gl';
app.component('MglMap', MglMap);
or in a parent components .vue
file
<script>
import { MglMap } from 'vue-maplibre-gl';
export default {
components: {
MglMap,
},
// ...
};
</script>
See /dev/serve.vue for a real world example.
git clone https://github.com/razorness/vue-maplibre-gl.git
cd vue-maplibre-gl
yarn
yarn serve
If you have ideas, improvements, suggestions etc. don't hesitate to open a pull request.
- Generate separate css file to be included (currently, you have to use scss)
- Usage examples
- Demo
- API documentation
- Support
v-model:...
for some basic props - Add layer events
- Add Web-types
- Add frame rate control