Tooltip doesn't appear in BarChart
See original GitHub issueHello, I’m trying to create a BarChart with tooltip activate but it isn’t working for some reason.
The Barchart appears but the tooltip doesn’t show on bar hoover. Here is the code:
import React, {
Component
} from 'react';
import BarChart from 'react-d3-components/lib/BarChart';
export default class OpenIssuesGraph extends Component {
constructor(props) {
super(props);
this.state = {
list: [{
label: 'Open Issues',
values: [{
x: 'nothing',
y: 0
}]
}]
}
}
componentDidMount() {
this.fetchData();
}
fetchData() {
fetch("urlgoeshere", {
method: "GET"
}).then(response => response.text()).then(json => {
let tmp = [];
const data = JSON.parse(json).rows;
for (let row in data) {
tmp.push({
x: data[row].abbrev,
y: parseInt(data[row].nrOpenIssues)
})
}
let fill = [{
label: 'Open Issues',
values: tmp
}];
this.setState({
list: fill
});
});
}
render() {
var tooltip = function(x, y0, y, total) {
return y.toString();
};
return <div > < BarChart data = {
this.state.list
}
width = {
800
}
height = {
400
}
margin = {
{
top: 10,
bottom: 50,
left: 50,
right: 10
}
}
tooltipHtml = {
tooltip
}
colorByLabel = {
false
}
/>,</div > ;
}
}
Do I need to link some .js on the index.html or something!??!
Thanks in advance.
Issue Analytics
- State:
- Created 6 years ago
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Bar chart tool tip doesn't show values properly. #52329 - GitHub
What happened: Tooltip doesn't properly show (single | all) values. What you expected to happen: Tooltip to show either single or all values ......
Read more >Viz in ToolTip doesn't show the bar chart - Tableau Community
Hi,. I built 2 charts, one for orders and one bar chart as a Viz in ToolTip. if I hover over an order...
Read more >HighCharts: Tooltip is not visible in Bar chart for very small value
This will display a tooltip whenever your mouse is in the column/bar area but will have all series values in the tooltip.
Read more >Chart - Tooltip doesn't show on bar chart when data is not ...
Hello, When looking for a way to properly display data coming from server I encountered and issue with tooltip on bar chart.
Read more >Tooltips not showing on line in a line and bar chart
I created a customised tooltip to show the breakdown of the datapoint, e.g. if users hover one a bar or a marker it...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
@codesuki Ahah that was exactly the problem xD Solved, thanks for the help and for developing the components.
Sorry to hear that! Did you set some CSS? https://github.com/codesuki/react-d3-components/blob/master/example/style.css#L87-L95 Maybe the tool tip is just invisible.