[](https://badge.fury.io/js/%40equinor%2Fvidex-map)
[](https://scm-compliance-api.radix.equinor.com/repos/equinor/videx-map/badge)
# Videx map
A leaflet layer for visualizing wellbore related data.
- [GitHub Repository](https://github.com/equinor/videx-map)
- [Documentation](https://equinor.github.io/videx-map/)
## Installation
```
npm install --save @equinor/videx-map
```
## Usage
```js
// ES6
import { WellboreModule, FaultlineModule, ... } from '@equinor/videx-map';
```
# Modules
Videx map is divided into various modules with specific purposes. These modules can be used individually or combined into a single WebGL context.
## Wellbore Module
Module responsible for visualizing wellbores with roots and paths.
### Configurations
- scale - Relative scale of everything. (Default: 1.0)
- wellboreWidth - Width of wellbore. (Default: 0.15)
- rootRadius - Width of root. (Default: 0.4)
- labelScale - Scale of labels. (Default: 0.011)
- labelBgOpacity - Opacity of label background. (Default: 0.5)
- fontSize - Size of font. (Default: 24)
- batchSize - Amount of wellbores per batch. (Default: 25)
- zoomOrigin - Origin zoom level, i.e. where input for scaling function is 0. (Default: 0)
- customEventHandler - Provide your custom event handler.
- scaling - Zoom event handler.
- gridSize - Grid size to control resolution of spatial indexing.
- rootResize - Resize configurations of roots.
- onWellboreClick - Function to be called when a wellbore is selected.
- onHighlightOn - Function to be called when wellbores are highlighted.
- onHighlightOff - Function to be called when highlight is removed.
```js
// Example configuration
const wellbores: WellboreModule = new WellboreModule({
rootRadius: 0.3,
scale: 1.5,
labelBgOpacity: 0.2,
zoomOrigin: 0,
scaling: zoom => factors[zoom] || 0,
rootResize: {
base: 1.75,
multiplier: 0.5,
zoomReference: 12.0,
},
onHighlightOn: event => {
// Special 'HighlightOn' logic ...
},
onHighlightOff: () => {
// Special 'HighlightOff' logic ...
},
onWellboreClick: wellbore => {
// Special 'WellboreClick' logic ...
}
});
```
## Faultline Module
Module responsible for visualizing faultlines on fields.
- color - Color of faultline on format 0xRRGGBB. (Default: 0x727D88)
- alpha - Alpha of faultlines. (Default: 1.0)
- outlineWidth - Width of outline. (Default: 0.125)
```js
// Example configuration
const faultlines: FaultlineModule = new FaultlineModule({
color: 0xFF00FF,
alpha: 0.75,
outlineWidth: 0.13,
});
```
## Outline Module
Module responsible for visualizing field outlines.
- zoomOrigin - Origin zoom level, i.e. where input for scaling function is 0. (Default: 0)
- lineWidth - Width of line. (Default: 0.125)
- scaling - Zoom event handler.
```js
// Example configuration
const outlines: OutlineModule = new OutlineModule({
zoomOrigin: 12,
lineWidth: 0.1,
scaling: zoom => (1.5 ** -zoom),
});
```
## Contribution
We greatly appreciate contributions to this repository, see our [contribution page](CONTRIBUTION.md) on how to get started.
### Quick start
```
$ git clone https://github.com/equinor/videx-map.git
$ npm install
$ npm start
```
