Repository navigation
support plotselected / plothover / plotclick events #8
Description
I'm trying to migrate an existing flot graph that has handlers like
$('#graph').on('plotclick', function (event, pos, item) {
// do stuff
});
I'm going to try to add these in the componentDidUpdate hook of my component that wraps ReactFlot, but it seems like the 'correct' way to do this is to pass the handler as a prop to ReactFlot.
Something like:
// App.js
class MyReactFlotWrapper extends Component {
handlePlotClick(event, pos, item){
// do stuff
}
render() {
return (
<ReactFlot
onPlotClick={::this.handlePlotClick}
/>
);
}
}
// ReactFlot.jsx
class ReactFlot extends Component {
draw(event, data) {
const chart = $.plot($(`#${this.props.id}`), data || this.props.data, this.props.options);
addLabels(chart, this.props.options);
this.bindHandlers();
}
bindHandlers() {
if (this.props.onPlotClick) {
$(`#${this.props.id}`).on('plotclick', this.props.onPlotClick);
}
if (this.props.onPlotSelected) {
$(`#${this.props.id}`).on('plotselected', this.props.onPlotSelected);
}
}
}
The unused event parameter for draw makes it seem like maybe you initially intended to include something like this?
Activity