echarts/test/axisPointer-cross-shadow.html at 04e32cb4e8340b0b02a1244eddb3d000b11c1499 · apache/echarts · GitHub

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
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>AxisPointer: cross + shadow</title>
    <script src="../../dist/echarts.js"></script>
</head>

<body>
    <div id="main" style="width: 800px; height: 500px;"></div>

    <script>
        var chart = echarts.init(document.getElementById('main'));

        chart.setOption({
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross'
                    // Current behavior:
                    // - Only crosshair lines are shown
                    // - Shadow background is NOT rendered
                    //
                    // Expected behavior (discussion pending):
                    // - Crosshair lines + shadow background together
                }
            },
            xAxis: {
                type: 'category',
                axisPointer: {
                    type: 'shadow'
                },
                data: ['A', 'B', 'C', 'D']
            },
            yAxis: {
                type: 'value'
            },
            series: [{
                type: 'bar',
                data: [10, 20, 30, 40]
            }]
        });
    </script>
</body>

</html>