You can use the Mapbox adapter to integrate MapWeave with Mapbox. You will need an API key from Mapbox.
import { MapWeave } from "mapweave/mapbox";
export const mapweave = new MapWeave({
container: "mw",
options: {
accessToken: VITE_MAPBOX_API_KEY,
// See https://docs.mapbox.com/api/maps/styles/ for other styles. If no style is specified,
// MapWeave uses a dark style by default.
style: "mapbox://styles/mapbox/streets-v12",
},
});<!doctype html>
<html>
<body>
<div id="mw"></div>
<script type="module" src="./code.js"></script>
</body>
</html>import React from "react";
import { createRoot } from "react-dom/client";
import { MapWeave } from "mapweave/react/mapbox";
const mapWeaveOptions = {
accessToken: VITE_MAPBOX_API_KEY,
// See https://docs.mapbox.com/api/maps/styles/ for other styles. If no style is specified,
// MapWeave uses a dark style by default.
style: "mapbox://styles/mapbox/streets-v12",
};
function Demo() {
return <MapWeave options={mapWeaveOptions} />;
}
const root = createRoot(document.getElementById("mw"));
root.render(<Demo />);<!doctype html>
<html>
<body>
<div id="mw"></div>
<script type="module" src="./code.jsx"></script>
</body>
</html>