使用echart图表开发过程中,经常遇到类目轴(一般x轴)数据名称过长导致图例展示效果很差,写了一个方法当x轴名称较长时换行显示。效果如下图所示:
上述效果的实现方式就是在x轴的axisLabel配置项中使用formatter函数对文本进行换行处理(每行显示的文字个数根据实际效果自定义),具体代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<div class="main" style="width: 100%; height: 100%;">
<div id="myChart" style="height: 600px;">&