找文章 / 找答案
精选问答 更多内容

[可视化] 如何灵活使用字段隐藏脚本

yh_wjh玄铁二 显示全部楼层 发表于 前天 15:58 |阅读模式 打印 上一主题 下一主题
199
已解决
事情是这样的,因为业务及逻辑原因,现在需要实现在二维表年份选择某年后,图表显示的年份是大于开始时间的,目前想到的是隐藏字段的方法,想请教下大佬有什么比较灵活的脚本写法吗?例:选择开始时间是2020年,则2020年前的年份字段被隐藏掉

最佳答案

mary01 青铜三 关注Ta

2024-12-03 15:58:05

document.addEventListener('DOMContentLoaded', function() { // 年份数据 const years = Array.from({length: 10}, (_, i) => 2023 - i); const data = [25, 45, 60, 75, 90, 105, 120, 135, 150, 165]; // 初始化选择器 const selectElement = document.getElementById('yearSelector'); years.forEach(year => { const option = document.createElement('option'); option.value = ...
查看完整内容
回复

使用道具 举报

精彩评论8

mary01青铜三 显示全部楼层 发表于 前天 15:58
<script>
document.addEventListener('DOMContentLoaded', function() {
    // 年份数据
    const years = Array.from({length: 10}, (_, i) => 2023 - i);
    const data = [25, 45, 60, 75, 90, 105, 120, 135, 150, 165];

    // 初始化选择器
    const selectElement = document.getElementById('yearSelector');
    years.forEach(year => {
        const option = document.createElement('option');
        option.value = year;
        option.textContent = year;
        selectElement.appendChild(option);
    });

    // 图表配置
    const chartConfig = {
        type: 'line',
        data: {
            labels: years,
            datasets: [{
                label: 'Data Over Years',
                data: data,
                borderColor: 'rgba(75, 192, 192, 1)',
                backgroundColor: 'rgba(75, 192, 192, 0.2)',
                fill: true
            }]
        },
        options: {
            responsive: true,
            scales: {
                x: {
                    title: {
                        display: true,
                        text: 'Year'
                    }
                },
                y: {
                    beginAtZero: true
                }
            }
        }
    };

    // 初始化图表
    const ctx = document.getElementById('chartCanvas').getContext('2d');
    let myChart = new Chart(ctx, chartConfig);

    // 监听选择变化
    selectElement.addEventListener('change', function(event) {
        const selectedYear = parseInt(event.target.value);
        const filteredYears = years.filter(year => year >= selectedYear);
        const filteredData = data.slice(years.indexOf(filteredYears[0]));

        // 更新图表的数据源
        myChart.data.labels = filteredYears;
        myChart.data.datasets[0].data = filteredData;
        myChart.update();
    });
});
</script>
回复

使用道具 举报

yhdata_lyaa 显示全部楼层 发表于 前天 16:03
一个年份一个字段吗,看看参数列呢
https://www.yonghongtech.com/rea ... 2%E6%95%B0%E5%88%97
回复

使用道具 举报

yh_wjh玄铁二 显示全部楼层 发表于 前天 16:44
yhdata_lyaa 发表于 2024-12-3 16:03
一个年份一个字段吗,看看参数列呢
https://www.yonghongtech.com/real-help/Z-Suite/10.2/ch/dataprocess_ ...

对,我这个是一个年份一个字段的,不一样
回复

使用道具 举报

yhdata_lyaa 显示全部楼层 发表于 前天 17:22
yh_wjh 发表于 2024-12-3 16:44
对,我这个是一个年份一个字段的,不一样

参数列动态绑定试试呢,勾选需要显示的年份
回复

使用道具 举报

yh_wjh玄铁二 显示全部楼层 发表于 昨天 08:29
yhdata_lyaa 发表于 2024-12-3 17:22
参数列动态绑定试试呢,勾选需要显示的年份

预定义各列属性是新版本才有的吗?我那上面没找到这个功能
回复

使用道具 举报

yhbi老6了白银四 显示全部楼层 发表于 昨天 08:49
我看你这个模型,比较合适用交叉表或者自由式表做,年份横向扩展,然后过滤器再做年月过滤,从而实现你的需求
回复

使用道具 举报

隔壁老帆青铜四 显示全部楼层 发表于 昨天 09:36
参考楼上
回复

使用道具 举报

yh_wjh玄铁二 显示全部楼层 发表于 昨天 13:31
yhbi老6了 发表于 2024-12-4 08:49
我看你这个模型,比较合适用交叉表或者自由式表做,年份横向扩展,然后过滤器再做年月过滤,从而实现你的需 ...

哥们,底表数据量太大了,交叉表或者自由表方法数据显示不出来,如果那么简单就不问了
回复

使用道具 举报

高级模式
您需要登录后才可以回帖 登录 | 免费注册

  • 官方微信

    欢迎关注永洪服务号!收费为0,价值无限

    扫码关注
  • 新浪微博

    让每位用户轻松挖掘数据价值!

    访问新浪微博
  • 智能客服
50W

会员等你来哦

Copyright   ©2012-2024  北京永洪商智科技有限公司  (京ICP备12050607) 京公网安备110110802011451号 |《永洪社区协议》
返回顶部