- 博客(61)
- 收藏
- 关注
RSS订阅原创 cesium实战-万级entity渲染崩溃及优化
项目需要在cesium地图中绘制小方格，并且每个小方格的颜色都是动态映射的，所以刚开始使用了entity的rectangle绘制，但是达到3w以上之后，会卡顿甚至崩溃，所以需要更好的渲染方案。添加之后，需要实现滑过每个小格子显示对应的值，上面已经在实例化Geometry时给id存储了需要滑过展示的信息，所以接下来绑定滑过事件并创建一个容器展示信息。循环外定义instances空数组，后续用来存储实例，定义colors存储色值，定义customData存储想添加的自定义字段。实例化primitive。
2025-02-07 13:35:07
880
原创 后台任务协作调度API
::: tip文章参考自MDN。后台任务协作调度 API（Cooperative Scheduling of Background Tasks API，也叫后台任务 API，或者简单称为 requestIdleCallback() API）提供了由用户代理决定的，在空闲时间自动执行队列任务的能力。:::浏览器的主线程中心逻辑就是事件循环，主线程需要做的事情太多，其中事件处理和屏幕更新是用户关注性能最明显的两种方式，对于应用来说，防止在事件队列中出现卡顿是很重要的。后台任务API提供了一个新的接口：Idl
2025-02-07 13:30:35
653
原创 log控制台美化输出
console 对象可以从任何全局对象中访问到，如 浏览器作用域上的 Window，以及通过属性控制台作为 worker 中的特定变体的 WorkerGlobalScope。对象提供了浏览器控制台调试的接口（如：Firefox 的 Web console）, 是一个用于调试和记录信息的内置对象，提供了多种方法，可以帮助开发者输出各种信息，进行调试和分析。这里可用的css属性是一部分，并不是全部的css都支持，不过background全写版本支持，可以值为一个图片😀，那就可以放很神奇的内容了。
2025-02-07 13:29:09
910
原创 今天才知道html原生有template和slot
现在项目开发都是使用各种框架，写dom结构也基本上就是div、span来回那么几个，已经很少去关注原生html还有多少精彩的标签支持了，其实说到底这些所谓的js框架、css框架都是为了更方便的使用html、css，框架的升级演进一定是跟着原生html、css主线的，所以，对于基础的html、css、js深入了解使用是很有必要的，知道原生的功能，才能更清楚框架实现的逻辑和思路。
2025-02-07 13:26:50
727
原创 ant-design-vue@1在线主题编辑器实现
:: tip本文介绍工作中碰到的需求，需要基于vue2、ant-design-vue@1版本和less实现使用了ant-design-vue组件库的项目在线配置主题。其中核心就是html支持直接引入，可以使用less.modifyVars修改变量动态编译。
2024-08-26 14:00:50
647
原创 a-select vModel时placeholder不显示问题
问题描述：select 组件绑定了v-model和placeholder，v-model的value默认值为空字符串或者null时，select组件的placeholder属性不显示。placeholder是当前组件值为空时显示的替换文本，只有值为空的时候才会显示。因为在ant-design-vue中，当组件绑定了v-model且绑定值初始化时，值不再是空，即时初始化值为’'也视为有值，所以placeholder自然就不会显示。其实两个方案是一个原理，初始化成undefined未定义就好啦。
2024-06-18 10:29:55
985
1
原创 Cesium1.116开启地形照明报错TypeError: Cesium.createWorldTerrain is not a function
代码如图，运行报错TypeError: Cesium.createWorldTerrain is not a function。原因是：版本 107 中出现了一些重大更改，这些更改在。其中许多与 Promise 和异步操作的处理有关。并且必须使用await。
2024-05-07 10:15:49
1863
1
原创 reFlow和rePaint
浏览器为了避免连续的多次操作导致布局树反复计算，比如第一行修改了元素宽度，第二行修改了元素高度，第三行修改了其他尺寸，浏览器会合并这些操作，并放到消息队列，等 JS 代码全部完成后再进行统一计算。但是代码书写过程中，我修改完可能需要立即获取当前的最新宽度，此时当 JS 获取布局属性时，就可能造成无法获取到最新的布局信息，浏览器在反复权衡下，最终决定当有获取属性的代码时立即 reFlow。，此时能拿到网络返回的HTML字符串文本，接下来开始浏览器渲染的8个大步骤。
2024-04-03 12:01:02
1040
原创 element中El-form-item嵌套popover显示问题
【代码】element中El-form-item嵌套popover显示问题。
2023-02-08 15:55:32
1385
原创 git工作常用命令
git提交文件，本来是首字母小写的文件，改成大写，git提交之后，放到linux报错。手动更新package-lock.json。git忽略和查看已经被忽略的文件。远程某分支已经删除，本地还存在。本地某一个文件修改不需要提交。
2022-11-07 16:55:20
369
原创 2021-08-13 css-项目布局的时候左侧菜单和内容高度不一样 怎么对齐呢？
<!DOCTYPE html><html><head> <title></title> <style type="text/css"> span{ width: 300px; display: inline-block; } </style></head><body> <div style="overflow: hidden;"> <div .
2021-08-19 10:51:27
164
原创 2021-08-13 css 炫酷的loading图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document&l.
2021-08-19 10:51:13
373
原创 2021-08-13 css-js-炫酷的原生选项卡切换
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document&l.
2021-08-13 14:48:00
258
原创 2021-08-13 今年你家商品有优惠券吗
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document&l.
2021-08-13 14:46:25
133
原创 2021-08-13 js-有时候也需要原生js解析地址栏参数的哟
// 获取地址栏参数function getQueryString(name) { let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)') let r = window.location.search.substr(1).match(reg) if (r != null) { return unescape(r[2]) } return null}// 调用getQueryString('id'
2021-08-13 14:44:09
138
原创 2021-08-13 js-商品图片放大镜？
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>放大
2021-08-13 14:43:16
101
原创 2021-08-13 js-你还在为不同浏览器兼容问题而烦恼吗
// 创建一个对象，封装兼容的DOM 2级 事件处理函数 的添加/删除，获取事件对象，阻止事件冒泡，取消默认行为// 对象下只包含属性和方法，属性用于存储数据即变量，方法用来书写功能语句，即函数。var eventUntil = { // 兼容添加事件处理函数 addHandler: function(dom, type, fn) { if (dom.addEventListener) { dom.addEventListener(type, fn
2021-08-13 14:40:49
142
原创 2021-08-13 canvas+js超好看的随机验证码呀
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.
2021-08-13 14:39:27
142
原创 2021-08-13 canvas 超好看的动态粒子背景
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document<
2021-08-13 14:37:10
410
原创 2021-08-13 cavas实现旋转五角星
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> canvas { border: 1px solid #000; } </style></head><body> .
2021-08-13 14:32:25
215
原创 2021-08-13原生div+css实现下拉菜单
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>CSS下拉菜单实例模块</title> <style> body, ul, li {
2021-08-13 14:29:33
249
原创 算法-翻转整数
翻转整数给出一个 32 位的有符号整数，你需要将这个整数中每位上的数字进行反转。示例：示例 1:输入: 123输出: 321示例 2:输入: -123输出: -321示例 3:输入: 120输出: 21思路32位的整数，取值范围为Math.pow(-2, 31) - （Math.pow(2, 31) - 1）超出取值范围 返回0两种方案js方法翻转1实现const resolve = (x) => { if (typeof x !=='numbe
2021-07-09 15:44:40
171
原创 eleemntui的输入框回车导致页面刷新弹框关闭
一、问题描述element的弹框里面放一个input，当一个form元素中只有一个输入框时，回车时会触发浏览器提交事件，导致页面刷新，弹框关闭二、解决办法<el-form @submit.native.prevent>三、兼容方案如果弹框里面的input正好想绑定回车事件，如果用的是elemetui的el-input，@keyup.enter.native="方法名"...
2021-02-25 16:04:02
1168
1
原创 算法-斐波那契数列
什么是斐波那契数列数据这个数列有关十分明显的特点，那是：前面相邻两项之和，构成了后一项。f(0) = 0f(1) = 1f(n + 1) = f(n) + f(n-1)实现console.log(f(1450));//可以计算到1450位，不溢出普通递归 function fib (n) { if (n === 0) return 0 if (n === 1) return 1 return fib(n - 1) + fib(n - 2)} ...
2020-10-26 10:59:35
106
原创 webpack4搭建项目环境
webpack发展史在没有ajax和jQuery之前，前端是不存在打包这个说法的，js没有大规模使用，只做简单的时钟、mp3等效果，直接弄一个js文件引入就行 之后，人们开始使用iframe和flash等于服务器通信，因为这两种方式太过于tricky（棘手），直到google退出gmail的时候，人们发现了XMLHttpRequest，也就是AJAX，从此开始，前端出现了jquery等各种插...
2020-02-17 14:09:03
208
原创 css实现元素居中
定位 + top:50% + translateY(-50%) 父元素text-align:center;子元素display：inline-block； 浮动加相对定位实现.兼容性强，扩展性强。实现原理复杂 父元素的父元素相对定位，父元素绝对定位left为50%，子元素左浮动，相对定位，right为50% 弹性盒居中：display：flex； C3的fit-conte...
2020-02-17 14:08:33
121
原创 Python基础-数据类型-字符串和编码
一、简介龟叔 Guido van Rossum 在1989年圣诞节期间编写的一个编程语言。 Python为我们提供了非常完善的基础代码库，覆盖了网络、文件、GUI、数据库、文本等大量内容，被形象的称为‘内置电池’。 Python的定位：优雅、明确、简单 Python的缺点：运行速度慢，代码不能加密 安装Python，去https://www.python.org/downloads/w...
2020-02-17 14:08:22
160
原创 python的list和tuple-条件判断-循环-dict&set
一、list和tuplelist缺点：查找和插入的时间随着元素的增加而增加；list优点：占用空间小，浪费内存很少。list和tuple是Python内置的有序集合，一个可变，一个不可变。根据需要来选择使用它们。 list有序列表 tuple不可变列表二、条件判断简单的if else if else的判断 判断和input的结合 ...
2020-02-17 14:08:06
492
原创 获取link链接样式(非行间样式)的方法
javascript中获取非行间样式的方法我们都知道一般在javascript中获取样式一般用的是nodeObj.style.attr这个属性的，但是这个属性只能获取行间样式非行间样式比如写在样式表中的样式那么用nodeObj.style.attr获取就是一个空字符。今天我们来介绍下要获取节点计算后的样式就是不一定写在行间样式的方法。1：window.getComputedSty...
2020-01-14 11:48:52
439
原创 http理论
跨域资源共享（CORS）是一种机制 http是tcp/ip协议族的子集tcp/ip协议族tcp/ip协议族分为：应用层、传输层、网络层、数据链路层 为什么分层：如果互联网只由一个协议统筹，某个地方需要改变设计时，就必须把所有部分整体替换掉。而分 层之后只需把变动的层替换掉即可。把各层之间的接口部分规划好之 后，每个层次内部的设计就能够自由改动了。 应用层 决定了向用户提供应用服务...
2020-01-14 11:48:14
235
原创 基础的HTML+css+js
HTML1.HTML 指的是？您的回答：超文本标记语言（Hyper Text Markup Language）2.Web 标准的制定者是？您的回答：万维网联盟（W3C）3.在下列的 HTML 中，哪个是最大的标题？您的回答：<h1>4.在下列的 HTML 中，哪个可以插入折行？您的回答：<br>5.在下列的 HTML 中，哪个可以添加背景...
2020-01-14 11:47:08
448
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人