echarts表格圆环图配置

最新推荐文章于 2024-05-28 15:45:01 发布

倚楼听风雨的行者

最新推荐文章于 2024-05-28 15:45:01 发布

阅读量908

点赞数

本文链接：https://blog.csdn.net/qq_42972187/article/details/106811972

版权

本文详细介绍了如何使用ECharts库在网页中创建一个结合表格和圆环图的数据展示组件。通过实例代码，展示了如何配置ECharts选项，包括表格数据的加载、圆环图的样式设置以及交互功能的实现，帮助读者理解如何在实际项目中灵活运用ECharts进行复杂图表的构建。

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

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="echarts.js"></script>
		<style>
			html{
				width: 100%;
				height:100%
			}
			body{
				
				width: 100%;
				height:100%;
			}
			.contain{
				width: 100%;
				height:100%;
				background-color:#000a2d;
				overflow: hidden;
			}
			.item{
				width: 100px;
				height: 100px;
				margin-top: 50px;
			}
		</style>
	</head>
	<body>
		<div class="contain">
			<div style="display: flex;">
				<div class="item">
					<div id="main" style="width: 100px;height:140px;"></div>
				</div>
				<div  class="item">
					<div id="main1" style="width: 100px;height:140px;"></div>
				</div>
				<div  class="item">
				<div id=