Highcharts Navigator Zoom - highcharts

I use highcharts, and i just added my navigator. By default it is 100% zoomed out. I have the buttons for my timespans already from my JSP so i do not want to use rangeSelector. How can i programmaticaly zoom in to a specific span of my series?
For example when i click the 5 years button i fetch data for 10 years and i display it all in the chart cause i am 100% zoomed out. What i want is to zoom in to show data for 5 years but still have all the data of the 10 years rendered just in case i wanna zoom out.

You need to use the setExtremes method for xAxis
chart.xAxis[0].setExtremes(min, max);
Live demo: http://jsfiddle.net/BlackLabel/f394h8ps/
API Reference: https://api.highcharts.com/class-reference/Highcharts.Axis#setExtremes

Related

HighCharts - Zoom View Resets

We are building an iOS app using HighCharts components. Defined HIColumn for Bar Chart in XAxis with couple of HISpline (AreaChart) overlay on yAxis that can be toggled. When a user is zoomed in to a specific xAxis period, upon adding the spline, the Chart looses the Zoom and redraw itself. Is it possible to add a spline at runtime without loosing the zoom? These are the things I tried:
Set Min/Max on XAxis. How can we get the current Min/Max/tickInterval when the user zoom in on the xAxis.
Instead of dynamically adding the spline, tried making it visible true/false but still the chart refresh and lose the zoom.
Any help is appreciated.
Thanks!

Like to show all the labels of x axis in highchart

I like to show all months which are on the x-axis even if don't have corresponding data. As in my case, I have data till Sep therefore following months are not being displayed.
I'm using highchart in my application with angular 4.
You can set xAxis.max to 11 (categories have indexes starting from 0) to achieve the desired result.
API reference:
https://api.highcharts.com/highcharts/xAxis.max

customizing Highcharts problems. New

I have got a couple of problems with highcharts, I am using a heat map.
The subtitle is covered by the chart, how could I solve that?.
How could I set a max length for each cell? When I have got just a few elements it is really big.
I dont want to show any colour in the background.
I dont want to show the values of the cells.
1) Looks like possibly bug, reported here: https://github.com/highslide-software/highcharts.com/issues/3255
2) have you tried to use max parametr on axis? http://jsfiddle.net/kJpS6/3/
3) See the option http://jsfiddle.net/kJpS6/2/
4) You can disable it by xAxis labels

Core Plot set custom label for y axis [duplicate]

This question already has answers here:
How do you provide labels for the axis of a Core Plot chart?
(2 answers)
Closed 9 years ago.
i'm new at using Core Plot.
So what i actually want is to set custom labels for the y axis like using an array with different activities like volleyball, soccer and swimming and to this the x axis has dates. Implement the date array to Core Plot was no problem, but now i want, like i told, to have an custom y axis and for every activity i want to show a horizontal bar with the time that soccer or another takes. The Bar Chart should show me which time an activity takes, like soccer starts at 08:00 am and ends 11:00.
i hope you can help me!
Use the CPTAxisLabelingPolicyNone labeling policy for the y-axis and create your own axis labels with the desired label text. There are several demos in the Plot Gallery example app including the labeling policy and the bar chart in the composite plot.

Changing lables on x-axis like from Monday to show M as per window size in HighCharts

I am using highcharts library to draw chart and I need to display Weekdays as labels on x-axis and also to auto reset it like from Monday to M if all weekdays can't fit on screen.
It should be dynamic, which means no flickering should appear when changing label text on x-axis.
Any suggestions?
Thanks in advance.
There is no straight option for that, rather simple workaround:
Disable reflow from Highcharts, use window.resize browser event
In that event add condition to decide showing full name of just shortened, and set this for chart - chart.xAxis[0].dateTimeLabelFormats should be fine
After setting new format, apply new chart dimensions using chart.setSize(w, h)

Resources