·那场烟花雨淋湿了梦境· 2021-12-03 19:39 采纳率: 40%
浏览 316
已结题

echarts的两个x轴怎使用datazomm同时控制两个x轴的变化

数据很多设置 dataZoom 就会导致分组错乱 第一个x轴会随着变化,第二个X轴不会变化 ，想让第一个X轴和第二个X轴跟随鼠标滑轮一起变化。

img


img

  • 写回答

1条回答 默认 最新

  • ZionHH 2021-12-04 14:08
    关注

    用echarts connect

    <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <div id="chart1" style="width: 400px; height: 400px"></div>
        <div id="chart2" style="width: 400px; height: 400px"></div>
        
        <script src="https://cdn.jsdelivr.net/npm/echarts@5.2.2/dist/echarts.min.js"></script>
        
        <script type="text/javascript">
            var chart1 = echarts.init(document.getElementById('chart1'))
            var chart2 = echarts.init(document.getElementById('chart2'))
            chart1.setOption({
                xAxis: {
                    type: 'category',
                    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
                },
                yAxis: {
                    type: 'value'
                },
                dataZoom: {
                    type: 'slider'
                },
                series: [
                    {
                        data: [150, 230, 224, 218, 135, 147, 260],
                        type: 'line'
                    }
                ]
            })
            chart2.setOption({
                xAxis: {
                    type: 'category',
                    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
                },
                yAxis: {
                    type: 'value'
                },
                dataZoom: {
                    type: 'slider'
                },
                series: [
                    {
                        data: [150, 230, 224, 218, 135, 147, 260],
                        type: 'line'
                    }
                ]
            })
            echarts.connect([chart1, chart2])
        </script>
    </body>
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

问题事件

  • 系统已结题 12月14日
  • 已采纳回答 12月6日
  • 修改了问题 12月3日
  • 创建了问题 12月3日

悬赏问题

  • ¥100 任意维数的K均值聚类
  • ¥15 stamps做sbas-insar，时序沉降图怎么画
  • ¥15 unity第一人称射击小游戏，有demo，在原脚本的基础上进行修改以达到要求
  • ¥15 买了个传感器，根据商家发的代码和步骤使用但是代码报错了不会改，有没有人可以看看
  • ¥15 关于#Java#的问题，如何解决？
  • ¥15 加热介质是液体，换热器壳侧导热系数和总的导热系数怎么算
  • ¥100 嵌入式系统基于PIC16F882和热敏电阻的数字温度计
  • ¥15 cmd cl 0x000007b
  • ¥20 BAPI_PR_CHANGE how to add account assignment information for service line
  • ¥500 火焰左右视图、视差（基于双目相机）