Echarts 柱状图横向展示和竖向展示

还是大剑师兰特

已于 2023-02-27 15:23:51 修改

阅读量2.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： # Echarts 实战应用 100+ 文章标签： echarts vue.js echarts纵向展示 echarts横向展示

于 2023-02-22 11:32:44 首次发布

本文链接：https://blog.youkuaiyun.com/cuclife/article/details/129159142

Echarts 实战应用 100+ 专栏收录该内容

25 篇文章 ¥29.90 ¥99.00

订阅专栏

超级会员免费看

该文章提供了两个Vue组件示例，分别展示了使用ECharts库创建的横向和纵向柱状图。作者强调了X轴和Y轴参数互换来实现展示方向的转换，并提供了完整的源代码。示例包括数据、图表配置和样式设置，适用于学习和商业项目。

在这里插入图片描述

第021个

点击查看专栏目录

本示例是显示柱状图，分别是横向展示和纵向展示。关键是X轴和Y轴的参数互换。

文章目录

横向示例效果

在这里插入图片描述

横向示例源代码（共81行）

/*
* @Author: 还是大剑师兰特（优快云）
* @下面源代码版权归还是大剑师兰特所有，可供学习或商业项目中借鉴，未经授权，不得重复地发表到博客、论坛，问答，git等公共空间或网站中。
* @Email: 2909222303@qq.com
* @First published in 优快云
* @First published time: 2023-02-22
*/
<template>
	<div class="container">