← Back to branch summary

~irvinamaya/sged/sged

« back to all changes in this revision

Viewing changes to SGED_Project/templates/echarts-5.4.2/test/tooltip-action.html

  • Committer: Irvin
  • Date: 2023-05-31 21:31:01 UTC
  • Revision ID: fa20014@ues.edu.sv-20230531213101-lg41sz0rqtvbejm2
Proyecto Finalizado

Show diffs side-by-side

added added

removed removed

Lines of Context:
SGED_Project/templates/echarts-5.4.2/test/tooltip-action.html
1
 
 
2
 
<!--
3
 
Licensed to the Apache Software Foundation (ASF) under one
4
 
or more contributor license agreements.  See the NOTICE file
5
 
distributed with this work for additional information
6
 
regarding copyright ownership.  The ASF licenses this file
7
 
to you under the Apache License, Version 2.0 (the
8
 
"License"); you may not use this file except in compliance
9
 
with the License.  You may obtain a copy of the License at
10
 
 
11
 
   http://www.apache.org/licenses/LICENSE-2.0
12
 
 
13
 
Unless required by applicable law or agreed to in writing,
14
 
software distributed under the License is distributed on an
15
 
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
16
 
KIND, either express or implied.  See the License for the
17
 
specific language governing permissions and limitations
18
 
under the License.
19
 
-->
20
 
 
21
 
<html>
22
 
    <head>
23
 
        <meta charset="utf-8">
24
 
        <script src="lib/simpleRequire.js"></script>
25
 
        <script src="lib/config.js"></script>
26
 
        <meta name="viewport" content="width=device-width, initial-scale=1" />
27
 
        <link rel="stylesheet" href="lib/reset.css" />
28
 
        <script src="lib/testHelper.js"></script>
29
 
        <script src="tooltipTestHelper.js"></script>
30
 
    </head>
31
 
    <body>
32
 
        <style>
33
 
            h1 {
34
 
                line-height: 60px;
35
 
                height: 60px;
36
 
                background: #ddd;
37
 
                text-align: center;
38
 
                font-weight: bold;
39
 
                font-size: 14px;
40
 
            }
41
 
            .chart {
42
 
                height: 350px;
43
 
            }
44
 
        </style>
45
 
 
46
 
 
47
 
        <h1>showTip: trigger: item, seriesIndex dataIndex, on displayed symbol</h1>
48
 
        <div class="chart" id="category"></div>
49
 
 
50
 
        <h1>showTip: trigger: item, seriesIndex dataIndex, on not displayed symbol (show no tooltip)</h1>
51
 
        <div class="chart" id="category2"></div>
52
 
 
53
 
        <h1>showTip: trigger: axis, seriesIndex dataIndex</h1>
54
 
        <div class="chart" id="category3"></div>
55
 
 
56
 
        <h1>showTip: trigger: x, y</h1>
57
 
        <div class="chart" id="category3"></div>
58
 
 
59
 
 
60
 
 
61
 
 
62
 
 
63
 
        <script>
64
 
 
65
 
            require(['echarts'], function (echarts) {
66
 
 
67
 
                var option = {
68
 
                    tooltip: {
69
 
                    }
70
 
                };
71
 
                var baseTop = 90;
72
 
                var height = 150;
73
 
                var gap = 50;
74
 
                makeCategoryGrid(option, {
75
 
                    grid: {top: baseTop, height: height},
76
 
                    yAxis: {
77
 
                        name: 'axisPointer: line\nno item trigger',
78
 
                        tooltip: {show: true}
79
 
                    },
80
 
                    xAxis: {
81
 
                        tooltip: {show: true}
82
 
                    }
83
 
                });
84
 
                baseTop += height + gap;
85
 
 
86
 
                var dom = document.getElementById('category');
87
 
                if (dom) {
88
 
                    dom.style.height = baseTop + 'px';
89
 
                    var chart = echarts.init(dom);
90
 
                    chart.setOption(option);
91
 
 
92
 
                    setTimeout(function () {
93
 
                        chart.dispatchAction({
94
 
                            type: 'showTip',
95
 
                            seriesIndex: 0,
96
 
                            dataIndex: 2
97
 
                        });
98
 
                    }, 1000);
99
 
                }
100
 
            })
101
 
        </script>
102
 
 
103
 
 
104
 
 
105
 
 
106
 
 
107
 
 
108
 
 
109
 
        <script>
110
 
 
111
 
            require(['echarts'], function (echarts) {
112
 
 
113
 
                var option = {
114
 
                    tooltip: {
115
 
                    }
116
 
                };
117
 
                var baseTop = 90;
118
 
                var height = 150;
119
 
                var gap = 50;
120
 
                makeCategoryGrid(option, {
121
 
                    grid: {top: baseTop, height: height},
122
 
                    yAxis: {
123
 
                        name: 'axisPointer: line\nno item trigger',
124
 
                        tooltip: {show: true}
125
 
                    },
126
 
                    xAxis: {
127
 
                        tooltip: {show: true}
128
 
                    }
129
 
                });
130
 
                baseTop += height + gap;
131
 
 
132
 
                var dom = document.getElementById('category2');
133
 
                if (dom) {
134
 
                    dom.style.height = baseTop + 'px';
135
 
                    var chart = echarts.init(dom);
136
 
                    chart.setOption(option);
137
 
 
138
 
                    setTimeout(function () {
139
 
                        chart.dispatchAction({
140
 
                            type: 'showTip',
141
 
                            seriesIndex: 0,
142
 
                            dataIndex: 1
143
 
                        });
144
 
                    }, 1000);
145
 
                }
146
 
            })
147
 
        </script>
148
 
 
149
 
 
150
 
 
151
 
 
152
 
 
153
 
 
154
 
        <script>
155
 
 
156
 
            require(['echarts'], function (echarts) {
157
 
 
158
 
                var option = {
159
 
                    tooltip: {
160
 
                        trigger: 'axis'
161
 
                    }
162
 
                };
163
 
                var baseTop = 90;
164
 
                var height = 150;
165
 
                var gap = 50;
166
 
                makeCategoryGrid(option, {
167
 
                    grid: {top: baseTop, height: height},
168
 
                    yAxis: {
169
 
                        name: 'axisPointer: line\nno item trigger',
170
 
                        tooltip: {show: true}
171
 
                    },
172
 
                    xAxis: {
173
 
                        tooltip: {show: true}
174
 
                    }
175
 
                });
176
 
                baseTop += height + gap;
177
 
 
178
 
                var dom = document.getElementById('category3');
179
 
                if (dom) {
180
 
                    dom.style.height = baseTop + 'px';
181
 
                    var chart = echarts.init(dom);
182
 
                    chart.setOption(option);
183
 
 
184
 
                    setTimeout(function () {
185
 
                        chart.dispatchAction({
186
 
                            type: 'showTip',
187
 
                            seriesIndex: 0,
188
 
                            dataIndex: 2
189
 
                        });
190
 
                    }, 1000);
191
 
                }
192
 
            })
193
 
        </script>
194
 
 
195
 
 
196
 
 
197
 
 
198
 
    </body>
199
 
</html>
 
 
b'\\ No newline at end of file'