echart 图表两边留白删除

您可以通过调整echarts中grid的left和right属性来控制图表两边的留白。将left和right属性设置为较小的值可以减少留白，例如将它们都设置为3%或4%。示例如下：

var option = {
    grid: {
        left: '3%',
        right: '4%',
        bottom: '8%',
        containLabel: true
    },
    // 其他配置项
};

如果您想完全删除留白，可以将left和right属性都设置为0。但是需要注意的是，这样可能会导致图表的坐标轴标签被截断或者无法显示完全。因此，建议您根据实际情况适当调整留白大小。

相关问题

echart 图表切换

可以通过 EChart 提供的 API，使用事件绑定的方式实现图表切换。具体步骤如下：

1. 在页面中添加多个图表容器，用来存放不同类型的图表。

2. 在 JS 代码中，使用 EChart 的实例化对象创建对应的图表，并将其放置在对应的容器中。

3. 给页面中提供切换图表的元素，如按钮等，绑定点击事件。

4. 在事件处理函数中，根据需要切换的图表类型，使用 EChart 的 setOption 方法更新对应的图表配置项，从而实现图表切换的效果。

下面是一个简单的示例代码：

HTML 代码：

<div id="chart1" style="width: 600px; height: 400px;"></div>
<div id="chart2" style="width: 600px; height: 400px;"></div>
<button id="switchBtn">切换图表</button>

JS 代码：

// 创建 EChart 实例对象
var chart1 = echarts.init(document.getElementById('chart1'));
var chart2 = echarts.init(document.getElementById('chart2'));

// 初始化图表配置项
var option1 = { /* ... */ };
var option2 = { /* ... */ };

// 设置图表配置项
chart1.setOption(option1);
chart2.setOption(option2);

// 绑定按钮点击事件
var switchBtn = document.getElementById('switchBtn');
switchBtn.onclick = function() {
  // 切换图表
  if (chart1.getOption() === option1) {
    chart1.setOption(option2);
    chart2.setOption(option1);
  } else {
    chart1.setOption(option1);
    chart2.setOption(option2);
  }
}

echarts图表两边有空白怎么解决

您可以尝试使用echarts提供的grid组件来调整图表布局，可以设置grid的left、right、top、bottom属性来调整图表与容器的边距。您也可以尝试调整图表的宽度，使其填充容器，或者调整图表中各个组件的尺寸和位置。