- 博客(43)
- 收藏
- 关注

原创 低代码数据可视化开源项目源码阅读总结(二)
在阅读开源代码的画布代码和组内配置代码时,发现一个问题,当配置成组组件的透明度的时候,组内组件的操作框也变得透明,这里的实现是有问题的。笔者阅读其画布中的组件代码,发现因为组内组件(包含其操作框)因为嵌套在成组组件内部,所以设置成组组件透明度的时候,组内组件的操作框必然会受到影响。我们理想的情况是操作框不受任何组件,组内配置的透明度的影响。这样,即便成组组件组内配置为完全透明的时候,我们仍可看到成组组件内部的组件的操作框,并且进行组件操作。
2023-12-18 13:17:07
683
原创 new Proxy的应用
如果遇到所有权限都有,那么接口只返回布尔值true,就不罗列所有权限id了。比如我们项目中,存储一个全局变量,authObject,这个变量是用来存储权限信息的,key是权限id,value是true/1或者false/0.
2025-03-22 18:40:15
159
原创 js文件引用方式及其同步执行与异步执行
同步加载适用于需要依赖该文件中的代码执行结果的情况,而异步加载适用于不需要依赖该文件中的代码执行结果的情况,可以优化页面加载速度。
2025-03-19 00:30:37
734
原创 Vue技术讲解
那么我们可以通过v-breadcrumb的directives 控制面包屑名称显示,同时为了避免重复代码,我们使用mixin。我们想要将每个页面的面包屑设置为当前选中的菜单项的名称,而不是固定将各个页面的面包屑名称分别写在各个页面内。站内信消息列表数据最多可达1000条数据,数据加载过多,前端页面卡顿。我们可以使用虚拟滚动列表库进行优化。如下,根据权限控制新增按钮是否显示。
2024-12-11 08:07:15
261
原创 前端阻止浏览器自动填充密码和用户名的方法
这里还需要注意的是,文本输入框和密码框是在页面存在的,但是用了绝对定位,top和left为极大值,绝对定位使得其脱离文档流,不影响页面样式,top和left为极大值,使得,不论这两个输入框是相对于谁定位的,我们屏幕宽度分辨率,一般也就2000px左右的宽度,设置为9999px的极大值,我们是在网页上看不到这两个输入框的。经笔者实践,通过隐藏的文本输入框和密码框去阻止浏览器的自动填充的这个方法,是兼容性最好的方法。这样浏览器就只会自动填充这两个输入框,文本输入框填充用户名,密码输入框填充密码。
2024-09-13 09:01:54
626
原创 关于前端分辨率兼容和显示器缩放兼容的处理
如下两图所示,在不同分辨率下,页面的宽度和分辨率的宽度是一致的。所以其实我们在1920的宽度分辨率下,把窗口缩小宽度到1600,是可以模拟1600分辨率的情况的。那么我们把我们的窗口宽度调整为1920/1.25% = 1536px的宽度,即可模拟测试人员的电脑显示状况,方便我们复现问题。所以当测试人员给我们提分辨率兼容的问题单的时候,一般都是我们开发的页面,在更小的分辨率尺寸中显示异常。那么其实我们可以通过缩小我们的浏览器窗口,达到模拟测试人员机器的电脑分辨率的情况。但是有时候,测试人员的电脑会进行放大。
2024-09-07 12:36:25
1215
原创 修改密码模块中对轮询接口响应用户失效问题的处理
但是这个主项目还引入了其他子项目,其他子项目也有轮询接口,如果每增加一个子项目,我们都像这个主项目的框架一样,去根据本地存储key判断是否轮询,来避免因为修改密码后用户token失效提前跳转登录页面,那么拓展性就很差。而主项目框架,对302进行手动重定向,保证了超时的时候会重新登录,又结合了本地存储的key,保证了修改密码后,不去请求轮询接口,不让轮询接口302重定向影响到修改密码成功后前端逻辑的执行。我们可以在修改密码成功后,在本地存储一个key,当有这个key存储的时候,不去请求轮询接口。
2024-09-07 10:53:20
583
原创 svn使用教程学习
(todo 是本地没有提交的和远程的发生了冲突吗,本地的还没有提交是吗?就是使用beyondCompare软件,比较两个分支代码,查看两个分支代码差异,然后进行选取合并,最后将合并的结果提交到远程。这里的流程是,把test.text添加到忽略列表,然后提交的时候,果然就没有doc/test.txt文件了。博主每次都选择他们的解决冲突,如果是选择自己的解决冲突,应该要在解决完冲突后,进行提交才算吧?暂存的时候,如果选择的是之前的暂存版本,那么会生成新的版本,就是同一个暂存名字,有两个版本。
2024-08-24 23:06:12
1010
原创 vue学习笔记
没有显式包含在列表中的全局对象将不能在模板内表达式中访问,例如用户附加在 window 上的属性。v-bind 指令指示 Vue 将元素的 id attribute 与组件的 dynamicId 属性保持一致。如果绑定的值是 null 或者 undefined,那么该 attribute 将会从渲染的元素上移除。模板中的表达式将被沙盒化,仅能够访问到有限的全局对象列表。问题之:这样绑定的v-bind的,可以是动态的值吗?所以表现和真值是一样的。问题之,如下,什么叫做直接写在html文件里的模板?
2024-08-01 18:25:36
485
原创 React-Three-Fiber.js 用于 Three.js 的 React 渲染器
React-three-fiber 的核心概念是将 three.js 的场景、相机和渲染器作为 React 组件进行封装,使得开发者可以像使用普通 React 组件一样来创建和管理 3D 元素。这里呢我们要介绍一下Fiber的基础概念,了解Fiber组件的props是如何和Threejs的元素的属性对应上的。对于一些Threejs中的元素,他们本来有一些set方法,在Fiber组件上呢,有更简化的写法可以达到同样的效果(比如颜色、向量、位置等等)。— 它设置了一个场景和相机,这是渲染必须的环节。
2024-07-29 12:13:39
403
原创 react-intl国际化{}大括号转义
根据源码formatMessage实现,可知,如果要在国际化中使用大括号本身,那么我们用引号包裹大括号即可。
2024-07-15 19:15:36
283
原创 前端文件下载的方式
方案:a标签可以携带cookie,所以可以有另一种解决方法,在下载文件前,发送一个请求获取一个临时token通过cookie进行携带,a标签下载是流式下载,会把服务器的文件像流水一样存储到本地磁盘,所以下载直接能看到下载,不会将文件缓存到浏览器。**如果文件小还行,文件大了就会出现点击了下载,但是没有反应,过了几分钟后才出现了下载,这种等待时间就是将服务器端的那个文件转成了blob(res.blob()花的时间特别长),才进行a标签的流式下载(这里页面才开始出现有下载的交互体现)
2024-07-11 19:52:20
1141
原创 Java学习(二)
我们必须要有东西去接收字符串,不然会如上报错。所以我们改动如下;如果希望在一个类的多个重载的构造函数中相互进行调用,那么就只能通过this的方式进行调用。如下,可以在单参的构造方法中,通过this(),调用其同一个类当中的无参的构造方法。父类有eat方法,但是子类也想有自己的eat方法,且和父类的eat方法不一样。我们可以用方法的重写。我们回顾下方法的重载:那么关于方法的重写,规则如下:鼠标悬浮,可以看出来,被调用的是父类还是子类中的方法。方法重写1、有继承关系的子类中。
2024-07-04 21:13:20
692
原创 解析gitlab中graph图(持续更新)
问题单202210260971-antd组件badge组件因升级丢失样式 这个提交为什么只合入了iotprivate的v3.7.0,而没有合入iotprivate的v3.6.0,根据graph显示,这个问题改在b02分支,后b02分支合入了二期的merge分支,二期分支沿用merge分支,二期分支在v3.6.0前就合入了iotprivate分支,但是为什么在v3.7.0才看到这个问题的提交,是我的理解错误了吗?二期分支明明是有这个commit的合入的。
2024-04-22 20:26:51
710
原创 前端数据可视化d3技术简介
本文参考自mooc教程。(Data-Driven Documents) 是一个 Javascript 图形库,基于 Canvas、Svg 和 HTML。D3强调web标准为您提供了现代浏览器的完整功能,而没有将自己的专有框架与强大的可视化组件和数据驱动的DOM操作方法相结合。D3是一个专门用于2d场景数据可视化的库。WHY社区中已经有很多处理数据可视化的js库。我们为什么要学习D3?高度打包的库(如echarts、highcharts)可以在PC和移动设备上很好地运行,并且与当前大多数浏览器兼容。
2024-03-27 20:00:41
2280
原创 低代码数据可视化开源项目go-view阅读总结
右侧的配置栏组件,组件库里的每个组件都单独写一份vue的模板文件。对于多个组件共有的配置,会进行公共组件的抽离,如对于柱状图和折线图组件,这两个图表组件有许多共有的配置,对共有的配置,抽离为global-setting组件进行组件复用。那么在用户进行配置的修改后,如何去改动组件的配置数据呢?这里就用到了vue里的双向数据绑定v-model的指令,去进行数据的同步。
2024-03-27 09:48:26
3675
1
原创 数据可视化系列-echarts基本概念讲解
本文参考自mooc数据可视化教程。ECharts 基本概念ECharts 基本概念: 系列系列(series)是指:一组数值映射成对应的图案例:多系列混合::: details<!DOCTYPE html><html> <head> <meta charset="utf-8"> <script src="https://cdn.jsdelivr.net/npm/echarts@4.7.0/dist/echarts.m
2023-12-17 22:44:18
1467
原创 低代码数据可视化开源项目源码阅读总结
该项目是一款数据可视化应用搭建工具,是仿照的阿里云datav项目,使用vue技术栈进行实现的。因为本人工作中需要开发的可视化拖拽项目也是仿照的阿里云datav项目,但是阿里云项目并未开源,故想要通过阅读该项目的项目实现思路,以应用到后续工作中的可视化拖拽项目的开发中。画布中除了柱状图,通用标题等组件库中的组件,也有类型是组的组件,当我们选中一个或多个组件进行成组操作的时候,会创建一个类型为组的组件,将选中的组件作为children包裹起来。那么,在画布中,组组件和组件库组件的位置是如何定位的?
2023-09-12 07:50:29
728
原创 百度地图数据可视化
百度地图入门百度开发者账号申请官方教程控制台API基本用法::: details<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> &l
2023-06-24 21:39:49
431
1
原创 数据可视化-canvas
/ 获取 DOM 对象constgetContext'2d';// 获取 Canvas 对象'red';// 填充为红色fillRect005050;// 绘制矩形beginPath;// 开始绘制路径1;// 线条宽度'blue';// 线条填充色moveTo100100;// 起点坐标lineTo25075;// 中间点坐标lineTo300100;// 终点坐标stroke;// 绘制线段beginPath;2;
2023-04-12 19:55:26
164
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人