自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(21)
  • 收藏
  • 关注

原创 element的Dialog组件修改样式不生效的解决办法

摘要: 解决封装弹窗组件样式失效问题的两种方法:1)在Dialog外层包裹div并使用:deep()穿透样式;2)移除style标签的scoped属性。问题根源在于Vue3的多根节点特性导致data-v-xxx属性缺失,影响样式作用域。前者通过创建父级元素使穿透生效,后者通过取消样式隔离实现样式修改。两种方案分别适用于需要保留样式隔离和不需要隔离的场景。(149字)

2025-11-14 11:11:56 254

原创 关于echarts的3D柱状图实现数据顶部展示

本文介绍了使用ECharts实现3D柱状图顶部标签展示的方法。通过自定义renderItem函数,开发者可以绘制3D柱状图的侧面、斜角等立体元素,并在顶部添加标签。实现过程包括:1)封装组件并预留参数;2)绘制柱状图的侧面和斜角图形;3)在series配置中实现3D效果;4)在renderItem返回的children中添加标签配置。文中提供了完整的代码示例,包括坐标计算、图形绘制和渐变填充等关键实现细节,最终效果是通过自定义渲染实现了具有立体感和顶部标签的柱状图。

2025-06-30 16:39:10 385

原创 浅记录vscode打开终端为空白powershell无法键入

vscode打开终端,忽然空白不显示项目文件路径,且忽然无法键入命令

2025-06-04 19:32:16 468

原创 对openlayers的图层动态更新数据源

本文介绍了如何通过动态数据更新实现OpenLayers地图图层的优化渲染。核心思路是:1)通过接口获取并处理数据;2)使用单一图层并通过更新数据源来减少性能开销;3)实现定时数据更新功能。作者分享了关键技术实现:通过命名图层实现图层查找(getLayerByName)、动态更新图层数据源(addOnsiteLayer2Map)的方法,以及如何根据数据类型设置不同样式。文章还记录了使用Vue2+OpenLayers技术栈的开发经验,强调了对地图操作进行总结记录的重要性。

2025-05-27 17:01:02 358

原创 浅记录解决el-select在远程搜索时el-option默认初始不展开

el-select进行远程搜索,自动获取焦点,并且同时展开el-option进行一部分默认项目数据项的展示

2025-03-25 10:29:13 660 2

原创 echarts柱状图二次封装

二次封装echarts柱状图,通过传参控制echarts柱状图的:柱子个数,柱体颜色,Y轴个数是否显示字数,柱体宽度,X轴的文字宽度,是否显示图例,Y轴上方放置单位

2025-02-26 17:53:15 469

原创 echarts实现引导线末端小圆点的一些尝试

直接使用echarts的label配置项来画。这种实现方式画出来的小圆点最好看(个人感觉)不好用的地方是,文字位置难搞serise.label.rich使用富文本来画。使用富文本又有两种方式,一种是创建空内容然后给边框做圆,用padding微调。一种是直接给出{icon|●},至于位置还是得用padding微调。难受点也是在于微调这个地方

2025-01-16 17:19:08 930 1

原创 H5页面唤醒导航应用简单实现

采用的是构造URl,直接打开链接,并且定时判断是否打开成功,如果没有成功,默认打开高德网页导航,实现功能接力,后序的操作丢给了导航软件

2024-12-31 17:25:40 1086

原创 简单记录蚂蚁金服G6--自定义连线和六边形、平行四边形节点

蚂蚁金服G6是一个图可视化引擎,用来搞了个流程关系图,自定义了一下连线和六边形节点,平行四边形节点

2024-12-19 17:59:52 551

原创 openlayers--4.地图小功能:添加监听获取鼠标在地图上的位置信息

添加监听,获取当前地图层级以及当前视图中心获取鼠标在当前地图的位置信息,并且将信息展示出来,跟随鼠标移动改变信息

2024-12-18 17:39:52 799

原创 openlayers--3.地图的全屏和不完全全屏

openlayers从零开始,学习笔记,逐步实现各个功能。通过官方配置实现地图全屏,自行调用浏览器全屏API实现全屏和部分全屏,用js的API--MutationObserver观察DOM树的变化...

2024-11-18 17:10:12 718

原创 openlayers--2.自己实现旋转缩放和复位按钮

openlayers从零开始,学习笔记,逐步实现各个功能。

2024-11-15 17:58:44 386

