分类:学习笔记

note

echarts横向自定义图片柱状图

echarts横向自定义图片柱状图
echarts柱状图开发中,我们需要渲染各种各样的柱状图,今天整理的柱状图为自定义图片横向柱状图。 这里我们将柱状图分为两部分 一部分为主体,主体部分拉伸不受太大的视觉影响,一部分为最右侧的异形部分。 实例代码 drawLine() { var that = thi...

yekong 1年前 (2023-12-07) 喜欢

echarts柱状图增加顶部和底部图标

echarts柱状图增加顶部和底部图标
echarts柱状图开发中,我们需要在柱状图的顶部添加定义小方块盖在柱状图上面,让柱状图看起来像盖了一个帽子,柱状图的底部增加一个三角形装饰图标。 效果解析 颜色渐变 首先柱状图是自下而上颜色渐渐变淡的效果,我们使用颜色渐变graphic.LinearGradient来实现。 ...

yekong 1年前 (2023-12-04) 喜欢

css父元素设置了display: flex;子元素设置宽度无效

css父元素设置了display: flex;子元素设置宽度无效
数据可视化大屏项目开发中,当父元素设置了display: flex;后,子元素指定宽度无效,文字仍然会超出边界外。 解决办法 给元素添加min-width: 0;属性,这样元素的宽度就不会超过你设置的值了。 修改前 .tableBody2 { height: 32p...

yekong 1年前 (2023-12-03) 喜欢

echarts 伪3d圆柱体堆叠柱状图

echarts 伪3d圆柱体堆叠柱状图
echarts 伪3d圆柱体堆叠柱状图效果实例,柱状图为渐变色堆叠为3d圆柱体柱状图,每个柱状图底部有个半圆效果会遮挡住下面的柱状图,柱状图顶部有一个椭圆遮挡柱状图顶部,让柱状图看起来像一个圆柱体。 实例代码 drawEcharts() { var that = this ...

yekong 1年前 (2023-11-30) 喜欢

highcharts3d饼状图渲染时出现没有高度的情况

highcharts3d饼状图渲染时出现没有高度的情况
highcharts3d饼状图渲染时正常情况下渲染出来应该是类似下面的情况,但是在实际开发中,如果和其他类型的3d饼状图在一块开发时,会出现饼状图没有高度的情况,类似图2的效果。 图1: 图2: 解决办法 我们在设置饼状图数据的时候,可以给一个h值这个h值就是饼状图的高度了。...

yekong 1年前 (2023-11-30) 喜欢

vue2 3d轮播插件 - vue-carousel-3d介绍

vue2 3d轮播插件 - vue-carousel-3d介绍
vue2项目开发中,轮播时,会需要一些类似3d的效果,今天整理的插件:vue-carousel-3d一个3d轮播插件。如果是在vue3项目中运行的话可以使用:vue3 3d轮播插件 - vue3-carousel-3d介绍 插件效果截图 动态效果 api文档 vue2 3d轮...

yekong 1年前 (2023-11-30) 喜欢

echarts当tooltip显示隐藏时触发事件

echarts当tooltip显示隐藏时触发事件
echarts饼状图中心需要显示自定义数字,并且鼠标放在数字上需要弹窗显示,这样我们就需要在tooltip显示和隐藏时动态调整数字的图层,以避免互相影响。 对于Vue.js项目中,如果你想在tooltip显示时改变echartsBody2的层级(z-index),你可以在tool...

yekong 1年前 (2023-11-30) 喜欢

echarts荆门市地图geoJson数据实例下载

echarts荆门市地图geoJson数据实例下载
数据可视化大屏 项目中经常会遇到需要渲染echarts地图 的情况,为了方便不同地区的数据使用,将一些地图数据整理出来,供大家参考,今天为大家整理的是echarts荆门市地区地图geoJson数据。 荆门,湖北省辖地级市,位于湖北省中部,地处汉江中下游,北接襄阳市和随州市,西靠宜...

yekong 1年前 (2023-11-30) 喜欢