guans-deltamap
v1.3.28
Published
![logo](https://gitee.com/shaolunryan/GUANS-libs/raw/master/guans-deltamap/info/logo.svg)
Downloads
9
Maintainers
Readme
Deltamap is a javascript method to build a svg plot by calling the methods included in the lib itself.
You can install it via npm
:
npm install guans-deltamap --dev-save
The initial pipeline and approach to use it are as follows:
As SCRIPT method:
<script src="unpkg/[email protected]/dist/deltamap.min.js"></script>
As CommonJS method:
const dm = require('guans-deltamap')
As ES2015 method:
import * as dm from 'guans-deltamap'
Format
use dm.format()
/*
@params Array arr
@return Object dataOutput
Array nodes,
Array links
*/
Please note that the data to be imported must meet the conditon that the first three fields
must be ego-name
, value1
, value2
sort, other fields could include additional attributes.
Visualize
use dm.vis()
/*
This is the method inherited from the format.js
To comvert formatted data into svg plot.`
*/
/*
@params Array data
@params Array cirlce center coordinates
@params Array Outer and inner radius
@params String The params tto controls the color map of the stroke
@return null
*/
The dm.vis()
method includes modules to render a deltamap plot into specific dom element.
Basic params could be data
, c
, radius
and additional
fields.
The additional
field is the additional info user wanna carry with.
The deltamap algo can handle the add
field automatically and render the strokes via type of add
.
(Double colors if its boolean or gradient color if its number)
Besides, the algo provides a interface allowing users control and modify the deltamap outside. So meet various customized needs. The grammar like:
let plot = dm.vis(svg, dataOutput,[480,300],[250,175],'waterContent')
plot.links.attr('stroke','pink')
plot.link_d.attr('stroke','green')
Info
As the first lib published from GUANS Lab, we set several basic info users interests and some methods we need in the future coding process. Please see as follows:
let info = {
author,
email,
institution,
members,
page,//Labs official website
logoOrigin,//logo src of the lab
createLogo()//method to build logo
}
We add the vars into the global so u can test them via control panel directly.