I Have Faced The Issue While Creating Triple Y-axis
i have faced the problem while creating triple y-axis in google charts . The problem is space between right side axis. could you please help me. i provided the following code snipp
Solution 1:
i'm thinking this feature was intended for no more than two vAxes
,
although it does appear to work, there aren't any config options to handle this
if you must have three, try textPosition
have one 'in'
and the other 'out'
see following example...
google.charts.load('current', {
callback: function () {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Month');
data.addColumn('number', "Average Temperature");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average 1");
data.addColumn('number',"Average 2")
data.addRows([
[newDate(2014, 0), -.5, 8.7,7,11],
[newDate(2014, 1), .4, 8.7,5,12],
[newDate(2014, 2), .5, 12,6,13],
[newDate(2014, 3), 2.9, 15.7,5,14],
[newDate(2014, 4), 6.3, 18.6,8,15],
[newDate(2014, 5), 9, 20.9,8,16],
[newDate(2014, 6), 10.6, 19.8,9,16],
[newDate(2014, 7), 10.3, 16.6,7,15],
[newDate(2014, 8), 7.4, 13.3,8,14],
[newDate(2014, 9), 4.4, 9.9,12,13],
[newDate(2014, 10), 1.1, 6.6,11,12],
[newDate(2014, 11), -.2, 4.5,11,11]
]);
var classicOptions = {
title: 'Average Temperatures and Daylight in Iceland Throughout the Year',
width: 900,
height: 500,
chartArea: {
width: '50%'
},
series: {
0: {targetAxisIndex: 0},
1: {targetAxisIndex: 1},
2: {targetAxisIndex: 2}
},
vAxes: {
0: {
textPosition: 'out',
title: 'Temps (Celsius)'
},
1: {
textPosition: 'in',
title: 'Daylight',
viewWindow: {
max: 30
}
},
2: {
textPosition: 'out',
title: 'third',
viewWindow: {
max: 40
}
}
},
hAxis: {
ticks: [
newDate(2014, 0), newDate(2014, 1), newDate(2014, 2), newDate(2014, 3),
newDate(2014, 4), newDate(2014, 5), newDate(2014, 6), newDate(2014, 7),
newDate(2014, 8), newDate(2014, 9), newDate(2014, 10), newDate(2014, 11)
]
},
};
var classicChart = new google.visualization.LineChart(document.getElementById('chart_div'));
classicChart.draw(data, classicOptions);
},
packages:['corechart']
});
<scriptsrc="https://www.gstatic.com/charts/loader.js"></script><divid="chart_div"></div>
Post a Comment for "I Have Faced The Issue While Creating Triple Y-axis"