基于vue的three.js学习

vue安装three.js，并创建第一个入门场景

安装three.js

  npm install --save three

引入three.js

import * as THREE from 'three'

three.js结构

three.js构成结构

three.js坐标

在这里插入图片描述

创建一个场景

scene场景，camera相机，renderer渲染器

  1. 创建一个场景
this.scene = new THREE.Scene()
  1. 创建一个透视摄像机
this.camera = new THREE.PerspectiveCamera(75,800/800,0.1,700)

PerspectiveCamera:
参数一：视野角度，无论在什么时候，你所能再显示器上看到的场景的范围，单位是角度。
参数二：长宽比，一个物体的宽除以她的高
参数三：近截面和远截面，当某些部分比摄像机的远截面或者近截面近的时候，该部分将不会被渲染到场景中。

  1. 创建渲染器
	renderer = new THREE.WebGLRenderer();
  1. 创建渲染器的宽高
  renderer.setSize( 800, 800 );
  1. 创建一个立方体物体
const geometry = new THREE.BoxGeometry( 1, 1, 1 );

BoxGeometry(x轴上的宽度,y轴上的高度,z轴上的深度) 默认为1

  1. 确定立方体的材质和颜色 MeshBasicMaterial材质，颜色绿色
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
  1. 创建一个网格

表示基于以三角形为polygon mesh（多边形网格）的物体的类。
同时也作为其他类的基类 Mesh( geometry :
BufferGeometry, material : Material ) geometry ——
（可选）BufferGeometry的实例，默认值是一个新的BufferGeometry。 material ——
（可选）一个Material，或是一个包含有Material的数组，默认是一个新的MeshBasicMaterial。

 mesh = new THREE.Mesh( geometry, material );
  1. 插入元素，执行渲染操作
 //元素中插入canvas对象container.appendChild(this.renderer.domElement);
  1. WebGL兼容性检查（WebGL compatibility check）

某些设备以及浏览器直到现在仍然不支持WebGL。
以下的方法可以帮助你检测当前用户所使用的环境是否支持WebGL，如果不支持，将会向用户提示一条信息。

// webGL兼容
import WebGL from 'three/examples/jsm/capabilities/WebGL.js';
if ( WebGL.isWebGLAvailable() ) {this.animate();
} else {const warning = WebGL.getWebGLErrorMessage();document.getElementById( 'container' ).appendChild( warning );   
}
  1. 执行旋转函数，执行渲染
 animate() {requestAnimationFrame( this.animate );this.mesh.rotation.x += 0.01;this.mesh.rotation.y += 0.01;this.renderer.render( this.scene, this.camera );}
  1. 加入坐标辅助器
// 看的方向 
this.camera.lookAt(0,0,0)
//添加世界坐标辅助器
const axesHelper = new THREE.AxesHelper(3) 
this.scene.add( axesHelper );
  1. 引入并加入轨道控制器，并设置阻尼效果
// 轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js"
//添加轨道控制器
this.controls = new OrbitControls(this.camera,this.renderer.domElement)
//设置带阻尼的惯性
this.controls.enableDamping = true  
//设置阻尼系数，惯性的大小
this.controls.dampingFactor = 0.05
//设置自动旋转
this.controls.autoRotate = true
//更新
this.controls.update()

运行效果：
在这里插入图片描述

完整代码：

