Antv/G2 分组柱状图

最新推荐文章于 2024-04-27 10:02:05 发布

＊且听风吟

最新推荐文章于 2024-04-27 10:02:05 发布

阅读量268

点赞数

分类专栏： # html 文章标签：前端 javascript html

本文链接：https://blog.csdn.net/HH18700418030/article/details/134124664

版权

本文详细介绍了如何使用Antv/G2库创建分组柱状图，展示了在前端项目中利用JavaScript和HTML实现数据可视化的步骤和技巧，帮助读者理解并掌握数据图表的绘制方法。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>自定义图例legend</title>
	<style>
		#chartcontainer {
     
			margin: 50px auto;
			text-align: center;
		}
	</style>
</head>
<!-- 引入G2在线资源 -->
<script src="https://gw.alipayobjects.com/os/lib/antv/g2/3.4.10/dist/g2.min.js"></script>
<body>
	<div id="chartcontainer"></div>
	<script>
        // G2 对数据源格式的要求：JSON 数组，数组的每个元素是一个标准 JSON 对象。
        const data =  [
        {
      month: