mirror of https://github.com/ghostfolio/ghostfolio
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.1 KiB
54 lines
1.1 KiB
// React
|
|
import React, { Component } from 'react';
|
|
import './App.css';
|
|
|
|
// svgMap
|
|
import svgMap from 'svgmap';
|
|
import 'svgmap/dist/svgMap.min.css';
|
|
|
|
class App extends Component {
|
|
|
|
componentDidMount() {
|
|
if (!this.svgMap) {
|
|
|
|
var mySvgMap = new svgMap({
|
|
targetElementID: 'svgMap',
|
|
data: {
|
|
data: {
|
|
gdp: {
|
|
name: 'GDP per capita',
|
|
format: '{0} USD',
|
|
thousandSeparator: ',',
|
|
thresholdMax: 50000,
|
|
thresholdMin: 1000
|
|
},
|
|
change: {
|
|
name: 'Change to year before',
|
|
format: '{0} %'
|
|
}
|
|
},
|
|
applyData: 'gdp',
|
|
values: {
|
|
AF: { gdp: 587, change: 4.73 },
|
|
AL: { gdp: 4583, change: 11.09 },
|
|
DZ: { gdp: 4293, change: 10.01 }
|
|
// ...
|
|
}
|
|
}
|
|
});
|
|
|
|
this.svgMap = mySvgMap;
|
|
}
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div className='app'>
|
|
<h1>svgMap React demo</h1>
|
|
<div id='svgMap'></div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default App;
|
|
|