wjlgryx
- 浏览: 313464 次
- 性别:
- 来自: 北京
-
文章分类
最新评论
-
开发小菜：
支持IE9以下的吗？
HTML5+CSS3+JQuery打造自定义视频播放器 -
攻城使：
开发Html5必须得下载么，我用dw编写，把文件复制到myec ...
html5开发 myeclipse安装aptana插件 -
疾风鹰狼：
...
根据判断浏览器类型屏幕分辨率自动调用不同CSS的代码 -
sardodo：
你好，我想问下，导入例子中的.dae格式模型是可以看到旋转的小 ...
c3dl 初步认识 -
BIOHAZARDX：
下载学习，初学者膜拜一下。
html5 实现动画（三）
Making an Application with O3D
Make the HTML for the webpage.
Step 1: Setup
...
<script type="text/javascript" src="../o3djs/base.js"></script>
<script type="text/javascript">
o3djs.require('o3djs.util');
o3djs.require('o3djs.math');
...
<body onload="init();">
<div id="o3d" style="width: 800px; height: 600px;"></div>
Step 1: Setup cont. Initialize O3D
//Creates the client area.
function init() {
o3djs.util.makeClients(initStep2);
}
function initStep2(clientElements) {
g_o3dElement = clientElements[0];
g_math = o3djs.math;
g_client = g_o3dElement.client;
g_pack = g_client.createPack();
g_root = g_pack.createObject('Transform');
g_viewInfo = o3djs.rendergraph.createBasicView(
g_pack,
g_root,
g_client.renderGraphRoot);
Set the view and projection matrices
Step 1: Setup Cont. Make a Camera
var g_eye = [15, 25, 50];
var g_target = [0, 10, 0];
var g_up = [0, 1, 0];
function updateProjection() {
g_viewInfo.drawContext.projection =
g_math.matrix4.perspective(
g_math.degToRad(45), // field of view.
g_o3dWidth / g_o3dHeight, // aspect ratio
0.1, // Near plane.
5000); // Far plane.
}
function updateCamera() {
g_viewMatrix = g_math.matrix4.lookAt(g_eye, g_target, g_up);
g_viewInfo.drawContext.view = g_viewMatrix;
}
Make some materials.
Step 2: Put something on the screen.
var redMaterial = o3djs.material.createBasicMaterial(
g_pack,
g_viewInfo,
[0.2, 1, 0.2, 1]); // green
var checkerMaterial = o3djs.material.createMaterialFromFile(
g_pack,
'shaders/checker.shader',
g_viewInfo.performanceDrawList);
g_globalParams =
o3djs.material.createAndBindStandardParams(g_pack);
g_globalParams.lightWorldPos.value = [30, 60, 40];
g_globalParams.lightColor.value = [1, 1, 1, 1];
// Create a ground plane.
var shape = o3djs.primitives.createPlane(
g_pack, checkerMaterial, 100, 100, 10, 10);
var transform = g_pack.createObject('Transform');
transform.parent = g_root;
transform.addShape(shape);
// Create a cylinder.
var shape = o3djs.primitives.createCylinder(
g_pack, redMaterial, 2.5, 5, 20, 1,
g_math.matrix4.translation([0, 2.5, 0]));
g_playerTransform = g_pack.createObject('Transform');
g_playerTransform.parent = g_root;
g_playerTransform.addShape(shape);
Step 3: Let the user move something.
var g_keyDown = []; // which keys are down by key code.
function initStep2(...) {
...
o3djs.event.addEventListener(o3dElement, 'keydown', onKeyDown);
o3djs.event.addEventListener(o3dElement, 'keyup', onKeyUp);
}
function onKeyDown(e) {
g_keyDown[e.keyCode] = true;
}
function onKeyUp(e) {
g_keyDown[e.keyCode] = false;
}
Step 3: Per frame processing.
initStep2(...) {
...
g_client.setRenderCallback(onRender);
}
function onRender(renderEvent) {
var elapsedTime = renderEvent.elapsedTime;
handleMoveKeys(elapsedTime);
};
Step 3: Move something.
function handleMoveKeys(elapsedTime) {
var directionX = 0;
var directionZ = 0;
if (g_keyDown[37] || g_keyDown[65]) { directionX = -1; }
if (g_keyDown[39] || g_keyDown[68]) { directionX = 1; }
if (g_keyDown[38] || g_keyDown[87]) { directionZ = -1; }
if (g_keyDown[40] || g_keyDown[83]) { directionZ = 1; }
g_playerXPosition += directionX;
g_playerZPosition += directionZ;
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, 0, g_playerZPosition);
}
Step 4: Make it frame rate independent
var MOVE_VELOCITY = 25; // in units per second.
function handleMoveKeys(elapsedTime) {
...
g_playerXPosition += MOVE_VELOCITY * directionX *
elapsedTime;
g_playerZPosition += MOVE_VELOCITY * directionZ *
elapsedTime;
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, 0, g_playerZPosition);
}
Step 5: Make it move relative to the camera.
function computeMoveMatrixFromViewMatrix(viewMatrix) {
var cameraMatrix = g_math.matrix4.inverse(viewMatrix);
var xAxis = g_math.cross([0, 1, 0],
cameraMatrix[2].slice(0, 3));
var zAxis = g_math.cross(xAxis, [0, 1, 0]);
return [
xAxis.concat(0),
[0, 1, 0, 0],
zAxis.concat(0),
[0, 0, 0, 1]];
}
function updateCamera() {
...
g_moveMatrix = computeMoveMatrixFromViewMatrix(g_viewMatrix);
};
Step 5: Make it move relative to the camera.
function handleMoveKeys(elapsedTime) {
...
var moveTranslation = g_math.matrix4.transformPoint(
g_moveMatrix,
[MOVE_VELOCITY * directionX * elapsedTime,
0,
MOVE_VELOCITY * directionZ * elapsedTime]);
g_playerXPosition += moveTranslation[0];
g_playerZPosition += moveTranslation[2];
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, 0, g_playerZPosition);
}
Step 6: Make the camera follow the player.
function moveCamera() {
g_target = [g_playerXPosition, 10, g_playerZPosition];
updateCamera();
}
function onRender(renderEvent) {
moveCamera();
};
Step 7: Smooth the camera movement.
function moveCamera() {
var newTarget = [g_playerXPosition, 10, g_playerZPosition];
g_target = g_math.lerpVector(g_target, newTarget, 0.03);
updateCamera();
}
Step 8: Add some action.
function handleMoveKeys(elapsedTime) {
...
if (g_canJump) {
if (g_keyDown[32]) {
g_jumping = true;
g_canJump = false;
g_playerYVelocity = JUMP_VELOCITY;
}
} else {
if (g_jumping) {
g_playerYVelocity += GRAVITY * elapsedTime;
g_playerYPosition += g_playerYVelocity * elapsedTime;
if (g_playerYPosition <= 0) {
g_playerYPosition = 0;
g_jumping = false;
}
} else {
if (!g_keyDown[32]) {
g_canJump = true;
}
}
}
...
g_playerTransform.translate(
g_playerXPosition, g_playerYPosition, g_playerZPosition);
}
Step 9: Add effects.
function initStep2(clientElements) {
...
g_particleSystem = o3djs.particles.createParticleSystem(g_pack, g_viewInfo);
g_poofEmitter = g_particleSystem.createParticleEmitter();
g_poofEmitter.setState(o3djs.particles.ParticleStateIds.ADD);
g_poofEmitter.setColorRamp(
[1, 1, 1, 0.3,
1, 1, 1, 0]);
g_poofEmitter.setParameters({
numParticles: 30,
lifeTime: 0.5,
startTime: 0,
startSize: 5,
endSize: 10,
spinSpeedRange: 10},
function(index, parameters) {
var angle = Math.random() * 2 * Math.PI;
parameters.velocity = g_math.matrix4.transformPoint(
g_math.matrix4.rotationY(angle), [25, 2.5, 0]);
parameters.acceleration = g_math.mulVectorVector(
parameters.velocity, [-1.5, 1, -1.5]);
});
g_poof = g_poofEmitter.createOneShot(g_root);
Step 9: Add Effects
function handleMoveKeys(elapsedTime) {
...
if (g_jumping) {
g_playerYVelocity += GRAVITY * elapsedTime;
g_playerYPosition += g_playerYVelocity * elapsedTime;
if (g_playerYPosition <= 0) {
g_playerYPosition = 0;
g_poof.trigger(
[g_playerXPosition,
g_playerYPosition,
g_playerZPosition]);
g_jumping = false;
}
Step 10: Load a character.
function initStep2(...) {
...
var transform = g_pack.createObject('Transform');
g_playerTransform = transform;
var playerPack = g_client.createPack();
o3djs.scene.loadScene(g_client, playerPack,
g_playerTransform,
'assets/character.o3dtgz', initStep3);
}
function initStep3(playerPack, playerParent, exception) {
o3djs.pack.preparePack(playerPack, g_viewInfo);
o3djs.material.bindParams(playerPack, g_globalParams);
g_playerTransform.parent = g_root;
...
}
Step 11: Orient the character.
var g_playerDirection = 0;
...
function handleMoveKeys(elapsedTime) {
...
if (directionX != 0 || directionZ != 0) {
var moveTranslation = ...
var targetDirection = Math.atan2(moveTranslation[0],
moveTranslation[2]);
g_playerDirection = g_math.lerpRadian(
g_playerDirection, targetDirection, 0.2);
...
}
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, g_playerYPosition, g_playerZPosition);
g_playerTransform.rotateY(g_playerDirection);
}
Step 12: Animate the character.
var IDLE_START_TIME = 247 / 30;
var IDLE_END_TIME = 573 / 30;
var IDLE_TIME_RANGE = IDLE_END_TIME - IDLE_START_TIME;
var g_animTimer = IDLE_START_TIME;
function initStep2(...) {
...
var paramObject = playerPack.createObject('ParamObject');
g_animParam = paramObject.createParam('animTime',
'ParamFloat');
o3djs.scene.loadScene(g_client, playerPack,
g_playerTransform,
'assets/character.o3dtgz', initStep3,
{opt_animSource: g_animParam});
...
Step 12: Animate the character.
function onRender(renderEvent) {
...
handleAnimation(elapsedTime);
};
function handleAnimation(elapsedTime) {
g_animTimer += elapsedTime;
if (g_animTimer >= IDLE_END_TIME) {
g_animTimer = g_math.modClamp(g_animTimer,
IDLE_TIME_RANGE,
IDLE_START_TIME);
}
g_animParam.value = g_animTimer;
}
Step 13: Add more animation.
Repeat step 12 for various actions.
See step13.html
diff step12.html and step13.html to see what changed.
Step 14: Load a background.
function initStep2(...) {
...
var loader = o3djs.loader.createLoader(initStep3);
loader.loadScene(g_client, playerPack, g_playerTransform,
'assets/character.o3dtgz', prepareScene,
{opt_animSource: g_animParam});
var worldPack = g_client.createPack();
g_worldTransform = worldPack.createObject('Transform');
loader.loadScene(g_client, worldPack, g_worldTransform,
'assets/background.o3dtgz', prepareScene)
loader.finish();
}
function prepareScene(pack, sceneRoot, exception) {
o3djs.pack.preparePack(pack, g_viewInfo);
o3djs.material.bindParams(pack, g_globalParams);
sceneRoot.parent = g_root;
}
function initStep3(...) {
http://code.google.com/apis/o3d
Make the HTML for the webpage.
Step 1: Setup
...
<script type="text/javascript" src="../o3djs/base.js"></script>
<script type="text/javascript">
o3djs.require('o3djs.util');
o3djs.require('o3djs.math');
...
<body onload="init();">
<div id="o3d" style="width: 800px; height: 600px;"></div>
Step 1: Setup cont. Initialize O3D
//Creates the client area.
function init() {
o3djs.util.makeClients(initStep2);
}
function initStep2(clientElements) {
g_o3dElement = clientElements[0];
g_math = o3djs.math;
g_client = g_o3dElement.client;
g_pack = g_client.createPack();
g_root = g_pack.createObject('Transform');
g_viewInfo = o3djs.rendergraph.createBasicView(
g_pack,
g_root,
g_client.renderGraphRoot);
Set the view and projection matrices
Step 1: Setup Cont. Make a Camera
var g_eye = [15, 25, 50];
var g_target = [0, 10, 0];
var g_up = [0, 1, 0];
function updateProjection() {
g_viewInfo.drawContext.projection =
g_math.matrix4.perspective(
g_math.degToRad(45), // field of view.
g_o3dWidth / g_o3dHeight, // aspect ratio
0.1, // Near plane.
5000); // Far plane.
}
function updateCamera() {
g_viewMatrix = g_math.matrix4.lookAt(g_eye, g_target, g_up);
g_viewInfo.drawContext.view = g_viewMatrix;
}
Make some materials.
Step 2: Put something on the screen.
var redMaterial = o3djs.material.createBasicMaterial(
g_pack,
g_viewInfo,
[0.2, 1, 0.2, 1]); // green
var checkerMaterial = o3djs.material.createMaterialFromFile(
g_pack,
'shaders/checker.shader',
g_viewInfo.performanceDrawList);
g_globalParams =
o3djs.material.createAndBindStandardParams(g_pack);
g_globalParams.lightWorldPos.value = [30, 60, 40];
g_globalParams.lightColor.value = [1, 1, 1, 1];
// Create a ground plane.
var shape = o3djs.primitives.createPlane(
g_pack, checkerMaterial, 100, 100, 10, 10);
var transform = g_pack.createObject('Transform');
transform.parent = g_root;
transform.addShape(shape);
// Create a cylinder.
var shape = o3djs.primitives.createCylinder(
g_pack, redMaterial, 2.5, 5, 20, 1,
g_math.matrix4.translation([0, 2.5, 0]));
g_playerTransform = g_pack.createObject('Transform');
g_playerTransform.parent = g_root;
g_playerTransform.addShape(shape);
Step 3: Let the user move something.
var g_keyDown = []; // which keys are down by key code.
function initStep2(...) {
...
o3djs.event.addEventListener(o3dElement, 'keydown', onKeyDown);
o3djs.event.addEventListener(o3dElement, 'keyup', onKeyUp);
}
function onKeyDown(e) {
g_keyDown[e.keyCode] = true;
}
function onKeyUp(e) {
g_keyDown[e.keyCode] = false;
}
Step 3: Per frame processing.
initStep2(...) {
...
g_client.setRenderCallback(onRender);
}
function onRender(renderEvent) {
var elapsedTime = renderEvent.elapsedTime;
handleMoveKeys(elapsedTime);
};
Step 3: Move something.
function handleMoveKeys(elapsedTime) {
var directionX = 0;
var directionZ = 0;
if (g_keyDown[37] || g_keyDown[65]) { directionX = -1; }
if (g_keyDown[39] || g_keyDown[68]) { directionX = 1; }
if (g_keyDown[38] || g_keyDown[87]) { directionZ = -1; }
if (g_keyDown[40] || g_keyDown[83]) { directionZ = 1; }
g_playerXPosition += directionX;
g_playerZPosition += directionZ;
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, 0, g_playerZPosition);
}
Step 4: Make it frame rate independent
var MOVE_VELOCITY = 25; // in units per second.
function handleMoveKeys(elapsedTime) {
...
g_playerXPosition += MOVE_VELOCITY * directionX *
elapsedTime;
g_playerZPosition += MOVE_VELOCITY * directionZ *
elapsedTime;
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, 0, g_playerZPosition);
}
Step 5: Make it move relative to the camera.
function computeMoveMatrixFromViewMatrix(viewMatrix) {
var cameraMatrix = g_math.matrix4.inverse(viewMatrix);
var xAxis = g_math.cross([0, 1, 0],
cameraMatrix[2].slice(0, 3));
var zAxis = g_math.cross(xAxis, [0, 1, 0]);
return [
xAxis.concat(0),
[0, 1, 0, 0],
zAxis.concat(0),
[0, 0, 0, 1]];
}
function updateCamera() {
...
g_moveMatrix = computeMoveMatrixFromViewMatrix(g_viewMatrix);
};
Step 5: Make it move relative to the camera.
function handleMoveKeys(elapsedTime) {
...
var moveTranslation = g_math.matrix4.transformPoint(
g_moveMatrix,
[MOVE_VELOCITY * directionX * elapsedTime,
0,
MOVE_VELOCITY * directionZ * elapsedTime]);
g_playerXPosition += moveTranslation[0];
g_playerZPosition += moveTranslation[2];
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, 0, g_playerZPosition);
}
Step 6: Make the camera follow the player.
function moveCamera() {
g_target = [g_playerXPosition, 10, g_playerZPosition];
updateCamera();
}
function onRender(renderEvent) {
moveCamera();
};
Step 7: Smooth the camera movement.
function moveCamera() {
var newTarget = [g_playerXPosition, 10, g_playerZPosition];
g_target = g_math.lerpVector(g_target, newTarget, 0.03);
updateCamera();
}
Step 8: Add some action.
function handleMoveKeys(elapsedTime) {
...
if (g_canJump) {
if (g_keyDown[32]) {
g_jumping = true;
g_canJump = false;
g_playerYVelocity = JUMP_VELOCITY;
}
} else {
if (g_jumping) {
g_playerYVelocity += GRAVITY * elapsedTime;
g_playerYPosition += g_playerYVelocity * elapsedTime;
if (g_playerYPosition <= 0) {
g_playerYPosition = 0;
g_jumping = false;
}
} else {
if (!g_keyDown[32]) {
g_canJump = true;
}
}
}
...
g_playerTransform.translate(
g_playerXPosition, g_playerYPosition, g_playerZPosition);
}
Step 9: Add effects.
function initStep2(clientElements) {
...
g_particleSystem = o3djs.particles.createParticleSystem(g_pack, g_viewInfo);
g_poofEmitter = g_particleSystem.createParticleEmitter();
g_poofEmitter.setState(o3djs.particles.ParticleStateIds.ADD);
g_poofEmitter.setColorRamp(
[1, 1, 1, 0.3,
1, 1, 1, 0]);
g_poofEmitter.setParameters({
numParticles: 30,
lifeTime: 0.5,
startTime: 0,
startSize: 5,
endSize: 10,
spinSpeedRange: 10},
function(index, parameters) {
var angle = Math.random() * 2 * Math.PI;
parameters.velocity = g_math.matrix4.transformPoint(
g_math.matrix4.rotationY(angle), [25, 2.5, 0]);
parameters.acceleration = g_math.mulVectorVector(
parameters.velocity, [-1.5, 1, -1.5]);
});
g_poof = g_poofEmitter.createOneShot(g_root);
Step 9: Add Effects
function handleMoveKeys(elapsedTime) {
...
if (g_jumping) {
g_playerYVelocity += GRAVITY * elapsedTime;
g_playerYPosition += g_playerYVelocity * elapsedTime;
if (g_playerYPosition <= 0) {
g_playerYPosition = 0;
g_poof.trigger(
[g_playerXPosition,
g_playerYPosition,
g_playerZPosition]);
g_jumping = false;
}
Step 10: Load a character.
function initStep2(...) {
...
var transform = g_pack.createObject('Transform');
g_playerTransform = transform;
var playerPack = g_client.createPack();
o3djs.scene.loadScene(g_client, playerPack,
g_playerTransform,
'assets/character.o3dtgz', initStep3);
}
function initStep3(playerPack, playerParent, exception) {
o3djs.pack.preparePack(playerPack, g_viewInfo);
o3djs.material.bindParams(playerPack, g_globalParams);
g_playerTransform.parent = g_root;
...
}
Step 11: Orient the character.
var g_playerDirection = 0;
...
function handleMoveKeys(elapsedTime) {
...
if (directionX != 0 || directionZ != 0) {
var moveTranslation = ...
var targetDirection = Math.atan2(moveTranslation[0],
moveTranslation[2]);
g_playerDirection = g_math.lerpRadian(
g_playerDirection, targetDirection, 0.2);
...
}
g_playerTransform.identity();
g_playerTransform.translate(
g_playerXPosition, g_playerYPosition, g_playerZPosition);
g_playerTransform.rotateY(g_playerDirection);
}
Step 12: Animate the character.
var IDLE_START_TIME = 247 / 30;
var IDLE_END_TIME = 573 / 30;
var IDLE_TIME_RANGE = IDLE_END_TIME - IDLE_START_TIME;
var g_animTimer = IDLE_START_TIME;
function initStep2(...) {
...
var paramObject = playerPack.createObject('ParamObject');
g_animParam = paramObject.createParam('animTime',
'ParamFloat');
o3djs.scene.loadScene(g_client, playerPack,
g_playerTransform,
'assets/character.o3dtgz', initStep3,
{opt_animSource: g_animParam});
...
Step 12: Animate the character.
function onRender(renderEvent) {
...
handleAnimation(elapsedTime);
};
function handleAnimation(elapsedTime) {
g_animTimer += elapsedTime;
if (g_animTimer >= IDLE_END_TIME) {
g_animTimer = g_math.modClamp(g_animTimer,
IDLE_TIME_RANGE,
IDLE_START_TIME);
}
g_animParam.value = g_animTimer;
}
Step 13: Add more animation.
Repeat step 12 for various actions.
See step13.html
diff step12.html and step13.html to see what changed.
Step 14: Load a background.
function initStep2(...) {
...
var loader = o3djs.loader.createLoader(initStep3);
loader.loadScene(g_client, playerPack, g_playerTransform,
'assets/character.o3dtgz', prepareScene,
{opt_animSource: g_animParam});
var worldPack = g_client.createPack();
g_worldTransform = worldPack.createObject('Transform');
loader.loadScene(g_client, worldPack, g_worldTransform,
'assets/background.o3dtgz', prepareScene)
loader.finish();
}
function prepareScene(pack, sceneRoot, exception) {
o3djs.pack.preparePack(pack, g_viewInfo);
o3djs.material.bindParams(pack, g_globalParams);
sceneRoot.parent = g_root;
}
function initStep3(...) {
http://code.google.com/apis/o3d
分享到：
发表评论
-
bufferData
2011-07-21 14:30 1116/*void*/ bufferData //缓冲区数 ... -
导入支持的格式(Import)
2011-05-31 16:54 2489导入对话框选择格式，你会看到众多导入的格式。3ds m ... -
法线贴图
2011-05-13 11:48 1932本文转自：http://yumi08.jimdo.co ... -
法线向量
2011-05-13 10:20 2545面法线的计算相对来 ... -
ShowWebGL 强大的3D模型查看器
2011-04-12 14:01 6186ShowWebGL http://showwebgl.com ... -
o3d 创建一个平面
2011-03-29 15:27 901var vertexInfo = o3djs.primitiv ... -
o3d 常见几何图形创建
2011-03-29 15:25 11381、基本形状包括： o3djs.primitives.cre ... -
o3D 材质-定义透明材质
2011-03-29 15:20 1114//定义一个为白色并且是透明材质 var material = ... -
o3D 光照设定材质的光反射系数
2011-03-29 15:19 10001、创建材质 2、设定效果 3、创建光源的位置 4、设置材质环 ... -
O3D程序基本结构
2011-03-29 15:13 850创建一个O3D对象 设置全局变量初始化通用库 创建一个O3D ... -
Google 三维 JavaScript API
2011-03-28 15:59 915O3D 是一个开源的Web API，其可以创建相当牛X的基于浏 ... -
3D引擎CopperLicht（二）
2011-03-28 15:14 1447在上一个课程的基础上 ... -
3D引擎CopperLicht
2011-03-28 15:09 1747WebGL是一种3D绘图标准， ... -
o3d 文档原文
2011-03-18 18:00 889Basic TasksThe basic tasks perf ... -
WebGL的框架
2011-03-18 16:23 3949WebGL的框架 WebGL http://www.khro ... -
c3dl 官方教程(二)
2011-03-18 16:13 1908教程＃2：一个简单的场景本教程将展示C3DL）的基础知识使用三 ... -
C3DL 官方教程(一)
2011-03-18 15:57 1576本文笔者翻译，如有错误请留言。 教程＃1：Web ... -
3D模型导入 CanvasMatrix.js引擎 demo(一)
2011-03-17 17:51 3076为广大html5 3d开发的朋友们演示 代码贴图，请下载附 ... -
c3dl 可以直接导入3dmax文件的3D引擎
2011-03-17 17:41 1213c3dl可以直接在网页代码中使用.dae格式的3dma ... -
o3d 模型导入引擎CanvasMatrix.js
2011-03-17 16:09 1647最近研究3d引擎在html5中的效果实现，需求当然是 ...
相关推荐
2. **易用性**：O3D通过封装WebGL的底层API，提供了一套高级接口，简化了3D编程的复杂性，使得开发者可以更快地学习和上手。 3. **丰富的功能集**：O3D包含了一系列实用工具和功能，如材质系统、动画系统、碰撞检测...
WebGL使得在移动设备上创建逼真的3D图形和游戏成为可能，如X3DOM和O3D等框架提供了更高级别的3D建模和交互。 2. 离线存储技术 HTML5的离线存储技术，如离线网页应用（Offline Web Applications），允许网页在用户...
内容概要：报告由中国信息通信研究院发布，旨在评估制造业上市公司高质量发展，强调制造业高质量发展的重要性，并构建了涵盖创新力、竞争力、影响力、贡献力四大维度的评价体系。通过对3500余家制造业上市公司2022年年报数据的综合评估，评选出百强企业。研究显示，百强企业专注主业，半数以上成长为制造业单项冠军；民营企业在盈利效率、创新发展方面表现优异；东部地区引领发展，装备制造业领先，新能源产业呈现爆发性增长。百强企业在科技创新、质效提升、持续增长、稳定就业等方面发挥重要作用，但也存在品牌建设和创新水平差距、领军企业竞争力提升空间、高端领域龙头企业培育不足等问题。 适用人群：制造业企业管理者、政策制定者、投资者及相关研究人员。 使用场景及目标：①帮助企业管理者了解行业发展趋势，提升企业竞争力；②为政策制定者提供决策参考，推动制造业高质量发展；③为投资者提供投资参考，识别优质企业；④为研究人员提供详实数据，助力学术研究。 其他说明：报告建议从重突破促升级、重创新补短板、重质量树品牌三个方面进一步推进制造业企业高质量发展，以加快建设具有全球竞争力的一流企业。
内容概要：本文详细介绍了异步电机无感矢量控制仿真的关键技术与常见问题解决方案。首先讨论了坐标变换（Clarke和Park变换）的基础操作及其注意事项，强调了正确选择系数的重要性。接下来深入探讨了滑模观测器的设计与优化方法，包括使用查表法替代三角函数计算以提高效率，以及加入低通滤波器减少高频抖振。此外，文章还涉及了速度估算的方法，如频域法和改进型滑模观测器的应用，并提供了具体的Python和Matlab代码片段。最后，针对电流环控制提出了前馈补偿机制，确保在突加负载情况下仍能保持良好的电流跟踪效果。文中多次提到调参技巧，特别是对于PI参数的选择给出了实用建议。 适合人群：从事电机控制系统研究与开发的技术人员，尤其是对异步电机无感矢量控制感兴趣的工程师。 使用场景及目标：适用于希望深入了解并掌握异步电机无感矢量控制仿真技术的研究人员和技术开发者。主要目标是在没有编码器的情况下实现对电机转速和扭矩的精确控制，同时提供详细的代码实现指导和调试经验。 其他说明：文章不仅提供了理论知识，还包括大量实际操作中的经验和教训，帮助读者避免常见的陷阱，快速搭建起有效的仿真环境。
# 基于Arduino的火箭动力学参数监测项目 ## 项目简介 这是一个基于Arduino平台的火箭动力学参数监测项目，旨在通过Adafruit BMP280压力传感器和Adafruit LIS3DH加速度传感器收集火箭飞行过程中的环境数据和运动数据。项目结合了Adafruit的BMP280库和LIS3DH库，实现对传感器数据的读取、处理及初步分析。 ## 项目的主要特性和功能 1. 环境数据监测通过BMP280压力传感器，实时监测并记录火箭周围的气压、温度和海拔高度变化。 2. 运动数据监测借助LIS3DH加速度传感器，获取火箭在飞行过程中的加速度、速度及方向变化数据。 3. 数据处理与传输Arduino负责收集和初步处理这些数据，然后通过串行通信或其他方式将数据发送到地面站或飞行控制软件。 4. 安全与警报基于收集的数据，项目可设置警报阈值，当超过预设的安全限制时，触发警报或采取相应的安全措施。 ## 安装使用步骤
# 基于Arduino的EPSleepy智能家居控制系统 ## 一、项目简介 EPSleepy是一个基于Arduino的智能家居控制系统原型。该项目旨在通过Arduino控制ESP32 WiFi和蓝牙板，结合MP3模块、shiftregister和按钮等硬件，实现智能家居的自动化控制。 ## 二、项目的主要特性和功能 1. 自动化控制通过Arduino代码控制ESP32板，实现家居设备的自动化控制。 2. 多种硬件支持支持MP3模块、shiftregister和按钮等硬件，实现音频播放、灯光控制、SD驱动等功能。 3. 模块化设计代码采用模块化设计，方便测试每个部分的功能，方便维护和调试。 4. 图形化界面可通过按钮和LED等硬件进行图形化操作和控制。 ## 三、安装使用步骤 1. 下载并解压项目源码文件。 2. 打开Arduino IDE，导入项目代码。 3. 连接硬件，包括ESP32板、MP3模块、shiftregister和按钮等。
Delphi 12.3控件之PowerPDF for Delphi11 FullSource.zip
内容概要：本文深入探讨了中微CMS32M5533在800W角磨机方案中的应用，涵盖硬件设计和软件实现的关键技术。硬件方面，介绍了三相桥驱动电路、MOSFET选择、电流检测电阻、PCB布局等细节；软件方面，重点讲解了反电动势检测算法、ADC采样时机、PWM配置以及换相时机的动态补偿。此外，还提供了调试技巧和成本控制方法。 适合人群：从事电动工具开发的技术人员，尤其是对电机控制有一定经验的研发人员。 使用场景及目标：适用于希望深入了解电动工具控制系统的设计和优化，特别是希望通过反电动势检测减少霍尔传感器使用的开发者。目标是提高系统的可靠性和性能，同时降低成本。 其他说明：文中提供的代码片段和硬件设计细节有助于实际项目的开发和调试。建议读者结合提供的GitHub资源进行实践，并关注硬件选型和PCB布局的注意事项。
CEO的绿色经历是指该首席执行官（CEO）在其个人职业发展过程中，所积累的与环境保护、可持续发展、绿色经济等相关的教育背景、工作经验或社会活动经验。 涵盖了教育背景、工作经验、社会活动与个人价值观等多个方面。这些经历不仅塑造了CEO对环境保护和可持续发展的认知和态度，还可能影响他们在企业决策中优先考虑环保因素的程度，从而对企业的长期发展和环境保护产生重要影响。 根据现有研究（姜付秀和黄继承，2013；许年行和李哲，2016），从高管个人简历数据中查找CEO以前是否接受过“绿色”相关教育或从事过“绿色”相关工作，若企业CEO具有绿色经历，Green取值1，否则，取值0。 数据 Stkcd、年份、D0801c、Green、股票简称、行业名称、行业代码、制造业取两位代码，其他行业用大类、当年ST或PT为1，否则为0、样本区间内ST或PT为1，否则为0、金融业为1，否则为0、制造业为1，否则为0、沪深A股为1，否则为0、第一种重污染行业为1，否则为0、第二种重污染行业为1，否则为0、第三种重污染行业为1，否则为0、产权性质，国企为1，否则为0、所属省份代码、所属城市代码、所在省份、所在地级市
内容概要：本文详细介绍了利用COMSOL Multiphysics对18650电池组进行蛇形液冷系统仿真的全过程。首先探讨了快充场景下电池过热的风险及其对电动车安全性和寿命的影响。接着，通过集总电池模型简化电化学反应，重点分析了电池产热方程和温度对产热的影响。随后，深入讨论了蛇形流道几何参数优化，如流道宽度与压降之间的非线性关系，以及流固交界面处理方法。此外，还涉及了多物理场耦合求解技巧，包括流场与传热模块的设置，以及后处理阶段的数据提取和可视化。最终得出优化设计方案，显著降低了电池组的最高温度和温度不均性。 适合人群：从事电动汽车电池管理系统设计的研究人员和技术工程师，尤其是熟悉COMSOL仿真工具的专业人士。 使用场景及目标：适用于需要评估和优化电动汽车电池组热管理系统的场合，旨在提高电池组的安全性和使用寿命，同时减少能量损耗。 其他说明：文中提供了大量具体的代码片段和参数设置建议，有助于读者快速上手并应用于实际工程项目中。
内容概要：本文详细介绍了CCSDS LDPC译码器的设计与实现，主要采用了修正最小和译码算法。该算法通过对传统最小和算法的改进，引入缩放因子α，提高了译码性能。文中具体讨论了（8176,7154）和（1280,1024）两种码组的应用场景及其优劣，并展示了如何通过C语言和Vivado进行仿真和硬件实现。此外，文章还探讨了硬件实现中的关键技术，如定点化处理、校验矩阵的压缩存储、动态阈值机制以及硬件流水线设计等。 适合人群：从事通信系统开发的研究人员和技术人员，尤其是对LDPC编码和译码感兴趣的工程师。 使用场景及目标：①帮助研究人员理解和实现CCSDS LDPC译码器；②为实际工程项目提供高效的译码解决方案；③提高译码性能，减少误码率，提升通信系统的可靠性和效率。 其他说明：文章不仅提供了理论分析，还包括了大量的代码示例和实践经验分享，有助于读者全面掌握CCSDS LDPC译码器的设计与实现。
# 基于Arduino的超声波距离测量系统 ## 项目简介 本项目是一个基于Arduino平台的超声波距离测量系统。系统包含四个超声波传感器（SPS）模块，用于测量与前方不同方向物体的距离，并通过蜂鸣器（Buzz）模块根据距离范围给出不同的反应。 ## 项目的主要特性和功能 1. 超声波传感器（SPS）模块每个模块包括一个超声波传感器和一个蜂鸣器。传感器用于发送超声波并接收回波，通过计算超声波旅行时间来确定与物体的距离。 2. 蜂鸣器（Buzz）模块根据超声波传感器测量的距离，蜂鸣器会给出不同的反应，如延时发声。 3. 主控制器（Arduino）负责控制和管理所有传感器和蜂鸣器模块，通过串行通信接收和发送数据。 4. 任务管理通过主控制器（Arduino）的 loop() 函数持续执行传感器任务（Task），包括测距、数据处理和蜂鸣器反应。 ## 安装使用步骤 1. 硬件连接
主角跑步动作素材图包含6张图片
企业数字化转型是指企业或组织将传统业务转化为数字化业务，利用人工智能、大数据、云计算、区块链、5G等数字技术提升业务效率和质量的过程。 当无形资产明细项包含“软件”“网络”“客户端”“管理系统”“智能平台”等与数字化转型技术相关的关键词以及与此相关的专利时，将该明细项目界定为“数字化技术无形资产”，再对同一公司同年度多项数字化技术无形资产进行加总，计算其占本年度无形资产的比例，即为企业数字化转型程度的代理变量。 本数据包含：原始数据、参考文献、代码do文件、最终结果。 参考文献：张永珅,李小波,邢铭强-企业数字化转型与审计定价[J].审计研究,2021(03):62-71. 数据 证券代码、证券简称、统计截止日期、报表类型、无形资产净额、资产总计、年份、期末余额（元）、数字化转型。
该资源为h5py-3.1.0-cp36-cp36m-win_amd64.whl，欢迎下载使用哦！
内容概要：本文介绍了一种基于QRBayes-LSTM的多/单变量时序预测方法，适用于不确定性强的场景如股票预测和电力负荷预测。该方法结合了分位数回归和贝叶斯优化，不仅能提供未来的趋势预测，还能给出预测值的置信区间。文中详细解释了数据准备、模型结构、损失函数设计、训练配置以及预测结果的可视化和评估指标。此外，还提供了变量重要性分析的方法，帮助理解哪些特征对预测结果的影响最大。 适合人群：从事数据分析、机器学习研究的专业人士，尤其是关注时序预测和不确定性量化的人群。 使用场景及目标：① 对于需要进行时序预测并希望获得置信区间的用户；② 关注模型性能评估和变量重要性的研究人员；③ 寻求提高预测精度和可靠性的从业者。 其他说明：本文提供的代码可以直接应用于Excel格式的数据，用户只需将数据导入即可运行。需要注意的是，为了获得最佳效果，应该确保数据格式正确并且符合特定的要求。
内容概要：本文详细介绍了ADAS（高级驾驶辅助系统）中四个主要功能模块的设计与实现，分别是自适应巡航控制系统（ACC）、前向碰撞预警系统（FCW）、自动紧急制动系统（AEB）和车道保持辅助系统（LKA）。文章不仅展示了各个系统的具体算法实现，如ACC中的PID控制、FCW中的TTC计算、AEB中的状态机设计和LKA中的PD控制器，还分享了许多实际开发中的经验和挑战，如参数调校、传感器融合、时间同步等问题。此外，文中还提到了一些有趣的细节，如在暴雨天气下LKA的表现优化，以及AEB系统在测试过程中遇到的各种corner case。 适合人群：汽车电子工程师、自动驾驶研究人员、嵌入式软件开发者。 使用场景及目标：帮助读者深入了解ADAS系统的工作原理和技术细节，掌握关键算法的实现方法，提高在实际项目中的开发和调试能力。 其他说明：文章通过生动的语言和具体的代码示例，使复杂的理论变得通俗易懂，有助于初学者快速入门并深入理解ADAS系统的开发流程。
内容概要：文章主要阐述了2023年中国高端制造业上市公司的发展概况，包括行业与区域两个维度的分布详情。从行业上看，高端制造业上市公司超过2400家，其中机械制造以628家的数量位居首位，电子（352家）和电力制造（336家）紧随其后，而像航空航天国防等也有一定的占比。从区域分布来看，广东、江苏、浙江三省处于领先地位，分别有410家、342家和199家，这表明东南沿海地区对于高端制造业的发展具有显著优势。数据来源于中国上市公司协会以及Wind。 适合人群：对中国经济结构、产业发展趋势感兴趣的读者，尤其是关注高端制造业发展的投资者、政策制定者及研究人员。 使用场景及目标：①帮助投资者了解中国高端制造业上市公司的行业布局，为投资决策提供参考依据；②为政策制定者提供数据支持，助力优化产业布局和发展规划；③供研究人员分析中国高端制造业的现状与未来发展趋势。 阅读建议：本文提供了丰富的数据和图表，读者应重点关注各行业的具体数据及其背后反映出的产业特点，同时结合区域分布情况，深入理解中国高端制造业的发展格局。
# 基于Python的机器学习算法实践 ## 项目简介 本项目旨在通过实践常用机器学习算法，提高数据挖掘和推荐系统的准确性，解决信息过载问题。应用场景包括电商、新闻、视频等网站，帮助用户更高效地获取所需信息。 ## 项目的主要特性和功能 数据挖掘实现多种数据挖掘算法，帮助用户从大量数据中提取有价值的信息。 机器学习算法包括常用的分类、回归、聚类等算法，提供详细的实现和示例程序。 推荐系统通过机器学习算法提高推荐系统的准确性，优化用户体验。 ## 安装使用步骤 1. 下载源码用户已下载本项目的源码文件。 2. 安装依赖 bash pip install r requirements.txt 3. 运行示例程序 bash python main.py 4. 自定义数据根据需要替换数据文件，重新运行程序以应用新的数据。
项目运行参考：https://blog.csdn.net/weixin_45393094/article/details/124645254 技术栈Springboot+Vue；此项目的参考文档 内容概要：本文档介绍了一款基于前后端分离架构的学生选课系统的设计与实现。系统采用Java语言作为后端开发语言，运用Spring Boot框架构建后端接口，前端使用Vue框架，设计模式上采用了MVVM模式，确保前后端分离。系统主要分为学生、教师和管理员三大功能模块，涵盖课程选择、成绩管理和信息发布等功能。需求分析部分详细描述了各模块的功能需求及性能需求，包括实用性、易用性和安全性。数据库设计部分详细说明了学生、教师、用户、课程和成绩等信息表的结构。系统实现章节则展示了各个模块的具体实现细节，包括登录验证、教师管理、学生管理、课程管理、公告设置及选课等功能的代码实现。 适合人群：计算机专业学生、有一定编程基础的研发人员或对前后端分离技术有兴趣的开发者。 使用场景及目标：①理解前后端分离架构在实际项目中的应用；②掌握Spring Boot与Vue框架结合开发的具体实现方法；③熟悉学生选课系统的核心功能，如选课、成绩管理、信息发布等；④学习如何设计和实现高效的数据库结构以支持系统功能。 阅读建议：本文档适合希望深入了解前后端分离架构及具体实现的读者。在阅读过程中，建议重点关注各模块的功能需求分析和技术实现细节，特别是代码示例部分，以加深对前后端分离架构的理解。同时，结合自身开发经验，思考如何优化现有系统功能，提高系统的稳定性和用户体验。