原创 openlayers--1.了解相关概念并初始化地图

openlayers从零开始,学习笔记记录

2024-11-15 15:25:55 595

原创 动态传参时间轴组件的页面实现

以确保最后渲染每个时间文字的渲染有足够的位置。或者,让时间文字一个在轴上方一个在下方,直接错开,这个方法比较简单,我使用的也是这个方法。没想到别的办法,只好先画一个大一点的三角形在画一个小一点的三角形去覆盖实现线框的效果,如果有好的方法欢迎赐教。:把太多的关于位置的计算放在了html代码里,其实在前面的setPosition(timeArr)函数中可以多做一步,的时候,这个时候文字在页面的渲染会重叠,给用户感官不好,需要优化兼容。3、前面在写实现的计算函数的时候,我发现我的。,这是值得注意的一点。

2024-11-05 10:46:36 831

原创 动态传参的时间轴组件

要实现这个组件,最重要的是计算每个时间节点在该时间轴上的具体位置,这是核心思考。然后就是代码实现,将各个元素动态放置到页面上,算出来的正确位置上。暂时记录,这里计算小标题位置的思路还有问题,有待优化,下一篇是具体的html的实现...要实现时间、阶段标题和当前进度的动态传参,如果没有传入当前进度时间默认为当前时间进度。当前进度日期,如果不传会默认用当前日期计算。当前使用的是vue3和js、css实现。组件所占宽度,也是进度条屏幕所占宽度。当前阶段小标题的文字和线框颜色。

2024-11-04 15:57:05 396

原创 echarts实现区域缩放和数据框选拿到框选数据

数据过多,echarts的图表实现缩放展示数据可以密集的展示,也可以稀疏的展示,能详细看清X轴或者Y轴的数据,这里只实现了对X轴的缩放实现对echarts图表的数据进行框选,并且拿到框选的数据,这里实现的是对X轴进行框选。想要实现怎样的框选效果是可以配置的,不止这一种。

2024-10-21 16:26:30 2095

原创 echarts实现多Y轴

此处基础图表为折线图,要实现多X轴其实就是在yAxis中配置多个数组,并且在对应的series配置中将其配置项yAxisIndex的顺序写好。本次实现用的是vue2,不管是vue2还是vue3配置项都差不多。

2024-08-08 16:21:41 1855

原创 父子组件之间互相影响backdrop-filter的css效果

UI现在很爱使用backdrop-filter这个设计,以前没发现啥问题,开始做地图以后,面板后面挂了一张地图,父子组件之间关于这个效果的影响就格外明显了。当父组件是用来backdrop-filter的设置,子组件也想使用的时候,效果会受到影响,我遇到的是子组件不生效,不知道会不会出现别的情况。2.在子组件上使用使用伪元素,将backdrop-filter的毛玻璃效果使用到伪元素上,这样子组件的背景就不会受到影响。第二个解决方案,我在使用的过程中出现了,子组件的所有内容都被毛玻璃覆盖。

2024-07-30 15:41:25 1336 4

原创 three.js的新版本PointsMaterial渲染问题

遇到的问题是,当我在three.js的0.162.0版本下代码渲染出来了奇奇怪怪的结果。因为在国内几个平台上找了一遍,发现大多数关于three.js的学习文章。记录一下搞了一天的一个问题,现在也还不知道正确的写法应该是什么。但是切换到0.137.5版本下就出来了我想要的结果。严重怀疑大家是不是都是看的同一个视频敲的代码。找了半天官方文档也看了,AI也问了。我发现新版本下的map整上去。在 0.137.5中的渲染。好像是改变了整个渲染的样式。大家的代码都特么是一样的。才能得到我想要的结果。

2024-04-02 15:57:16 478 3

原创 Mac安装nvm管理node版本

Mac安装nvm

2022-12-23 18:00:50 1426

原创 初试hexo--blog搭建

前提:node已经安装完成1.终端命令安装脚手架window+R打开命令窗口,输入命令行:npm install -g @vue/cli进行安装,如果网速过慢会出现报错,或者权限不够需要管理员身份修改权限网络不好,第二次尝试成功可以先运行npm config set registry https://registry.npm.taobao.org提高下载速度再运行npm install -g @vue/cli权限不够,报错,需要修改权限2.hexo网址:文档 | Hexo.

2022-05-19 18:19:30 211

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除