前言:
在做Echarts图表的时候遇到一个问题:
双X轴图表,第二个X轴对第一个X轴有一个对应并蕴含的关系,也就是说:第二个x轴存在反复文本,反复文本只显示一个值,并居中,所以用到了这两个办法,对echart的 interval 进行配置,给第二个X轴文本和坐标配置显示机会。
获取数组 Array[*] 中间断元素两头值的下标 index
利用场景:
- echarts 坐标轴文本显示居中: 应用echarts options 配置 interval 能够使坐标轴文本居中显示
- echarts 多X坐标轴,第二行的X坐标轴蕴含第一行关系,第二行能够配置配置 interval使文本居中
- 其余场景下须要居中显示的文本
数组:
let arr = [2018, 2018, 2018, 2018, 2019, 2020, 2020, 2020, 2021]
冀望返回:
[false, true, false, false, true, false, true, false, true]
测试用例:
let a = [false, true, false, false, true, false, true, false, true]let arr = [2018, 2018, 2018, 2018, 2019, 2020, 2020, 2020, 2021]let arr1 = [2018]let a1 = [true]let arr2 = [2018, 2018]let a2 = [true, false]let arr3 = [2018, 2018, 2018, 2019, 2019, 2019, 2020, 2021, 2021]let a3 = [false, true, false, false, true, false, true, true, false]let arr4 = [2018, 2018, 2018]let a4 = [false, true, false]let arr5 = [2018, 2021, 2021, 2021, 2021, 2021, 2021]let a5 = [true, false, false, true, false, false, false]let arr6 = [2018, 2021, 2021, 2021, 2021, 2021]let a6 = [true, false, false, true, false, false]let arr7 = []let a7 = []let arr8 = [2018, 2019, 2020, 2021, 2022, 2023]let a8 = [true, true, true, true, true, true]
办法:
function formatter(list) { let arr = [] let count = 0, temp, i = 0 while (i < list.length) { arr.push(false) count += 1 temp = list[i] if (temp !== list[i + 1]) { let index = i - parseInt(count / 2) console.log(index) // 两头值下标 arr[index] = true count = 0 } i++ } return arr}
获取数组 Array[*] 中间断元素第一个值的下标 index
利用场景:
- echarts 坐标轴文本显示居中: 应用echarts options 配置 interval 能够使坐标轴坐标雷同的文本不显示坐标轴坐标,不同的文本用坐标轴坐标宰割
- 反复的文本只显示第一个值
数组:
let arr = [2018, 2018, 2018, 2018, 2019, 2020, 2020, 2020, 2021]
冀望返回:
[true, false, false, false, true, true, false, false, true]
办法:
function formatter(list) { let arr = []; let temp = ""; for (let i = 0; i < list.length; i++) { if (i === 0) { temp = list[i]; arr.push(true); } else { if (temp === list[i]) { arr.push(false); } else { temp = list[i]; arr.push(true); } } } return arr;},