highcharts – Page 4 – Tarik Billa

Highcharts DateTime Localization

May 30, 2023 by Tarik

Just to complete a little bit this topic: All the options related with language are available here A full Portuguese example: var highchartsOptions = Highcharts.setOptions({ lang: { loading: ‘Aguarde…’, months: [‘Janeiro’, ‘Fevereiro’, ‘Março’, ‘Abril’, ‘Maio’, ‘Junho’, ‘Julho’, ‘Agosto’, ‘Setembro’, ‘Outubro’, ‘Novembro’, ‘Dezembro’], weekdays: [‘Domingo’, ‘Segunda’, ‘Terça’, ‘Quarta’, ‘Quinta’, ‘Sexta’, ‘Sábado’], shortMonths: [‘Jan’, ‘Feb’, ‘Mar’, ‘Abr’, … Read more

Rendering Highcharts using Angular js Directives

May 16, 2023 by Tarik

Example of pie chart: http://jsfiddle.net/csTzc/ function MyCtrl($scope, limitToFilter) { $scope.ideas = [ [‘ideas1’, 1], [‘ideas2’, 8], [‘ideas3’, 5] ]; $scope.limitedIdeas = limitToFilter($scope.ideas, 2); } angular.module(‘myApp’, []) .directive(‘hcPie’, function () { return { restrict: ‘C’, replace: true, scope: { items: ‘=’ }, controller: function ($scope, $element, $attrs) { console.log(2); }, template: ‘<div id=”container” style=”margin: 0 auto”>not … Read more

Programmatically change a chart title in highcharts

May 11, 2023 by Tarik

You can use setTitle(titleObj, subTitleObj) for that. chart.setTitle({text: “New Title”}); See an example: jsfiddle See the API Ref.

How to make highcharts default to 0 for missing data

May 9, 2023 by Tarik

I’ve thorougly searched the API reference of HighCharts, but they don’t offer that option. What they do offer is the option to disable the connection of points when null data is in between (only line and area charts): var chart = new Highcharts.Chart({ plotOptions: { line: { connectNulls: false } } }); This is the … Read more

How to draw a vertical line on HighCharts?

May 8, 2023 by Tarik

You’re looking for a plot line. See the documentation here: http://api.highcharts.com/highcharts#xAxis.plotLines. The basic format is: xAxis: { plotLines: [{ color: ‘#FF0000’, // Red width: 2, value: 5.5 // Position, you’ll have to translate this to the values on your x axis }] },

Disable highcharts tooltip on certain lines, leave it enabled on others?

May 6, 2023 by Tarik

UPDATE use enableMouseTracking: Boolean Notice enableMouseTracking: Boolean was introduced after this question was asked Old Answer I just Disabled the heights point in the Tokyo series here is your code tooltip: { formatter: function() { if(this.series.name == ‘Tokyo’ && this.y == 26.5 ){ return false ; // to disable the tooltip at a point return … Read more

Highcharts: Set y Axis Max and Min dynamically, and not at creation

May 5, 2023 by Tarik

I guess setExtremes is the best way to go about it. Syntax should be: chart.yAxis[0].setExtremes(100,300); If one wants to just set minimum then chart.yAxis[0].setExtremes(100,null); worked for me.

How can I change the colors of my highcharts piechart?

May 1, 2023 by Tarik

Highcharts.setOptions({ colors: [‘#50B432’, ‘#ED561B’, ‘#DDDF00’, ‘#24CBE5’, ‘#64E572’, ‘#FF9655’, ‘#FFF263’, ‘#6AF9C4’] }); Look the following example http://jsfiddle.net/8QufV/

How to modify highcharts legend item click event?

April 20, 2023 by Tarik

You have to use the legendItemClick callback like the following code plotOptions: { line: { events: { legendItemClick: function () { alert(‘I am an alert’); //return false; // <== returning false will cancel the default action } } , showInLegend: true } } Here is working fiddle which shows alert when you click on legends … Read more

how to hide highchart x – axis data values

April 19, 2023 by Tarik

In HighCharts, bar graphs use inverted axes, so the bottom axis is really the Y axis. (See also “column” graphs where the graphic is rotated 90 degrees, in which case the bottom axis is the X axis.) You need to add the following to the yAxis config yAxis: { labels: { enabled: false } } … Read more