Hi Maya,
1. You can use the
chart.zoomOut() method. See the demo here:
https://jsfiddle.net/jakubSzuminski/dpwk5y0h/
API Reference:
https://api.highcharts.com/class-refere ... rt#zoomOut
2. There are a few ways you can achieve this:
- You can set an
xAxis.offset which will create distance between the xAxis and the plot. Then, you can create an HTML element with your content and position it manually to be in the empty space. For this solution see this demo:
https://jsfiddle.net/jakubSzuminski/y4bsx6e2/
- You can use the
chart.renderer.text with
useHTML flag to render HTML code in the chart. For this solution see this demo:
https://jsfiddle.net/jakubSzuminski/9h5wL87b/
3. Zooming in or out causes
xAxis.events.afterSetExtremes event to run. In this event, you have access to the
chart object and you can update the
xAxis.labels.formatter to a function which displays not only months but also days. See the demo here:
https://jsfiddle.net/jakubSzuminski/y2uq0e98/1/
Do not hesitate to contact us if you have any more questions!
Best regards,
Jakub