Appearance
Geo mode with Leaflet
Since version Ogma version 2.8.0 the Geo mode has been rewritten to work together with the leaflet.js mapping library.
This means that old code that used Geo mode needs few simple steps to migrate to the newer version.
The Ogma team worked hard to minimize the effort of this migration, therefore the only requirements for the migrations are the following:
- download or link the
leaflet.css
stylesheet file into your page/application - download or link the
leaflet.js
file into your page/application - register the
leaflet
library in Ogma - see below
If you are already using the library in your application for other maps, the only step to follow is this:
js
import Ogma from '@linkurious/ogma';
import L from 'leaflet';
import 'path/to/leaflet.css';
Ogma.libraries['leaflet'] = L;
const ogma = new Ogma({
container: 'graph-container',
graph: {
nodes: [
{
id: 0,
...
}
]
}
});
ogma.geo.enable().then( ... )
In case you are using Ogma on a simple HTML page you can simply include the script for the leaflet
assets as follow in the page before the Ogma code:
html
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.3/leaflet.css"
/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.3/leaflet.js">
<script src="../build/ogma.js">
</script>
<script>
'use strict';
const ogma = new Ogma({
container: 'graph-container',
graph: {
nodes: [
{
id: 0,
...
}
]
}
});
ogma.geo.enable().then( ... )
</script>
No API changes occurred in the current version of Ogma, but some methods have been deprecated in the geo
namespace. Please refer the the geo
API documentation for more informations.