在我们的数据图表中,x 轴的最后一个 l本文版权归作者所有,未经授权不得转载。【未经授权禁止转载】abel 应该是右对齐的。echarts著作权归作者所有,禁止商业用途转载。【转载请注明来源】 官方没有参数来配置这个功能,导致文字被原创内容,盗版必究。【原创不易,请尊重版权】截掉了半截。挺失望的,这种情况实在是太有本文版权归作者所有,未经授权不得转载。【关注微信公众号:wwwtangshuangnet】需求了。在不能修改源码的情况下,我们只能【原创内容,转载请注明出处】【版权所有,侵权必究】通过自己手动来实现这个需求。
【未经授权禁止转载】著作权归作者所有,禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net原创内容,盗版必究。xAxis: {
type: 'category',
boundaryGap: true,
data: xAxisData,
axisTick: {
show: false,
},
axisLine: {
lineStyle: {
width: 1,
color: '#ccc',
}
},
axisLabel: {
color: '#89889C',
showMinLabel: true,
showMaxLabel: true,
formatter: (() => {
let currentYear = ''
return (value, index) => {
const year = value.substr(0, 4)
const month = value.substr(4, 2)
const shouldNotShowYear = index > 0 && currentYear === year
const isLast = value === xAxisData[xAxisData.length - 1]
const text = shouldNotShowYear ? month : year + '/' + month
const label = isLast && !shouldNotShowYear ? `{a|${text}}` : text
currentYear = year
return label
}
})(),
rich: {
a: {
width: 70,
align: 'left',
},
},
},
上面红色部分是关键,我们要让最后一个 l【未经授权禁止转载】【本文首发于唐霜的博客】abel 靠右对齐,但是它受到宽度的限制【原创不易,请尊重版权】【本文首发于唐霜的博客】,所以我们干脆来了一个宽度,直接将 la【版权所有,侵权必究】【访问 www.tangshuang.net 获取更多精彩内容】bel 的宽度和文字的整体高度相等,这样【原创不易,请尊重版权】原创内容,盗版必究。就可以让文字显示完整了。
未经授权,禁止复制转载。【版权所有,侵权必究】著作权归作者所有,禁止商业用途转载。但是,你可能会说,我怎么知道文字的总体宽未经授权,禁止复制转载。【原创内容,转载请注明出处】度是多少?label 的字数可多可少,不本文作者:唐霜,转载请注明出处。原创内容,盗版必究。可控啊。我会告诉你,有一个东西可以帮助你【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】在 canvas 中获取文本的宽高,你听【原创不易,请尊重版权】【转载请注明来源】说过吗?通过 canvas 计算文字宽高【作者:唐霜】【访问 www.tangshuang.net 获取更多精彩内容】之后,赋值给 rich 里面的 widt【原创内容,转载请注明出处】【原创内容,转载请注明出处】h。echarts 内部会根据你给定的宽转载请注明出处:www.tangshuang.net【原创不易,请尊重版权】度重新布局 x 轴文本的展示,由于我们设【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处:www.tangshuang.net置了 showMaxLabel,所以,无未经授权,禁止复制转载。【本文首发于唐霜的博客】论如何最后一个 label 都会展示,如【版权所有】唐霜 www.tangshuang.net【原创不易,请尊重版权】果空间不够,它会把前一个 label 隐著作权归作者所有,禁止商业用途转载。【原创不易,请尊重版权】藏起来。
【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】
