Highcharts – issue about full chart width
Chart’s width is taken from jQuery.width(container), so if you have chart in some hidden tabs or something similar, width will be undefined. In that case default width and height are set (600×400).
highcharts
How to get only whole numbers on the y-axis?
Set allowDecimals: false, see API.
How to display the value instead of percentage in a pie chart using jquery Highcharts
Fixed, Just Changed below line format: ‘<b>{point.name}</b>: {point.percentage:.1f} %’, to format: ‘<b>{point.name}</b>: {point.y:.1f} Rs.’,
Highcharts donut chart without inner pie?
You just need to provide the data as an array of two element (key / value) arrays. Specify an innerSize to get the donut style. So your parameters will contain something like this: … data: [[“Firefox”,6],[“MSIE”,4],[“Chrome”,7]], innerSize: ‘20%’, … Here’s a jsFiddle of a complete example.
Javascript relative time 24 hours ago etc as time [duplicate]
This is actually fairly simple: var yesterday = new Date(new Date().getTime() – (24 * 60 * 60 * 1000)); Simply construct a new Date with the value of the current timestamp minus 24 hours. (24 hours multiplied by 60 minutes in each hour multiplied by 60 seconds in each minute multiplied by 1000 milliseconds in … Read more
Customize tooltip and format the number to 2 decimal places of highcharts
You can use Format Strings to help you format numbers and dates. x Decimal Places View the JSFiddle // point.percentage = 29.9345816 pointFormat: ‘{point.percentage:.0f}%’ // returns: `30%` – (rounds to nearest) pointFormat: ‘{point.percentage:.1f}%’ // returns: `29.9%` pointFormat: ‘{point.percentage:.2f}%’ // returns: `29.93%` pointFormat: ‘{point.percentage:.3f}%’ // returns: `29.935%` Thousands separator View the JSFiddle // point.percentage = 1029.9 … Read more
How to use the tooltip formatter and still display chart color (like it does by default)?
I found the documentation for this (http://api.highcharts.com/highcharts#tooltip.pointFormat). The HTML they’re using is located under pointFormat, not formatter: <span style=”color:{point.color}”>\u25CF</span> {series.name}: <b>{point.y}</b><br/> Here’s the updated code to use to get the colored circles in the tooltip: tooltip: { formatter: function() { var s=”<b>”+ this.x +'</b>’; $.each(this.points, function(i, point) { s += ‘<br/><span style=”color:’ + point.color + … Read more
Disable hover on HighCharts
Disabling tooltip just disables the tooltip but the hover effect is still present. To disable the hover effect, add the following to your plotOptions: plotOptions: { series: { states: { hover: { enabled: false } } } },
How to show only integer values on yAxis of HighChart?
Set the allowDecimals option in the y axis to false in order to prevent non integer tick marks from being displayed: yAxis: { allowDecimals: false, labels: { style: { fontSize: ‘9px’, width: ‘175px’ } }, title: { text: ” } } Here is a demonstration: http://jsfiddle.net/sBC9K/
Reload chart data via JSON with Highcharts
The other answers didn’t work for me. I found the answer in their documentation: http://api.highcharts.com/highcharts#Series Using this method (see JSFiddle example): var chart = new Highcharts.Chart({ chart: { renderTo: ‘container’ }, series: [{ data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] }] }); // the button action $(‘#button’).click(function() { chart.series[0].setData([129.2, … Read more