Open getJv opened 4 years ago
I have found a working example with a URL (this is for French area...):
<template>
<div id="mapid">
<MglMap accessToken="..."
mapStyle="https://openmaptiles.geo.data.gouv.fr/styles/osm-bright/style.json"
:center="[3, 47]"
:zoom="5"
:minZoom="1"
:maxZoom="19"
container="mapid">
<MglGeojsonLayer
type="fill"
sourceId="departements"
:source="departementsSource"
layerId="departements-contours-layer"
:layer="departementsContoursLayer"
/>
</MglMap>
</div>
</template>
<script>
import Mapbox from "mapbox-gl";
import { MglMap, MglGeojsonLayer } from "vue-mapbox";
export default {
components: {
MglMap,
MglGeojsonLayer
},
data() {
return {
height: 0,
departementsSource: {
data: "/departements-100m.geojson"
},
departementsContoursLayer: {
id: 'departements-contours-layer',
source: 'departements',
type: 'line',
maxzoom: 9,
paint: {
"line-width": [
'case',
["boolean", ["feature-state", "hover"], false],
3,
1
]
}
}
};
},
created() {
// We need to set mapbox-gl library here in order to use it in template
this.mapbox = Mapbox;
}
};
</script>
You can find "geojson" file here: https://github.com/etalab/DVF-app/tree/master/static/donneesgeo
I hope this can help!
Hello guys, someone here has a minimal sample of you to use the MglGeojsonLayer?
The sample provided at MglGeojsonLayer it's incomplete .the
geoJsonSource
andgeoJsonLayer
data properties are missing and I can't figure out the correct format.Thanks in advance.