Awesome
V-Mapbox 🗺
<a title="npm" href="https://www.npmjs.com/package/v-mapbox" rel="nofollow"> <img alt="npm" src="https://img.shields.io/npm/v/v-mapbox?label=npm%40latest&logo=npm"> </a> <a title="GitHub Release" href="https://github.com/vinayakkulkarni/v-mapbox/releases" rel="nofollow"> <img alt="GitHub release (latest by date including pre-releases)" src="https://img.shields.io/github/v/release/vinayakkulkarni/v-mapbox?include_prereleases&logo=github"> </a> <a title="CI Status" href="https://github.com/vinayakkulkarni/v-mapbox/actions?query=workflow%3Aci" rel="nofollow"> <img alt="Total alerts" src="https://github.com/vinayakkulkarni/v-mapbox/workflows/ci/badge.svg"> </a> <a title="DeepScan Grade" href="https://deepscan.io/dashboard#view=project&tid=9381&pid=14423&bid=267899"> <img src="https://deepscan.io/api/teams/9381/projects/14423/branches/267899/badge/grade.svg" alt="DeepScan grade"> </a> <a title="downloads" href="http://npm-stat.com/charts.html?package=v-mapbox" rel="nofollow"> <img alt="npm" src="https://img.shields.io/npm/dm/v-mapbox"> </a> <a title="deploy" href="https://github.com/algolia/shipjs" rel="nofollow"> <img src="https://img.shields.io/badge/deploy-🛳%20Ship.js-blue?style=flat" /> </a> <a title="Last Commit" href="https://github.com/vinayakkulkarni/v-mapbox/commits/main" rel="nofollow"> <img alt="GitHub last commit" src="https://img.shields.io/github/last-commit/vinayakkulkarni/v-mapbox"> </a> <a title="Contributors" href="https://github.com/vinayakkulkarni/v-mapbox/graphs/contributors" rel="nofollow"> <img alt="GitHub contributors" src="https://img.shields.io/github/contributors/vinayakkulkarni/v-mapbox"> </a> <a title="maintenance" href="https://github.com/vinayakkulkarni/v-mapbox/commits/main" rel="nofollow"> <img alt="Maintenance" src="https://img.shields.io/maintenance/yes/2024"> </a> <a href="https://app.fossa.com/projects/git%2Bgithub.com%2Fvinayakkulkarni%2Fv-mapbox?ref=badge_shield" alt="FOSSA Status"> <img src="https://app.fossa.com/api/projects/git%2Bgithub.com%2Fvinayakkulkarni%2Fv-mapbox.svg?type=shield"/> </a>Combine powers of Vue and Mapbox GL JS (v3.x) & MaplibreGL (v4.x) 🗺
V-Mapbox is wrapper around Mapbox GL JS for >v1.x to <=v3.x & Maplibre GL JS for > v4.x library that provides vueish-way to interact with the map.
Installation
# For Vue 2
$ npm i v-mapbox@legacy
# For Vue 3
$ npm i v-mapbox
Demo
Deck.gl 🆕
Development
git clone git@github.com:vinayakkulkarni/v-mapbox.git
cd v-mapbox
npm install
Running in dev mode:
npm run serve
Build for production:
npm run build
Documentation
Start documentation site in development mode:
npm run docs:dev
Build documentation:
npm run docs:build
Inspired by KoRiGaN's Vue2Leaflet.
Contributing
- Fork it (https://github.com/vinayakkulkarni/v-mapbox/fork)
- Create your feature branch (
git checkout -b feat/new-feature
) - Commit your changes (
git commit -Sam 'feat: add feature'
) - Push to the branch (
git push origin feat/new-feature
) - Create a new Pull Request
Note:
- Please contribute using GitHub Flow
- Commits & PRs will be allowed only if the commit messages & PR titles follow the conventional commit standard, read more about it here
- PS. Ensure your commits are signed. Read why
Author
v-mapbox © Vinayak, Released under the MIT License.<br> Authored and maintained by Vinayak Kulkarni with help from contributors (list).
vinayakkulkarni.dev · GitHub @vinayakkulkarni · Twitter @_vinayak_k
License
MIT