Google 图表中未显示次要 y 轴值
Secondary y axis values not displayed in Google Charts
我正在尝试将辅助 y 轴与 google 图表一起使用。
我有这个代码:
arrdata.addRows([
[ObservationDateTime, observationValueCD4, observationValueViralLoad]
]);
}
// start of drawchart()
var options2 = {
title: 'CD4 && ViralLoad v/s DateTime',
vAxes: [{
title: 'CD4',
textStyle: {
color: 'blue'
}
}, // Axis 0
{
title: 'Viral Load',
textStyle: {
color: 'red'
}
} // Axis 1
],
hAxis: {
title: "Date"
},
series: {
0: {
type: "bars",
targetAxisIndex: 0
},
1: {
type: "line",
targetAxisIndex: 1
}
}
};
但是,我对呈现的内容有点困惑:
它只渲染蓝色垂直直线向上,渲染中没有红色 line.Though 辅助 y 轴。
我的期望: 我希望左侧 y 轴上的值是蓝色条,右侧 y 轴上的值是红线。
没有更多代码或示例数据,我无法确定您的问题是什么,但您的选择似乎符合您的要求。
google.load("visualization", "1", {
packages: ["corechart"]
});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
["ObservationDateTime", "observationValueCD4", "observationValueViralLoad"],
[new Date(2015,1,1), 9, 4],
[new Date(2015,2,1), 11, 6],
[new Date(2015,3,1), 20, 2],
[new Date(2015,4,1), 21, 3]
]);
var options2 = {
title: 'CD4 && ViralLoad v/s DateTime',
vAxes: [{
title: 'CD4',
textStyle: {
color: 'blue'
}
}, // Axis 0
{
title: 'Viral Load',
textStyle: {
color: 'red'
}
} // Axis 1
],
hAxis: {
title: "Date"
},
series: {
0: {
type: "bars",
targetAxisIndex: 0
},
1: {
type: "line",
targetAxisIndex: 1
}
}
};
var chart = new google.visualization.LineChart(document.getElementById("chart"));
chart.draw(data, options2);
}
// start of drawchart()
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="chart" style="width: 900px; height: 300px;"></div>
我正在尝试将辅助 y 轴与 google 图表一起使用。
我有这个代码:
arrdata.addRows([
[ObservationDateTime, observationValueCD4, observationValueViralLoad]
]);
}
// start of drawchart()
var options2 = {
title: 'CD4 && ViralLoad v/s DateTime',
vAxes: [{
title: 'CD4',
textStyle: {
color: 'blue'
}
}, // Axis 0
{
title: 'Viral Load',
textStyle: {
color: 'red'
}
} // Axis 1
],
hAxis: {
title: "Date"
},
series: {
0: {
type: "bars",
targetAxisIndex: 0
},
1: {
type: "line",
targetAxisIndex: 1
}
}
};
但是,我对呈现的内容有点困惑: 它只渲染蓝色垂直直线向上,渲染中没有红色 line.Though 辅助 y 轴。
我的期望: 我希望左侧 y 轴上的值是蓝色条,右侧 y 轴上的值是红线。
没有更多代码或示例数据,我无法确定您的问题是什么,但您的选择似乎符合您的要求。
google.load("visualization", "1", {
packages: ["corechart"]
});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
["ObservationDateTime", "observationValueCD4", "observationValueViralLoad"],
[new Date(2015,1,1), 9, 4],
[new Date(2015,2,1), 11, 6],
[new Date(2015,3,1), 20, 2],
[new Date(2015,4,1), 21, 3]
]);
var options2 = {
title: 'CD4 && ViralLoad v/s DateTime',
vAxes: [{
title: 'CD4',
textStyle: {
color: 'blue'
}
}, // Axis 0
{
title: 'Viral Load',
textStyle: {
color: 'red'
}
} // Axis 1
],
hAxis: {
title: "Date"
},
series: {
0: {
type: "bars",
targetAxisIndex: 0
},
1: {
type: "line",
targetAxisIndex: 1
}
}
};
var chart = new google.visualization.LineChart(document.getElementById("chart"));
chart.draw(data, options2);
}
// start of drawchart()
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="chart" style="width: 900px; height: 300px;"></div>