score:1
Accepted answer
Set the minimum value for the first yAxis to 0 (with :min => 0).
See this jFiddle: http://jsfiddle.net/4u8eb/
$(function () {
$('#container').highcharts({
chart: {
zoomType: 'xy'
},
title: {
text: 'Average Monthly Temperature and Rainfall in Tokyo'
},
subtitle: {
text: 'Source: WorldClimate.com'
},
xAxis: [{
labels:{
y: 27
},
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
}],
series: [{
linewidth: 4,
name: 'Rainfall',
color: '#4572A7',
yAxis: 0,
data: [9, 9, 9, 10, 9, 9, 10, 9, 9, 9,9,9],
tooltip: {
valueSuffix: ' mm'
}
}, {
name: 'Temperature',
yAxis: 1,
color: '#89A54E',
type: 'spline',
data: [0, 2, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24],
tooltip: {
valueSuffix: '°C'
}
}, {
name: 'baba',
yAxis: 2,
color: '#89A54E',
type: 'spline',
data: [0, 2, 44, 24, 24, 24, 24, 24, 24, 24, 24, 24],
tooltip: {
valueSuffix: '°C'
}
}],
yAxis: [{ // Secondary yAxis
min: 0,
max: 10,
tickInterval: 1,
title: {
text: 'Rainfall',
style: {
color: '#4572A7'
}
},
labels: {
format: '{value} mm',
style: {
color: '#4572A7'
}
}
}, { // Primary yAxis
opposite: true,
min: 0,
labels: {
format: '{value}°C',
style: {
color: '#89A54E'
}
},
title: {
text: 'Temperature',
style: {
color: '#89A54E'
}
}
}, { // 3rd yAxis
min:0,
opposite: true,
title: {
text: 'Baba',
style: {
color: '#4572A7'
}
},
labels: {
format: '{value} mm',
style: {
color: '#4572A7'
}
}
}],
tooltip: {
shared: true
},
legend: {
enabled: false,
layout: 'vertical',
align: 'left',
x: 120,
verticalAlign: 'top',
y: 100,
floating: true,
backgroundColor: '#FFFFFF'
},
});
});
If you comment the minimum value for the first Axis, you get the same problem as you do. With the minimum set, the maximum value is respected.
You could also use "alignTicks: false" in the chart options, but it can get confusing visually.
Source: stackoverflow.com
Related Query
- My Highcharts graph with multiple axis ignores the max value I set for the first yaxis
- HighCharts y-Axis set min max with input field on rendered graph axis
- Highcharts not displaying series data for graph with multiple Y-axes
- Highcharts show the same yAxis start and end value with multiple data series
- Why does this Highcharts graph only show tooltip for the first and last nodes?
- how to plot multiple time series in the same graph with customized x axis
- Highcharts multiple x axis and yaxis. The width of the 1st x-axis is not in sync with browser resize
- Changing the name for 'categories' of x axis while implementing crossfilter with highcharts
- Tooltip for Highcharts graph shows "undefined" in Chrome, but the correct value in Firefox
- Highchart: endOnTick not finishing with the max extreme set for xaxis
- How to set up zoomType for Highcharts with the CodeIgniter lib
- Highcharts - Toggling the lines that run parallel to X axis for each value on Y axis?
- How can I set the units on multiple axis on Highcharts
- How to get the axis value with respect to the cross hair in highcharts
- Getting value from tooltip when hover on svg element on the graph created with highcharts
- How can I align the scale on my HighCharts graph with the axis rather than the margins?
- Any way to set min & max value for HighCharts Heatmap data?
- min and max axis value not respected in HighCharts chart with a logarithmic axis
- How to set a function to the max value in boxplot highcharts
- Want to set the y axis ticks to a fixed value Highcharts
- HIGHCHARTS - Given a series with UNIX stamps and values pairs for the data, how do I show only the date for the first and last point on xAxis?
- Highcharts calculated max value not working with 2+ Y axis
- how to set the interval of points on Y - Axis highcharts
- How replicate the value of Y Axis on both sides of the axis in Highcharts
- How can I get the max value of a y axis at highcharts?
- HighCharts - two Y-axis, one with max value
- Highcharts - How to set custom colors for the series
- Highcharts - set maximum range for yAxis but keep axis dynamic within that range
- How to set a static minimum value for axes in Highcharts
- How do I get the value of a highcharts graph point on mouseover?
More Query from same tag
- Highchart Axis Update/ chart redraw
- How can I group the yAxis of a HighStock Chart by Month Only Using (Millisecond) Time-Stamps?
- Chart issues with *ngIf in angular 2
- Vue.js life-cycle hook for v-cloak
- High chart spline chart is not plotting with single data
- highcharts stockchart 1m and 3m not enabled
- How to overcome missing values in Highstock-Stockchart?
- highcharts display hour minute on x-axis
- Highcharts - Guage - Changing the color and radius of the center black dot(circle)
- Set line to 0 if no measurements between dates in highchart
- Selecting a point programmatically on stockchart from HighCharts library in GWT (Also in native JS)
- Highcharts - load and refresh csv
- Overlap datalabels line chart highcharts
- Remove axis line from highchart graphic
- Rails 4: chart is not showing
- Unable to update plot border width in highcharts chart
- running total in highcharts
- Problem with multiple labels in Highchart
- Highcharts legend data interactivity issues
- High Charts : Two lines showing instead of one
- How to create chart using Springboot Json api
- Set Highchart cursor/pointer with a click on a gmap polyline point
- Highcharts Synchronized charts display tooltip
- How do you get a colorByPoint appearance in Highcharts without coloring all the bars in a group the same color?
- Can I colour individual points with stacked columns in Highcharts?
- Why does highcharts sankey chart sometimes combine multiple nodes with same node name but different Id into one and hide the lines?
- Highcharts: Line graph with half solid line and half dotted line?
- Highcharts xAxis padding is lost when navigator when zooming in and out and can't get the padding back when zoom out
- Zoom In & Zoom Out buttons - highcharts
- Highcharts: bar/column chart label position with values of 0