AngularJS自定义Echarts标签 — 柱状图Bar

最新推荐文章于 2023-10-20 17:28:00 发布

暗夜无月

最新推荐文章于 2023-10-20 17:28:00 发布

阅读量6.3k

点赞数 3

分类专栏：前端文章标签： angularjs echarts html 图表工具 javascript

本文链接：https://blog.csdn.net/u010870890/article/details/47835535

版权

本文介绍了如何在AngularJS应用中使用Echarts创建柱状图。首先需要引入AngularJS和Echarts的js文件，然后在html页面中设置图表容器，最后在bar.js中编写配置代码并展示图表效果。

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

1、准备文件

AngularJS的js文件：angular.js

Echarts的js文件：echarts-all.js

2、html页面

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Y轴显示数据的柱状图</title>
</head>
<!--加载AngularJS-->
<script src="js/angular/angular.js"></script>
<!--加载ECharts-->
<script src="js/echarts-2.2.7/build/dist/echarts-all.js"></script>
<script src="js/bar-y.js"></script>

<body ng-app="bar" ng-controller="barCtrl">
	<bar-y id="main" legend="legend" item="item" data="data"></bar-y>
</body>
</html>