✨ 功能调用统计使用html截图

resources/template/bar_chart/main.css

@@ -0,0 +1,7 @@
+
+body {
+    position: absolute;
+    left: -8px;
+    top: -8px;
+}
+

resources/template/bar_chart/main.html

@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>ECharts Example</title>
+    <!-- 引入ECharts -->
+    <script src="https://cdn.bootcss.com/echarts/4.2.1/echarts.min.js"></script>
+    <link rel="stylesheet" href="main.css">
+</head>
+<body>
+    <!-- 图表容器 -->
+    <div id="main" style="width: 1000px;height:500px;"></div>
+ 
+    <script type="text/javascript">
+        // 基于准备好的dom，初始化echarts实例
+        var myChart = echarts.init(document.getElementById('main'));
+ 
+        // 指定图表的配置项和数据
+        var option = {
+            xAxis: {
+                type: 'value',
+                boundaryGap: [0, 0.01]
+            },
+            yAxis: {
+                type: 'category',
+                data: {{data.category_data|tojson}}
+            },
+            series: [
+                {
+                    data: {{data.data|tojson}},
+                    type: 'bar',
+                    itemStyle: {
+            // 为每个柱子设置随机颜色
+            color: function () {
+                // 生成一个随机颜色
+                return 'rgb(' +
+                    Math.round(Math.random() * 255) + ',' +
+                    Math.round(Math.random() * 255) + ',' +
+                    Math.round(Math.random() * 255) + ')';
+            }
+        }
+                }
+            ]
+            };
+ 
+        // 使用刚指定的配置项和数据显示图表。
+        myChart.setOption(option);
+    </script>
+</body>
+</html>