05 2022 档案
摘要：概念 很多系列，例如line（折线图），bar（柱状图），scatter（散点图），hearmap（热力图）等等，需要运行在“坐标系”上。坐标系用于布局这些图，以及显示数据的刻度等等。 echarts中支持的坐标系 直角坐标系 极坐标系 地理坐标系（GEO） 单轴坐标系 日历坐标系 一个坐标系，可能
阅读全文
摘要：组件：echarts中除了绘图之外其它补分，都可以抽象为组件。如：xAxis（直角坐标系X轴），yAxis（直角坐标系Y轴），grid（直角坐标系地板），angleAxis（极坐标系）。。。。一些列在setoption时，与series层级并列的设置 定位：大多数组件都提供了定位属性，我们可以采用类
阅读全文
摘要：系列series是指：一组数值映射成对应的图 dataset用于单独的数据集声明，从而数据可以单独管理，被多个组件复用，并且可以自由指定数据到视觉的映射。这一特性将逻辑和数据分离，带来更好的复用，并易于理解 多系列：多个图表公用一个坐标系 多系列 <!DOCTYPE html> <html> <he
阅读全文
摘要：引入echarts 获取容器DOM 使用echrats.init（DOM）初始化图表容器 调用setOption，进行配置 自定义主题直接去官网进行构建，并复制官网生成的JS代码进行粘贴即可 const chartDom = document.getElementById('chart'); /**
阅读全文
摘要：安装： npm install json-server -d 在项目根目录下新建__json_server_mock__文件夹，在内新建db.json： { "users": [] } 在package.json中配置启动命令 "json-server": "json-server __json_s
阅读全文
摘要：组件通信 props emits 事件总线 eventbus 使用mitt库 通过defineExpose，getCurrentInstance provide inject v-model vuex 响应式 ref reactive toRef toRefs 监听 watch watchEffec
阅读全文
摘要：几何体对象 Geometry vertices colors faces face3属性 VertextColors bufferGeometry attributes position color normal index var geometry = new THREE.BoxGeometry(
阅读全文
摘要：如果我们需要做自定义的几何形状，就得用到顶点这个概念，根据顶点去制作几何形状，上色也可以根据顶点颜色去设置 顶点 顶点位置 顶点颜色 顶点法向量光照计算（一个顶点对应一个法向量），法向量即图形面向哪个方向，有了法向量之后使得几何模型在光照下有了黑白灰，有了颜色的过渡 buffer几何与普通几何顶点数
阅读全文
摘要：//点光源 var point = new THREE.PointLight(0xffffff); //点光源位置设置 point.position.set(400, 200, 300); scene.add(point); //点光源添加到场景中 // 点光源2 位置和point关于原点对称 va
阅读全文
摘要：引入： <script src="http://www.yanhuangxueyuan.com/versions/threejsR92/examples/js/controls/OrbitControls.js"></script> 实现鼠标拖拽： // 渲染函数 function render()
阅读全文
摘要：// 渲染函数 function render() { renderer.render(scene,camera);//执行渲染操作 mesh.rotateY(0.01);//每次绕y轴旋转0.01弧度 requestAnimationFrame(render);//请求再次执行渲染函数render
阅读全文
摘要：// 1. 创建几何模型 // var geometry = new THREE.SphereGeometry(60, 40, 40); //创建一个球体几何对象 var geometry = new THREE.BoxGeometry(100, 100, 100); //创建一个立方体几何对象Ge
阅读全文
摘要：threeJS基本结构 场景 光源 点光源 场景光源 平行光源 网格模型 几何体对象 材质 相机 渲染器
阅读全文
摘要：有很多库它本身是js写的，但我们要在ts中使用它就会报错，因此我们需要声明一份文件来帮忙，在里面进行类型的添加，让其不报错 自定义声明文件 新建XXX.d.ts文件，这种文件就是一个声明文件 该声明文件里面没有任何的实际实现代码，只有类型声明，如 interface， function 或者 cla
阅读全文
摘要：类型别名 // 使用type定义一个类型 type PlusType = (x: number, y: number) => number // let sum let sum: PlusType sum = (x, y) => { return x + y } 字面量 type Direction
阅读全文
摘要：泛型 function echo<T>(a: T): T | undefined { return a } const result = echo<number>(123) function swap<T, U>(arr: [T, U]): [U, T] { return [arr[1], arr[
阅读全文
摘要：数字类型枚举 /** * 枚举 */ // 数字（number类型）枚举 enum Direction { Up, Down, Left, Right } // 每一个枚举的内部变量都会进行递增，且是一个双向赋值的过程！ console.log(Direction.Up) // 0 console.
阅读全文
摘要：联合类型 // 自动进行了类型推论，推论为string，因为我们的'str'是一个字符串 let str = 'str' // 此时再将它赋值为数字，就会报错 // str = 123 let numberOrString: number | string 类型断言 先强行将未知参数看做某个类型进行
阅读全文
摘要：数组与元组 /** * 数组 */ let arrOfNumbers: number[] = [1, 2, 3] /** * 元组 */ let arr: [number, string] = [1, 'ljx'] arr.push(456) // arr.push(true) console.lo
阅读全文
摘要：tsconfig.json是ts编译器默认使用的配置文件 tsconfig.json { "compilerOptions": { "strict": false, "target": "ES5" } }
阅读全文
摘要：栈 /** * 栈 */ class stack { constructor() { this.count = 0 this.items = {} } /** * 添加到栈顶 */ push(element) { this.items[this.count] = element this.count
阅读全文
摘要：双端队列 /** * 双端队列 */ class Deque { constructor() { // 队列当前索引 this.count = 0 // 队头索引 this.lowestCount = 0 // 存储队列 this.items = {} } /** * 添加到队头 */ addFro
阅读全文
摘要：队列 /** * 创建队列 */ class Queue { constructor() { // 队列当前索引 this.count = 0 // 队头索引 this.lowestCount = 0 // 存储队列 this.items = {} } /** * 入队 */ enqueue(ele
阅读全文
摘要：window.onerror 全局监听所有JS错误 但它是JS级别的，识别不了Vue组件信息 捕捉一些Vue监听不到的错误 可以捕捉到异步错误 mounted() { window.onerror = function(msg, source, line, column, error) { cons
阅读全文
摘要：字典是什么？ 与set类似，map也是一种存储唯一值得数据结构，但它是以键值对的形式来存储 常用操作：键值对的增删改查 求两个数组的交集 给定两个数组，编写一个函数来计算它们的交集 let intersection = function (nums1, nums2) { const map = ne
阅读全文
摘要：集合是什么？ 一种 无序且唯一 的数据结构 ES6中有集合，名为Set 集合的常用操作：数组去重，判断某元素是否在集合中，求交集 // 去重 const arr = [1, 1, 2, 2] const set = new Set(arr) // { 1, 2 } const arr2 = [...
阅读全文
摘要：文字超出省略用哪个css样式？ 单行文字 #box1 { border: 1px solid #ccc; width: 100px; white-space: nowrap; /* 不换行 */ overflow: hidden; text-overflow: ellipsis; /* 超出省略 *
阅读全文
摘要：相对定位实现 position: relative;/*设置相对定位*/ width:100px; height:200px; top: 50%; left: 50%; margin-top: -100px;/*值为高度的一半*/ margin-right:-50px;/*值为宽度的一半*/ 绝对定
阅读全文
摘要：百分比 % 缺点：相对于父级width 媒体查询 @media (max-width: 12450px) { //css样式 } flex布局 flex:不会破坏布局结构 flex:1 1 1 可视区域宽高 vw:动态根据当前屏幕可视区的宽度 1vw相当于可视区宽度的1% vh:动态根据当前屏幕可视
阅读全文
摘要：const App=props=>{ const [n, setN] = React.useState(0); //useState()返回一个数组，第一个是读，第二个是写 const addN = () => { //声明state和函数就相当于类组件的constructor生命周期 setN(n
阅读全文
摘要：import React from 'react' import ReactDOM from 'react-dom' import './style.css' class App extends React.Component { constructor(props) { super(props)
阅读全文
摘要：import React from 'react' const ContextDemo = React.lazy(() => import('./ContextDemo')) class App extends React.Component { constructor(props) { super
阅读全文
摘要：// 创建函数式组件 function Person (props) { console.log(props); let { name, age, sex } = props; // 解构赋值 return ( <ul> <li>姓名: {name}</li> <li>性别: {sex}</li>
阅读全文
摘要：import React from 'react' // 函数组件（后面会讲），默认没有 state class StateDemo extends React.Component { constructor(props) { super(props) // 第一，state 要在构造函数中定义 t
阅读全文
摘要：受控组件 import React from 'react' class FormDemo extends React.Component { constructor(props) { super(props) this.state = { name: 'ljx', info: '个人信息', ci
阅读全文
摘要：域名：https://www.baidu.com DNS：域名解析服务器 公网IP：服务器在网络中的唯一地址 服务器：服务部署的电脑 Nginx：网页服务 输入域名，回车，对域名进行DNS解析，获取到ip地址，找到服务部署的电脑，前端一般使用nginx进行网页服务
阅读全文
摘要：为什么需要打包项目？ 浏览器只能识别并运行 html、css、js 文件 。 那么换句话而言，项目中的 .vue 文件，浏览器是不认识的。 而打包的过程就是把 .vue 的 单文件组件 打包成 html、css、js 的文件，让浏览器进行识别，并展示我们的项目 打包之后可以通过浏览器直接访问吗？ 通
阅读全文
摘要：分析 鼠标在某一行中按下 移动鼠标位置 产生对应的替换样式 鼠标抬起，表格行顺序发生变化 依据以上的业务，那么实现该功能的核心就在于：监听鼠标事件，完成对应的 UI 视图处理 具体来说： 监听鼠标的按下事件 监听鼠标的移动事件 生成对应的 UI 样式 监听鼠标的抬起事件 整个 拖动排序 的核心实现，
阅读全文
