vue-mapbox
vue-mapbox copied to clipboard
Uncaught Error: Container 'YOUR_CONTAINER_ELEMENT_ID' not found.
My component :
<template>
<div class="section">
<h1>La carte des thés</h1>
<MglMap id="map"
:accessToken="accessToken"
:mapStyle="mapStyle">
</MglMap>
</div>
</template>
<script>
import Mapbox from "mapbox-gl";
import {MglMap} from "vue-mapbox";
export default {
components: {
MglMap,
// MglMarker,
},
data() {
return {
accessToken: '', // your access token. Needed if you using Mapbox maps
mapStyle: '', // your map style
};
},
created() {
// We need to set mapbox-gl library here in order to use it in template
this.mapbox = Mapbox;
}
};
</script>
My index.html :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.53.0/mapbox-gl.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.11/vue.min.js"></script>
<title><></title>
</head>
Hello
I adding a map component by following the documentation. My map is displayed but i have these two errors :
