如何将google图表中的线条和面积整合到同一图表中
如何将google图表中的线条和面积整合到同一图表中
提问于 2013-05-23 14:32:49
我需要制作图表，其中有使用相同的数据，并显示折线图和面积chart.How，以合成折线图和面积图。这是数据‘年’，‘销售额’，‘费用’，‘合计’，'2004'，1000,400,600，'2005'，1100,200,900，'2006'，6000,5000,1000，'2007'，1000,500,500
我需要销售和费用折线图和总面积图。
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-05-23 16:00:17
你可以使用combo chart。这些是一个图表，允许您将每个系列呈现为以下列表中的不同标记类型:线条、面积、条形、烛台和阶梯区域。
若要为系列指定默认标记类型，请指定seriesType属性。使用series属性可以分别指定每个系列的属性。
链接中有一个您可以编辑的example。你曾经可以做一个compound chart，但可悲的是，这些现在都被弃用了。
面积和线条的示例：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>
Google Visualization API Sample
</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1', {packages: ['corechart']});
</script>
<script type="text/javascript">
function drawVisualization() {
// Create and populate the data table.
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Total'],
['2004', 1000, 400, 600 ],
['2005', 1100, 200, 900 ],
['2006', 6000, 5000, 1000],
['2007', 1000, 500, 500 ],
]);
// Create and draw the visualization.
var ac = new google.visualization.ComboChart(document.getElementById('visualization'));
ac.draw(data, {
title : 'Sales & Expenses by Year',
width: 600,
height: 400,
vAxis: {title: "Sales"},
hAxis: {title: "Year"},
seriesType: "area",
series: {5: {type: "line"}}
});
}
google.setOnLoadCallback(drawVisualization);
</script>
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="visualization" style="width: 600px; height: 400px;"></div>
</body>
</html>打印
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16707076
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号