{site_name}

{site_name}

🌜 搜索

ECharts中的parallelAxis配置是指使用平行坐标系(Paralle

前端 𝄐 0
echartsy轴name定位,echarts区域选中效果,echarts设置坐标轴颜色,echarts position的设置,echarts设置坐标轴间隔,echarts y轴设置
ECharts中的parallelAxis配置是指使用平行坐标系(Parallel Coordinates)时,配置每个坐标轴的相关参数,如名称、数据类型、坐标轴位置等。

要框选parallel坐标轴,可以使用ECharts中的brush组件。通过设置brush组件的type为"parallel",即可启用平行坐标系的刷子功能,然后可以在图表中用鼠标拖动一个矩形或椭圆形区域来框选需要筛选的数据。

以下是一个简单的示例代码,演示了如何使用ECharts创建一个平行坐标系图表,并配置parallelAxis和brush组件:

js
// 初始化echarts实例
var myChart = echarts.init(document.getElementById('myChart'));

// 准备数据
var data = [
[1, 2, 3, 4],
[2, 4, 6, 8],
[3, 6, 9, 12]
];

// 配置parallelAxis
var parallelAxis = [
{dim: 0, name: 'A'},
{dim: 1, name: 'B'},
{dim: 2, name: 'C'},
{dim: 3, name: 'D'}
];

// 配置brush组件
var brush = {
toolbox: ['rect', 'polygon', 'lineX', 'lineY', 'keep', 'clear'],
xAxisIndex: 'all',
brushLink: 'all',
seriesIndex: 0,
throttleDelay: 300,
outOfBrush: {
colorAlpha: 0.1
}
};

// 配置图表选项
var option = {
parallelAxis: parallelAxis,
brush: brush,
series: [{
type: 'parallel',
data: data
}]
};

// 使用刚指定的配置项和数据显示图表
myChart.setOption(option);


在上面的示例中,我们创建了一个包含4个维度的简单平行坐标系,并通过brush组件启用了刷子功能。此时可以在图表中用鼠标框选区域进行筛选操作。