I'm making a website that at the home page it shows two graphs, what i need to do is make a checkbox at the home page that filters the first graph. The home page's graphs code stay at dash.js and that's the code:
render () {
//var id = null
var id = this.props.id //---pessoal do login tem que passar id como props
return (
<div>
<nav>
<div className="container-fluid">
<div className="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul className="nav navbar-nav">
<li><Link activeClass="active" className="GraphGeral" to="GraphGeral" spy={true} smooth={true} duration={500} >Colheita por alimento CSA</Link></li>
{id !== null && <li><Link activeClass="active" className="GraphEsp_1" to="GraphEsp_2" spy={true} smooth={true} duration={500}>Colheita por alimento Usuário</Link></li>}
<li><Link activeClass="active" className="GraphEsp_2" to="GraphEsp_1" spy={true} smooth={true} duration={500} >Temporada de Colheita CSA</Link></li>
{id !== null && <li><Link activeClass="active" className="GraphEsp_3" to="GraphEsp_3" spy={true} smooth={true} duration={500} >Temporada de Colheita Usuário</Link></li>}
</ul>
</div>
<Filtro/>
</div>
</nav>
<Element name="GraphGeral" className="element" >
Colheita por alimento CSA
<div className="App">
<Pie alimentos={this.state.alimentos_geral}/>
<RadioGroup value={this.state.alimentos_geral} onChange={this.handleChange}></RadioGroup>
</div>
</Element>
{id !== null &&
<Element name="GraphEsp_2" className="element">
Colheita por alimento Usuário
<div className="App">
<Pie alimentos={this.state.alimentos_user}/>
</div>
</Element>}
<Element name="GraphEsp_1" className="element">
Temporada de Colheita CSA
<div className="App">
<Chart kg={this.state.kg_geral}/>
</div>
</Element>
{id !== null &&
<Element name="GraphEsp_3" className="element">
Temporada de Colheita Usuário
<div className="App">
<Chart kg={this.state.kg_user}/>
</div>
</Element>}
</div>
);
}
};
export default Dash;
The first graph is created by this line: Pie alimentos={this.state.alimentos_geral}/ And i need to filter each food with a checkbox at the graph
Aucun commentaire:
Enregistrer un commentaire