echarts 原话的legend的分页自定义

您好，感谢您向我提问。关于echarts中legend分页自定义的问题，可以通过以下步骤实现：

1. 首先，需要设置legend分页参数，具体代码如下：

legend: {
    type: 'scroll',
    pageIconSize: 10,
    pageButtonGap: 10,
    pageTextStyle: {
        color: '#333'
    },
    pageFormatter: function (name) {
        return name.length > 10 ? name.substr(0, 10) + '...' : name;
    },
    pageIcons: {
        horizontal: ['rect', 'rect'],
        vertical: ['rect', 'rect']
    }
}

其中，type设置为'scroll'表示legend启用滚动分页功能。pageIconSize和pageButtonGap分别设置分页图标大小和分页按钮间距。pageTextStyle设置分页文字样式。pageFormatter用于设置分页文字格式，这里是当分页文字长度超过10时，将多余的部分用'...'代替。pageIcons设置分页图标样式。

2. 接着，可以通过echarts实例的setOption方法，动态修改legend分页参数。具体代码如下：

var chart = echarts.init(document.getElementById('myChart'));
var option = {
    // 其他配置项
    legend: {
        // 初始分页参数
        type: 'scroll',
        pageIconSize: 10,
        pageButtonGap: 10,
        pageTextStyle: {
            color: '#333'
        },
        pageFormatter: function (name) {
            return name.length > 10 ? name.substr(0, 10) + '...' : name;
        },
        pageIcons: {
            horizontal: ['rect', 'rect'],
            vertical: ['rect', 'rect']
        }
    },
    // 其他配置项
};
chart.setOption(option);

// 修改分页参数
chart.setOption({
    legend: {
        type: 'scroll',
        pageIconSize: 20,
        pageButtonGap: 20,
        pageTextStyle: {
            color: '#666'
        },
        pageFormatter: function (name) {
            return name.length > 5 ? name.substr(0, 5) + '...' : name;
        },
        pageIcons: {
            horizontal: ['circle', 'rect'],
            vertical: ['circle', 'rect']
        }
    }
});

在这里，先通过echarts.init方法创建一个echarts实例，然后通过setOption方法传入初始的legend分页参数。接着，在需要修改分页参数的时候，再次调用setOption方法，传入新的分页参数即可。

希望以上步骤能够解决您的问题。如有不清楚的地方，可以随时向我提问。