aleleba/chartjs-2-react
1
0
Fork 0
mirror of https://github.com/aleleba/chartjs-2-react.git synced 2025-07-03 20:28:17 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

Se soluciona el problema de que existan varios RadialGauge en el mismo componente agregandoles un id único.

Browse Source 
Se sube a version 1.0.10
Se sube a GitHub 1.0.10
Se sube a NPM 1.0.10
This commit is contained in:
Alejandro Lembke Barrientos
2019-12-05 23:40:15 -06:00
parent 5170fae311
commit 783d248f1e
4 changed files with 41 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/RadialGauge.jsx
View File

@ -4,6 +4,8 @@ import Chart from 'chart.js';
import 'chartjs-chart-radial-gauge/build/Chart.RadialGauge.umd.min.js';
import ID from './Service/ID.js'
class RadialGauge extends Component {
constructor(props) {
@ -11,8 +13,11 @@ class RadialGauge extends Component {
let porcentaje = Math.round(Math.random() * 100),
porcentajeTexto = `${porcentaje} %`
let id = this.props.id ? this.props.id : ID()
this.state = {
id,
chart: null,
porcentaje,
porcentajeTexto
@ -22,7 +27,7 @@ class RadialGauge extends Component {
componentDidMount() {
var ctx = document.getElementById('chart').getContext('2d');
var ctx = document.getElementById(`${this.state.id}`).getContext('2d');
var config = {
type: 'radialGauge',
@ -110,10 +115,10 @@ class RadialGauge extends Component {
this.state.chart.update();
return <canvas id="chart" />
return <canvas id={`${this.state.id}`} />
} else {
return <canvas id="chart" />
return <canvas id={`${this.state.id}`} />
}
}
}