大屏走马灯与echarts图表柱状图饼图开发小结
一、使用ant-design-vue的走马灯(a-carousel)注意事项
<!-- 左边的轮播图片 -->
<a-carousel :after-change="handleCarouselChange" autoplay class="carousel" :transition="transitionName">
<div v-for="(item, index) in items" :key="index" class="carousel-item">
<img :src="item.image" alt="" />
</div>
</a-carousel>after-change不是afterChange否则不生效
ant官网:走马灯 Carousel - Ant Design (antgroup.com)
swiper官网:Swiper中文网-轮播图幻灯片js插件,H5页面前端开发
二、echarts柱状图与饼图使用总结
（1）、柱状图
添加右上角切换柱状图数据功能配置信息
x与y轴的样式调节
实现样式
（2）、饼状图使用总结
1、饼图标题换行\n
2、图例展示样式
3、饼图本身
饼图主色
效果图