麦粉社区
>
帖子详情

如何停止这个颜色的循环

数据分析 发表于 2026-4-21 08:58
发表于 2026-4-21 08:58:05

我发现这个颜色如果上一个类被没用完会循环到下一个类被,如何停止这种,让每一个类被都从颜色头开始

发表于 2026-4-21 09:59:51
加入创建的宏管理即可,
回复

使用道具 举报

发表于 2026-4-21 10:17:20
可以参考下这个宏代码,不过宏代码是ai生产的仅供参考哦
function main(page: IPage, portlet: IEChartsPortlet) {
    // 获取图表配置
    const opt = portlet.getChartOptions();
    if (!opt) return;

    // 颜色色板:红 → 蓝 → 黄 → 绿 → 青 → 蓝(深) → 紫
    const COLOR_PALETTE: string[] = [
        '#FF4B4B', // 红
        '#3370FF', // 蓝
        '#FFD700', // 黄
        '#52C41A', // 绿
        '#13C2C2', // 青
        '#1890FF', // 深蓝
        '#9254DE', // 紫
    ];

    const series = opt.series || [];
    if (series.length === 0) return;

    // 第一步:遍历所有 series,提取每条系列对应的区域名称
    // series.data 中找第一个有实际值(value 数组长度 > 0)的 data 项,
    // 其 value[1] 即为所属区域名
    const getRegion = (s: any): string => {
        const dataArr = s.data || [];
        for (let i = 0; i < dataArr.length; i++) {
            const val = dataArr.value;
            if (Array.isArray(val) && val.length >= 2 && val[1]) {
                return String(val[1]);
            }
        }
        return '__unknown__';
    };

    // 第二步:按区域分组,记录每个区域内各 series 的出现顺序
    // 用 Map 保持区域首次出现的顺序(不要求特定区域顺序,按数据顺序处理)
    const regionIndexMap: Map = new Map();

    // 第三步:遍历所有 series,按区域内顺序分配颜色
    for (let i = 0; i < series.length; i++) {
        const s = series;
        if (!s) continue;

        const region = getRegion(s);

        // 获取该区域内当前已分配的数量(即当前系列在区域内的序号)
        const indexInRegion: number = regionIndexMap.has(region)
            ? regionIndexMap.get(region)!
            : 0;

        // 按色板循环取色
        const color = COLOR_PALETTE[indexInRegion % COLOR_PALETTE.length];

        // 判空后设置颜色
        s.itemStyle = s.itemStyle || {};
        s.itemStyle.color = color;

        // 更新该区域计数
        regionIndexMap.set(region, indexInRegion + 1);
    }

    // 应用修改后的配置
    portlet.setChartOptions(opt);
}
回复

使用道具 1 举报

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

2回帖数 0关注人数 555浏览人数
最后回复于:2026-4-21 10:17

社区

指南

AI

搜索

快速回复 返回顶部 返回列表