极致呈现系列之:Echarts平行坐标系的多维度分析

本文介绍了Echarts中的平行坐标系,用于多维度数据分析。讲解了平行坐标系的基本概念,配置项如坐标轴类型、刻度范围、标签样式等,并展示了在Vue3中创建平行坐标系的步骤,以及如何美化坐标系,包括轴线、刻度、标签样式及间隔的调整。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

平行坐标系简介

平行坐标系是一种将多个维度的数值以平行的直线绘制在坐标系上的可视化方式。通过绘制多条平行直线,并将数据点映射到这些直线上,我们可以直观地观察到不同维度之间的关系和趋势。平行坐标系在数据探索和分析中具有广泛的应用,特别是在多维数据的可视化方面。

平行坐标系的常用配置项

  1. parallelAxis:定义坐标轴和维度的配置。
  • dim:坐标轴的维度序号(索引),指定维度在数据中的位置。
  • name:坐标轴的名称。
  • type:坐标轴类型。可选值如下:
    value数值轴,适用于连续数据。
    category 类目轴,适用于离散的类目数据。为该类型时类目数据可自动从 series.data 或 ataset.source 中取,或者可通过 parallelAxis.data 设置类目数据。 time时间轴,适用于连续的时序数据,与数值轴相比时间轴带有时间的格式化,在刻度计算上也有所不同,例如会根据跨度的范围来决定使用月,星期,日还是小时范围的刻度。
    log对数轴。适用于对数数据。
  • min: 坐标轴刻度最小值。
    可以设置成特殊值 ‘dataMin’,此时取数据在该轴上的最小值作为最小刻度。 不设置时会自动计算最小值保证坐标轴刻度的均匀分布。 在类目轴中,也可以设置为类目的序数(如类目轴 data: [‘类A’, ‘类B’, ‘类C’] 中,序数 2 表示 ‘类C’。也可以设置为负数,如 -3)。 当设置成 function 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:
 min: function (value) {
         return value.min - 20;
 }
其中 value 是一个包含 min 和 max 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最小值,也可返回 null/undefined 来表示“自动计算最小值”(返回 null/undefined 从 v4.8.0 开始支持)。
  • max:坐标轴刻度最大值。
    可以设置成特殊值 ‘dataMax’,此时取数据在该轴上的最大值作为最大刻度。 不设置时会自动计算最大值保证坐标轴刻度的均匀分布。 在类目轴中,也可以设置为类目的序数(如类目轴 data: [‘类A’, ‘类B’, ‘类C’] 中,序数 2 表示 ‘类C’。也可以设置为负数,如 -3)。 当设置成 function 形式时,可以根据计算得出的数据最大最小值设定坐标轴的最小值。如:
max: function (value) {
     return value.max - 20;
}
 其中 value 是一个包含 min 和 max 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最大值,也可返回 null/undefined 来表示“自动计算最大值”(返回 null/undefined 从 v4.8.0 开始支持)。
  • inverse:是否是反向坐标轴,即反向显示维度的刻度,默认为false
  • boundaryGap:是否在坐标轴两端留白,用于美化展示效果,默认为true
  • axisLabel:坐标轴标签的样式配置,比如字体颜色、字号等。
  • axisLine:坐标轴线的样式配置,比如线条颜色、线宽等。
    parallelAxis配置示例,下面示例定义三个维度的配置:
parallelAxis: [
  {
    dim: 0, name: '维度1', type: 'value' },
  {
    dim: 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

九仞山

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值