<template><div id="container"></div>
</template><script>
import * as THREE from 'three'
// webGL兼容
import WebGL from 'three/examples/jsm/capabilities/WebGL.js';
// 轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js"
export default {name: 'HomeView',components: {},mounted(){this.init()},data(){return {camera: null,  //相机对象scene: null,  //场景对象renderer: null,  //渲染器对象mesh: null,  //网格模型对象Meshcontrols:null, //轨道控制器}},methods:{init(){let container = document.getElementById('container');//创建一个场景this.scene = new THREE.Scene()//透视摄像机this.camera = new THREE.PerspectiveCamera(75,1000/1000,0.1,700)//创建渲染器this.renderer = new THREE.WebGLRenderer();//渲染器尺寸this.renderer.setSize( 1000, 1000 );     //创建一个立方体const geometry = new THREE.BoxGeometry( 1, 1, 1 );//我们需要给它一个MeshBasicMaterial材质，来让它有绿色颜色const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );//需要一个 Mesh（网格）this.mesh = new THREE.Mesh( geometry, material );// 添加物体到网格this.scene.add( this.mesh );// 设置相机位置this.camera.position.z = 5;   this.camera.position.y =2;  this.camera.position.x = 2; // 看的方向 this.camera.lookAt(0,0,0)//添加世界坐标辅助器const axesHelper = new THREE.AxesHelper(3) this.scene.add( axesHelper );//添加轨道控制器this.controls = new OrbitControls(this.camera,this.renderer.domElement)//添加阻尼带有惯性this.controls.enableDamping = true//设置阻尼系数this.controls.dampingFactor = 0.05//设置自动旋转this.controls.autoRotate = true//元素中插入canvas对象container.appendChild(this.renderer.domElement); if ( WebGL.isWebGLAvailable() ) {this.animate();} else {const warning = WebGL.getWebGLErrorMessage();document.getElementById( 'container' ).appendChild( warning );}},//旋转起来animate() {this.controls.update()requestAnimationFrame( this.animate );this.mesh.rotation.x += 0.01;this.mesh.rotation.y += 0.01;this.renderer.render( this.scene, this.camera );}}
}
</script>

three.js物体位移与父子元素

//子元素材质绿色
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
//父元素材质红色
const material2 = new THREE.MeshBasicMaterial( { color: "red" } );
this.mesh2 = new THREE.Mesh( geometry, material2 );
this.mesh = new THREE.Mesh( geometry, material );//父元素添加子元素
this.mesh2.add(this.mesh)
//设置父元素位置
this.mesh2.position.set(-3,0,0)
//设置子元素位置      
this.mesh.position.set(3,0,0)

效果：
three.js父元素子元素位置

three.js物体的缩放与旋转

物体的局部缩放。默认值是Vector3( 1, 1, 1 )。父元素被放大了，子元素也根着进行放大。
物体的局部旋转，以弧度来表示,欧拉角秒是一个旋转变换，通过指定轴顺序和各个轴上的指定旋转角度来旋转一个物体，对Euler实例进行遍历将按相应的顺序生成她的分量(x,y,z,order)。
也属于局部旋转，跟父元素有关联。会叠加父元素的旋转
three.js物体的旋转
Euler(0,1,1,“YXZ”)
x:用弧度表示x轴旋转的量，默认是0
y:用弧度表示y轴旋转的量，默认是0
z:用弧度表示z轴旋转的量，默认是0
order:表示旋转顺序的字符串，默认为’XYZ’(必须是大写)
three.js物体的旋转

 //子物体放大两倍this.mesh.scale.set(2,2,2)//物体绕着X轴旋转45°this.mesh.rotation.x = Math.PI / 4

three.js物体的放大与旋转

three.js画布自适应窗口变化

当窗口缩小的时候会出现如下效果：
three.js画布自适应
自适应代码，监听窗口变化

 window.addEventListener("resize",()=>{console.log("我改变了")//重置渲染器宽高比this.renderer.setSize(window.innerWidth,window.innerHeight)//重置相机宽高比this.camera.aspect = window.innerWidth/window.innerHeight//更新相机投影矩阵this.camera.updateProjectionMatrix()})

three.js旋转
全屏显示，添加一个按钮带有全屏显示

 //全屏
allView(){this.renderer.domElement.requestFullscreen()},//退出全屏backAllView(){this.renderer.domElement.exitFullscreen()},

three.js画布全屏和退出全屏

应用lil-GUI调试开发3D效果

    为了能够快速的搭建three.js的交互，three.js社区就出现了lil-gui,语法简介，上手快，主要作用获取一个对象和该对象上的属性名，并根据属性的类型自动生成一个界面组件来操作该属性，使用lil-gui，可以通过界面组件来控制场景中的物体，提高调试效率。
    方便编写代码时对相机，灯光等对象的参数进行实时调节，使用lil-GUI库，可以快速创建控制三维场景的UI交互界面，threejs三维空间很多参数都需要通过GUI的方式调试出来。

导入GUI

//导入GUI
import { GUI } from 'three/examples/jsm/libs/lil-gui.module.min.js';
//实例化一个gui对象
const gui = new GUI()

add()

xxx.add()方法用于向GUI中添加要控制的对象及其属性

// Object.add(控制对象，对象具体属性，属性参数最小值，属性参数最大值)folder.add(vector3, 'x', -1000, 100, 0.01)folder.add(vector3, 'y', -1000, 100, 0.1)folder.add(vector3, 'z', -1000, 100, 0.01)folder.open()

示例：
three中gui的使用

onChange()

Object.onChange方法方法用于监听控件的改变，它接收一个回调函数作为参数，在回调函数中可以接收改变的值，并处理相关的业务逻辑。

 gui.onChange(function(val){console.log(val);})

当加入add后，该表物体位置会触发gui.onChange的回调。
threeJs中GUI的使用

step()

Object.step()方法可以设置每次改变属性值间隔是多少。

folder.add(vector3, 'z', -1000, 100).step(0.1)

addColor()

Object.addColor()方法生成颜色值改变的交互界面，它接收两个参数，一个是控制对象，一个是颜色属性。

const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );gui.addColor(params, 'color').onChange( function() { material.color.set( params.color ); } );

three使用GUI控制颜色

name()

Object.name()方法让gui界面显示的中文名称。

gui.addColor(params, 'color').name("颜色").onChange( function() { material.color.set( params.color ); } );
folder.add(vector3, 'x', -1000, 100, 0.1).step(0.1).name("x轴")
folder.add(vector3, 'y', -1000, 100, 0.1).step(0.1).name("y轴")
folder.add(vector3, 'z', -1000, 100, 0.1).step(0.1).name("z轴")

three中GUIname属性

addFolder()

Object.addFolder()创建一个分组，我们可以将同一对象的属性通过.addFolder()方法创建在同一个分组中。

//创建颜色和位置分组const groupPositoinGui = gui.addFolder("位置")   const groupColorGui = gui.addFolder("颜色")groupPositoinGui.add(vector3, 'x', -1000, 100, 0.1).step(0.1).name("x轴")groupPositoinGui.add(vector3, 'y', -1000, 100, 0.1).step(0.1).name("y轴")groupPositoinGui.add(vector3, 'z', -1000, 100, 0.1).step(0.1).name("z轴")groupColorGui.addColor(params, 'color').name("颜色").onChange( function() { material.color.set( params.color ); } );

three中addFolder的使用

Object.close()和Object.open()交互界面

默认情况下，GUI创建的所有菜单都是打开的，我们可以通过.close()方法控制其关闭，通过.open()方法控制其打开。
three中open()和close()方法

几何体顶点

  1. 创建一个Buffer类型几何体对象
var geometry = new THREE.BufferGeometry();
  1. 创建顶点数据
// 创建顶点数据
const vertices = new Float32Array([-1.0,-1.0,0.0,1.0,-1.0,0.0,1.0,1.0,0.0,1.0,1.0,0,-1.0,1.0,0,-1.0,-1.0,0
])
  1. 创建顶点属性

3个为一组，表示一个顶点的xyz坐标

geometry.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) );
  1. 创建材质
    可设置材质的颜色，是否正反面都可看，线框
//创建材质
const material = new THREE.MeshBasicMaterial({color: 0xffff00,  //材质颜色// side:THREE.DoubleSide,  //是否正反面都可看wireframe:true,//线框})
this.mesh = new THREE.Mesh( geometry, material );
// 添加物体到网格
this.scene.add( this.mesh );

three自定义几何体顶点
5. 共用顶点使用并绘制索引，两个点面重合公用一个线

//使用索引绘制
const vertices = new Float32Array([-1.0,-1.0,0.0,1.0,-1.0,0.0,1.0,1.0,0.0,-1.0,1.0,0
])
//创建顶点属性
geometry.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) );
//创建索引
const indice = new Uint16Array([0,1,2,2,3,0])
//设置索引
geometry.setIndex(new THREE.BufferAttribute(indice,1))
//创建材质
const material = new THREE.MeshBasicMaterial({color: 0xffff00,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看wireframe:true,//线框})

three公用顶点

几何体划分顶点设置不同材质

//创建索引
const indice = new Uint16Array([0,1,2,2,3,0])
//设置索引
geometry.setIndex(new THREE.BufferAttribute(indice,1))
//设置两个顶点组，形成两个素材
geometry.addGroup(0,3,0)      
geometry.addGroup(3,3,1)
//创建材质
const material = new THREE.MeshBasicMaterial({color: 0xffff00,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})const material2 = new THREE.MeshBasicMaterial({color: 0xff00,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})
this.mesh = new THREE.Mesh( geometry, [material,material2] );
// 添加物体到网格
this.scene.add( this.mesh );

其中/设置两个顶点组，形成两个素材 geometry.addGroup(0,3,0)
，geometry.addGroup(3,3,1)。 this.mesh = new THREE.Mesh( geometry,
[material,material2] );中应使用参数标识第一和第二个素材。

几何体划分定点设置不同材质

几何顶点组成一个立方体，划分定点组设置不同材质

 const cubeGemoetry = new THREE.BoxGeometry( 1, 1, 1 );//创建材质const material0 = new THREE.MeshBasicMaterial({color: 0x00ff00,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})const material1 = new THREE.MeshBasicMaterial({color: 0xff0000,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})const material2 = new THREE.MeshBasicMaterial({color: 0x00ffff,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})const material3 = new THREE.MeshBasicMaterial({color: 0x000f00,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})const material4 = new THREE.MeshBasicMaterial({color: 0xf0ff00,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})const material5 = new THREE.MeshBasicMaterial({color: 0xff00ff,  //材质颜色side:THREE.DoubleSide,  //是否正反面都可看})this.mesh = new THREE.Mesh( cubeGemoetry, [material0,material1,material2,material3,material4,material5] );// 添加物体到网格this.scene.add( this.mesh );

three顶点组合正方体

three贴图的加载与环境遮蔽贴图强度设置

  1. 创建一个平面
 let planeGeometry = new THREE.PlaneGeometry(1,1)

three贴图的加载与环境遮蔽贴图强度设置
2. 加载纹理加载器

 let  textureLoader = new THREE.TextureLoader()
  1. 加载纹理加载ao贴图
 //加载纹理let texture = textureLoader.load(require("../../public/map.png"))// 加载ao贴图let aoMap = textureLoader.load(require("../../public/aomap.jpg"))

素材：
map.png纹理
three贴图素材
roughness.png:粗糙度贴图
three贴图素材
置换贴图 作位移使用displacementMap.png
three贴图素材
aomap.png该纹理的红色通道用作环境遮挡贴图。默认值为null。aoMap需要第二组UV
three贴图素材
normal.png 法线贴图
three贴图素材
metalness金属贴图
three贴图素材
alpha.ng，alpha贴图是一张灰度纹理，用于控制整个表面的不透明度
three贴图素材

  1. 设置平面材质,允许透明度，设置ao贴图
 //设置平面材质
let planeMaterial = new THREE.MeshBasicMaterial( { color: 0xffffff,map:texture,  //贴图transparent:true, //允许透明度aoMap:aoMap,//设置ao贴图
});
gui.add(planeMaterial,"aoMapIntensity").min(0).max(10).name("ao强度")
this.planeMesh = new THREE.Mesh( planeGeometry, planeMaterial );
this.scene.add( this.planeMesh );

效果：
three纹理总结

纹理常用属性

  1. 偏移属性:让纹理贴图在物体上做偏移
texture.offset.set(0.5, 0.5, 0)

three纹理偏移
2. 旋转属性：纹理将围绕中心点旋转多少度，单位为弧度（rad），正值为逆时针旋转，默认值问为 0

texture.rotation = Math.PI / 6

由于没有设置中心点导致旋转后的问题
在这里插入图片描述
3. 设置旋转中心点：对应纹理的中心，默认为 (0, 0)

 texture.center.set(0.5, 0.5)

在这里插入图片描述
4. 纹理的重复：repeat 让纹理在物体上重复

// 设置纹理的重复（x 轴方向重复2次，y 轴方向重复3次）
texture.repeat.set(2, 3)
// 设置纹理重复的模式（重复到无穷大）
texture.wrapS = THREE.MirroredRepeatWrapping
texture.wrapT = THREE.RepeatWrapping

three纹理的重复

环境遮挡贴图与强度

.aoMap 该纹理的红色通道用作环境遮挡贴图。默认值为 null。aoMap 需要第二组 UV，UV：纹理坐标通常具有U和V两个坐标轴，因此称之为UV坐标。U代表横向坐标上的分布、V代表纵向坐标上的分布。
其实oa贴图就是让物体更具有立体感，加深三维感官，我就随便找了张图替代oa贴图

  1. 加载oa贴图
  // 加载ao贴图let aoMap = textureLoader.load(require("../../public/ao.jpg"))
  1. 设置平面材质和oa强度控制器
 //设置平面材质
let planeMaterial = new THREE.MeshBasicMaterial( { color: 0xffffff,map:texture,  //贴图transparent:true, //允许透明度aoMap:aoMap,//设置ao贴图});gui.add(planeMaterial,"aoMapIntensity").min(0).max(10).name("ao强度")

在这里插入图片描述
如果有井盖更深的oa图 立体感就会实现，井盖的凹凸之类的效果。

透明度贴图、环境贴图加载与高光贴图配合使用

  1. 透明度贴图
//透明度贴图
let alphaMap = textureLoader.load(require("../../public/displacementMap.png"))
let planeMaterial = new THREE.MeshBasicMaterial( { color: 0xffffff,map:texture,  //贴图transparent:true, //允许透明度aoMap:aoMap,//设置ao贴图alphaMap:alphaMap//透明度贴图
});

处于一个半透明状态
three透明度贴图
2. 添加光照贴图

贴图网址：https://ambientcg.com/

//环境贴图我是直接three的仓库中获取的

https://github.com/mrdoob/three.js/blob/master/examples/textures/equirectangular/venice_sunset_1k.hdr

  1. 导入RGBRload加载器
import { RGBELoader } from  "three/examples/jsm/loaders/RGBELoader.js"
  1. 加载.hdr环境图设置为球形映射北京，资源较大，使用异步加载
let rgbeLoader = new RGBELoader()
rgbeLoader.loadAsync("../venice_sunset_1k.hdr").then((texture) => {//设置球形贴图texture.mapping = THREE.EquirectangularReflectionMapping;//将加载的材质texture设置给背景和环境this.scene.background = texture;this.scene.environment = texture;
});

效果：
three环境贴图

three.js通过CubeTexture加载环境贴图

Three.js中可以通过使用CubeTexture进行环境贴图，CubeTexture需要将6张图片（正面、反面、上下左右）包装成一个立方体纹理。

//素材：
https://github.com/mrdoob/three.js/tree/master/examples/textures/cube/pisa
  1. 设置纹理加载器
 // 设置cube纹理加载器
const cubeTextureLoader = new THREE.CubeTextureLoader(); // 立方体纹理加载器
const envMapTexture = cubeTextureLoader.load([ // 设置环境贴图"../px.png","../nx.png","../py.png","../ny.png","../pz.png","../nz.png",
]);
  1. 创建一个球体，和设置球体材质
let planeGeometry = new THREE.SphereGeometry(1, 32, 32);
let planeMaterial = new THREE.MeshStandardMaterial( { metalness: 0.7, // 金属度roughness: 0.1, // 粗糙度envMap: envMapTexture, // 环境贴图
});![在这里插入图片描述](https://img-blog.csdnimg.cn/2019d5e9714a4409adf5b6b8c8c30913.gif)//给场景添加背景
this.scene.background = envMapTexture;

效果：
three.js通过CubeTexture加载环境贴图

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/158286.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

这7款神仙软件，程序员必备！

这7款神仙软件，程序员必备！

如果你是程序员、开发者、网络运维等 IT 从业者日常工作中大家肯定会用到很多网站&#xff0c;今天给大家带来7款压箱底的神仙软件&#xff0c;希望可以帮助有需要的码农朋友实现更高效地办公。 一、Everything 适用&#xff1a;本地文件搜索神器 就是为了极速检索而生,其实…
阅读更多...
yapi==使用依赖包里的类作为入参/返回值导出后没有备注

yapi==使用依赖包里的类作为入参/返回值导出后没有备注

比如模块A中有个MyDemoEntity类&#xff0c;在B中以依赖的形式引入了A&#xff0c;并在B的接口中以MyDemoEntity作为返回值&#xff0c;导出到YAPI发现MyDemoEntity的备注没了。 解决&#xff1a; 将A的内容安装到本地MAVEN仓库&#xff0c;并且需要将源码也一起安装 <buil…
阅读更多...
探索锦食送如何通过API集成无代码开发技术提高电商平台和营销系统效率

探索锦食送如何通过API集成无代码开发技术提高电商平台和营销系统效率

探索锦食送无代码开发集成技术 随着电子商务和营销系统的快速发展&#xff0c;企业不断寻求更高效和灵活的管理方式。锦食送&#xff0c;作为高端餐饮外卖服务的领先者&#xff0c;通过无代码开发的API集成技术&#xff0c;实现了电商平台和营销系统的高效管理。这种创新的连接…
阅读更多...
# 学习 Prolog 和 离散逻辑的16个等价公式：一趟有趣的逻辑之旅

# 学习 Prolog 和 离散逻辑的16个等价公式：一趟有趣的逻辑之旅

Prolog 的语法很奇怪,需要一些时间来适应,所以我花了点时间,想用Prolot来学习和验证离散逻辑的16组等价公式。 1. 双重否定律 (Double Negation Law) A ⇔A 首先&#xff0c;我们来看看双重否定律。在 Prolog 中&#xff0c;我们可以这样验证它&#xff1a; fun1(A,Z):-memb…
阅读更多...
干货分享：本地生活服务商入驻申请需要哪些条件？附更快捷的方法！

干货分享：本地生活服务商入驻申请需要哪些条件？附更快捷的方法！

在数字化时代&#xff0c;本地服务市场已经成为各大平台争夺的重要阵地。抖音不仅在短视频市场占有一席之地&#xff0c;同时也在如火如荼的开发着本地服务市场&#xff0c;相继支付宝、视频号也推出了本地生活服务商模式。本文将介绍抖音本地生活服务商的申请条件&#xff0c;…
阅读更多...
dedecms标签

dedecms标签

【Arclist 标记】这个标记是DedeCms最常用的一个标记&#xff0c;也叫自由列表标记&#xff0c;其中 hotart、coolart、likeart、artlist、imglist、imginfolist、specart、autolist 这些标记都是由这个标记所定义的不同属性延伸出来的别名标记。功能说明&#xff1a;获取指定的…
阅读更多...
WIN10 WIN11 12代 13代 大小核；性能核；电源选项；P-core,E-core；

WIN10 WIN11 12代 13代 大小核；性能核；电源选项；P-core,E-core；

WIN10 WIN11 12代 13代 大小核&#xff1b;性能核&#xff1b;电源选项&#xff1b;P-core,E-core&#xff1b; WIN10 WIN11 12代 13代 大小核;性能核&#xff1b;电源选项&#xff1b;P-core,E-core;说明&#xff1a;方法&#xff1a;1。右键开始菜单&#xff0c;选择“Window…
阅读更多...
时序预测 | MATLAB实现基于ELM-AdaBoost极限学习机结合AdaBoost时间序列预测

时序预测 | MATLAB实现基于ELM-AdaBoost极限学习机结合AdaBoost时间序列预测

时序预测 | MATLAB实现基于ELM-AdaBoost极限学习机结合AdaBoost时间序列预测 目录 时序预测 | MATLAB实现基于ELM-AdaBoost极限学习机结合AdaBoost时间序列预测预测效果基本介绍模型描述程序设计参考资料 预测效果 基本介绍 1.Matlab实现ELM-Adaboost时间序列预测&#xff0c;极…
阅读更多...
Django 集成 Celery 实现高效的异步任务处理

Django 集成 Celery 实现高效的异步任务处理

概要 在复杂的 Web 应用中&#xff0c;处理长时间运行的任务或定期任务是一项挑战。Django 作为一个强大的 Python Web 框架&#xff0c;可以通过集成 Celery 这一异步任务队列来优化这些任务的处理。Celery 不仅能提高应用性能&#xff0c;还能改善用户体验。本文将深入探讨如…
阅读更多...
4.14每日一题（二元函数求极值：常规方法、先代后求法）

4.14每日一题（二元函数求极值：常规方法、先代后求法）

阅读更多...
理解系统内核linux phy驱动

理解系统内核linux phy驱动

PHY设备驱动是基于device、driver、bus的连接方式,驱动涉及如下几个重要部分&#xff1a; 总线 - sturct mii_bus (mii stand for media independent interface) 设备 - struct phy_device 驱动 - struct phy_driver。PHY驱动函数驱动功能&#xff1a; 函数名称 功能描述 s…
阅读更多...
arcgis中投影文件(.prj)和地理转换文件(.gtf)存储路径

arcgis中投影文件(.prj)和地理转换文件(.gtf)存储路径

1、投影文件&#xff08;自定义的.prj&#xff09;的存储路径 C:\Users\14635\AppData\Roaming\ESRI\Desktop10.5\ArcMap\Coordinate Systems 2、地理转换文件&#xff08;.gtf&#xff09;--自定义 C:\Users\14635\AppData\Roaming\ESRI\Desktop10.5\ArcToolbox\CustomTransfo…
阅读更多...
Android Studio App开发实战项目之实现淘宝电商App首页界面（附源码，可用于大作业参考）

Android Studio App开发实战项目之实现淘宝电商App首页界面（附源码，可用于大作业参考）

需要源码和图片集请点赞关注收藏后评论区留言或者私信~~~ 各家电商的App首页都是动感十足&#xff0c;页面元素丰富令人眼花缭乱&#xff0c;其中运用了Android的多种组合控件&#xff0c;可以说是App界面开发的集大成之作&#xff0c;下面我们也动手实现一个。 一、需求描述 …
阅读更多...
2022年12月 电子学会青少年软件编程 中小学生Python编程 等级考试一级真题答案解析（选择题）

2022年12月 电子学会青少年软件编程 中小学生Python编程 等级考试一级真题答案解析（选择题）

2022年12月Python编程等级考试一级真题解析 选择题（共25题，每题2分，共50分） 1、关于Python语言的注释，以下选项中描述错误的是 A、Python语言有两种注释方式：单行注释和多行注释 B、Python语言的单行注释以#开头 C、Python多行注释使用###来做为标记 D、注释用于解…
阅读更多...
goland 远程调试 remote debug

goland 远程调试 remote debug

1、远程服务器装好go环境&#xff0c;并设置国内源 linux go安装 参考&#xff1a; 如何在 Debian / Ubuntu 上安装 Go 开发环境 - 知乎 设置国内源 go env -w GOPROXYhttps://goproxy.cn,direct 2、远程服务器安装dlv git clone https://github.com/derekparker/delve.gi…
阅读更多...
MeterSphere | 接口测试请求体中，int类型的入参实现动态化变量

MeterSphere | 接口测试请求体中，int类型的入参实现动态化变量

项目场景&#xff1a; 在接口自动化的时候&#xff0c;要把上一个接口的 Int 变量传入到 下一个接口中进行使用&#xff0c;但编译器会出现 红色的 X 符号 问题描述 如何实现 int 类型的入参实现动态化变量&#xff1f; 解决方案&#xff1a; 忽视掉这个红色 X 号&#xff0…
阅读更多...
【Linux】xfs文件系统的xfs_info命令

【Linux】xfs文件系统的xfs_info命令

xfs_info命令 ① 查看命令工具自身的版本号 xfs_info -V ② 查看指定XFS设备的详细信息 xfs_info <device_name> 其他的一些命令可以使用man xfs_info去查阅man手册&#xff1a;
阅读更多...
优化记录 -- 记一次搜索引擎（SOLR）优化

优化记录 -- 记一次搜索引擎（SOLR）优化

业务场景 某服务根据用户相关信息&#xff0c;使用搜索引擎进行数据检索 软件配置 solr 1台&#xff1a;32c 64g 数据10gb左右&#xff0c;版本 7.5.5 应用服务器1台&#xff1a;16c 64g 应用程序 3节点 问题产生现象 1、因业务系统因处理能不足&#xff0c;对业务系统硬件…
阅读更多...
不看后悔系列 | 秒做BI报表，告别低效分析

不看后悔系列 | 秒做BI报表，告别低效分析

根据经验来看&#xff0c;做企业数据分析&#xff0c;通常是由业务提出需求&#xff0c;交给IT去取数开发&#xff0c;当业务通过分析报表有了新的需求时&#xff0c;仍需交给IT去取数分析&#xff0c;这就导致业务的分析效率低。进入大数据时代&#xff0c;这样的低效数据分析…
阅读更多...
稳定性保障8个锦囊，建议收藏！

稳定性保障8个锦囊，建议收藏！

稳定性保障&#xff0c;是一切技术工作的出发点和落脚点&#xff0c;也是 IT 工作最核心的价值体现&#xff0c;当然也是技术人员最容易“翻车”的阴沟。8个稳定性保障锦囊&#xff0c;分享给各位技术人员择机使用。 #1 设定可量化的、业务可理解的可用性目标 没有度量就没有改…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023