zoukankan      html  css  js  c++  java
  • ECharts树图节点过多时取消缩放,调整容器高度自适应内容变化

    • 问题现象

      使用ECharts树图,在数据维度大,节点过多时,所看到的内容会重叠交错,无法查看。

    • 原因

      在给定ECharts树图容器尺寸后,无论数据多么庞大或者稀少,数据始终会尝试在给定容器内撑满、全部显示。

    • 处理
    var container = document.getElementById('chart-panel');
    myChart.on('click', function (params) {
        if (params.componentType === 'series') {
            // 点击到了 series 上
            if (!params.value) {
                // 点击的节点有子分支(可点开)
                var elesArr = Array.from(new Set(myChart._chartsViews[0]._data._graphicEls));
                var height = 200; // 这里限制最小高
                var currentHeight = 10 * (elesArr.length - 1) || 10; // 每项10px
                var newHeight = Math.max(currentHeight, height);
                container.style.height = newHeight + 'px';
                myChart.resize();
            }
        }
    });

      每次点击展开或者收缩,都会为ECharts树图重新给定一个高度,以此来实现高度自适应。

    作者:阿晋Joseph
    声明:本站博客均为原创,如有雷同请与我联系。原创不易,请在转载时保留原文链接或者在文章开头加上本人博客地址。如发现错误,欢迎批评指正。更多内容,请访问:https://haha.plus
  • 相关阅读:
    android so壳入口浅析
    PySide图形界面开发(一)
    对一个伪装成微信的加固病毒的分析
    ZjDroid工具介绍及脱壳详细示例
    用pyinstaller把python代码打包成exe可执行文件
    Android下so注入汇总
    利用drozer进行Android渗透测试
    OWASP移动安全漏洞Top 10
    python with原理
    腾讯云
  • 原文地址:https://www.cnblogs.com/yangguojin/p/9965302.html
Copyright © 2011-2022 走看看