Javascript 有可能在谷歌条形图上画一条趋势线吗?
我试图在柱状图上画一条趋势线。将趋势线添加到选项时,不会显示任何趋势线。有没有办法在柱状图上画出这样的趋势线Javascript 有可能在谷歌条形图上画一条趋势线吗?,javascript,charts,google-api,bar-chart,google-visualization,Javascript,Charts,Google Api,Bar Chart,Google Visualization,我试图在柱状图上画一条趋势线。将趋势线添加到选项时,不会显示任何趋势线。有没有办法在柱状图上画出这样的趋势线 <script type="text/javascript"> google.charts.load('current', {'packages':['bar']}); google.charts.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualiz
<script type="text/javascript">
google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses'],
['2014', 1000, 400],
['2015', 1170, 460],
['2016', 660, 1120],
['2017', 1030, 540]
]);
var options = {
trendlines: {
0: {
color: 'green',
visibleInLegend: true,
}
},
chart: {
title: 'Last 7 Days',
subtitle: 'Sales, Expenses, and Profit: 2014-2017',
},
bars: 'vertical',
vAxis: {format: 'decimal'},
height: 400,
colors: ['#1b9e77', '#d95f02', '#7570b3']
};
var chart = new google.charts.Bar(document.getElementById('chart_div'));
chart.draw(data, google.charts.Bar.convertOptions(options));
}
</script>
load('current',{'packages':['bar']});
google.charts.setOnLoadCallback(drawChart);
函数绘图图(){
var data=google.visualization.arrayToDataTable([
[“年度”、“销售额”、“费用”],
['2014', 1000, 400],
['2015', 1170, 460],
['2016', 660, 1120],
['2017', 1030, 540]
]);
变量选项={
趋势线:{
0: {
颜色:“绿色”,
visibleInLegend:是的,
}
},
图表:{
标题:“过去7天”,
字幕:“销售、费用和利润:2014-2017”,
},
酒吧:“垂直”,
变量:{format:'decimal'},
身高:400,
颜色:['1b9e77'、'd95f02'、'7570b3']
};
var chart=new google.charts.Bar(document.getElementById('chart_div');
绘制(数据,google.charts.Bar.convertOptions(选项));
}
1.趋势线。*
列在
物料图表-->packages:['bar']
--google.charts.bar
然而,有一种方法可以在柱状图上绘制趋势线,使用
核心图表-->软件包:['corechart']
--google.visualization.ColumnChart
您可以使用以下配置选项使图表接近材质的外观
主题:“材料”
2.对于趋势线。*
要处理核心图表,它必须建立在
这意味着轴值不能是字符串
请参阅以下工作片段
google.charts.load('current'{
回调:图纸,
软件包:['corechart']
});
函数绘图图(){
var data=google.visualization.arrayToDataTable([
[“年度”、“销售额”、“费用”],
[新日期(2014年0月1日),1000月400日],
[新日期(2015年0月1日),1170460],
[新日期(2016,0,1),660,1120],
[新日期(2017年0月1日)1030540]
]);
变量选项={
颜色:['#1b9e77','#d95f02'],
哈克斯:{
格式:“yyyy”,
勾号:[新日期(2014,0,1)、新日期(2015,0,1)、新日期(2016,0,1)、新日期(2017,0,1)]
},
身高:400,
主题:"材料",,
标题:“过去7天”,
趋势线:{
0: {
颜色:“绿色”,
visibleInLegend:正确
}
},
言辞:{
格式:“十进制”
}
};
var chart=new google.visualization.ColumnChart(document.getElementById('chart_div'));
图表绘制(数据、选项);
}