1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
| <!DOCTYPE html>
| <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">
| <head>
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
| <title></title>
| <meta charset="utf-8" />
| <script th:src="@{${pubzyWebRoot} + 'echarts/echarts.min-3.0.js'}" type="text/javascript"></script>
| <script th:src="@{${pubzyWebRoot} + 'BootStrap4/assets/js/jquery.min.js'}"></script>
| </head>
| <body>
| <div id="div_DQHYSC" style="width: 100%;"></div> <!--地区海洋生产-->
| </body>
| </html>
| <script type="text/javascript">
| jQuery(document).ready(function () {
| $("#div_DQHYSC").css("height", window.innerHeight);
| //地区海洋生产
| var divdqhysc = document.getElementById("div_DQHYSC");
| var dqhysc = echarts.init(divdqhysc);
| var DQHYSCoption = {
| title: {
| text: '产品销售情况1',
| subtext: '',
| x: 'center',
| textStyle: {
| color: '#fff'
| }
| },
| color:['#FF7F50','#b5c334','#fcce10'],
| tooltip: {
| show: true
| },
| // legend: {
| // data: ['销量'],
| // textStyle: {
| // color: '#fff'
| // }
| // },
| xAxis : [
| {
| type : 'category',
| data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"],
| axisLabel: {
| show: true,
| textStyle: {
| color: '#fff'
| }
| },
| splitLine: {
| show: false
| },
| axisLine: {
| lineStyle: {
| color: "#fff"
| }
| },
| }
| ],
| yAxis : [
| {
| type: 'value',
| splitLine: {
| show: false
| },
| axisLabel: {
| textStyle: {
| color: '#fff'
| }
| },
| axisLine: {
| lineStyle: {
| color: "#fff"
| }
| }
| }
| ],
| series : [
| {
| "name":"销量",
| "type":"bar",
| "itemStyle": {
| normal: {
| color: 'rgba(127,231,193,0.09)',
| barBorderColor: '#27d4fb',
| barBorderWidth: 2,
| barBorderRadius: 5,
| shadowBlur: 80,
| shadowColor: 'rgba(255,255,255,1)',
| shadowOffsetX: 0,
| shadowOffsetY: 0
| }
| },
| "data":[5, 20, 40, 10, 10, 20]
| }
| ]
| };
| dqhysc.setOption(DQHYSCoption);
| });
| </script>
|
|
