`
wjlgryx
  • 浏览: 311196 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

3D引擎CopperLicht（二）

JavaScriptHTMLUPF# 
阅读更多

在上一个课程的基础上，我们掌握了在CopperCube里，如何建立基本的场景和物体。




在CopperCube中，建立一个平面、箱体、球体，保证箱体名为'cubeMesh1'，球体名为'sphereMesh1'，建立好的场景如下：


编写CopperLicht代码

像上一节教材那样，输出一个.ccbjs文件到CopperLicht，保存Coppercube文件，发布场景为WebGL：Tools -> Test as JavaScript/WebGL，用网页编辑器打开新生成的.html文件，代码如下：
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <script type="text/javascript" src="copperlichtdata/copperlicht.js"></script>
</head>
<body>
  <div align="center">
    <canvas id="3darea" width="640" height="480" style="background-color:#000000">
      </canvas>
    </div>
    <script type="text/javascript">
    <!--
         startCopperLichtFromFile('3darea', 'copperlichtdata/tutorial-2.ccbjs');
    -->
    </script>
</body>
</html>
复制代码


把原来的startCopperLichtFromFile部分代码替换为如下代码：
<script type="text/javascript">
  <!--
      var engine = startCopperLichtFromFile('3darea', 'copperlichtdata/tutorial-2.ccbjs');
      var cubeSceneNode = null;
     
      // this is called when loading the 3d scene has finished
      engine.OnLoadingComplete = function()
      {         
        var scene = engine.getScene();
        if (scene)
        {
          // find the cube scene node
          cubeSceneNode = scene.getSceneNodeFromName('cubeMesh1');
         
          // also, force the 3d engine to update the scene every frame
          scene.setRedrawMode(CL3D.Scene.REDRAW_EVERY_FRAME);
         
          // additional, let the sphere constantly rotate
          var sphereSceneNode = scene.getSceneNodeFromName('sphereMesh1');
          if (sphereSceneNode)
            sphereSceneNode.addAnimator(new CL3D.AnimatorRotation(new CL3D.Vect3d(0, 1.6, 0.8)));
        }
      }
     
      document.onkeydown = function(event)
      {
        var key = String.fromCharCode(event.keyCode);
       
        // when pressed 'L', move the cube scene node a bit up
        if (key == 'F' && cubeSceneNode)
          cubeSceneNode.Pos.Y += 5;
         
        // when pressed 'G', move the cube scene node a bit down
        if (key == 'G' && cubeSceneNode)
          cubeSceneNode.Pos.Y -= 5;
       
        // we need to call the key handler of the 3d engine as well, so that the user is
        // able to move the camera using the keys
        engine.handleKeyDown(event);
      };
  -->
  </script>
复制代码


好了，再一次执行代码，运行html文件，我们可以看到球开始旋转，按F 和G键，箱体运动，下面我们简单的解释一下代码的运行原理。
var engine = startCopperLichtFromFile('3darea', 'copperlichtdata/tutorial-2.ccbjs');
复制代码


我们用'engine'变量保存了一个CopperLicht class（类）的一个实例，同时告诉CopperLicht用的文件是'copperlichtdata/tutorial-2.ccbjs'，CopperLicht会用html文档中名为'3darea'的画布<canvas>作为第一个参数，也就是后面的3d场景会转载到这个名为'3darea'的画布上。通过'engine' 这个实例，我们可以操作它其中的三维世界了。当CopperLicht导入场景完成后，我们需要CopperLicht给我们发一个信息，告诉我们它的三维场景导入完毕，于是，我们设定了一个导入完成事件：
// this is called when loading the 3d scene has finished
   engine.OnLoadingComplete = function()
   { 
复制代码


获得engine里的三维场景节点，再通过这个节点，找到它的下级节点：'cubeMesh1' 和'sphereMesh1'。
var scene = engine.getScene();
if (scene)
{
  // find the cube scene node
  cubeSceneNode = scene.getSceneNodeFromName('cubeMesh1');
复制代码


'cubemesh'被装载到了cubeMesh节点，我们通过节点就直接可以控制物体的行为，移动、转动等。
因为有动画，所以我们需要场景能每帧刷新。
  // also, force the 3d engine to update the scene every frame
scene.setRedrawMode(Scene.REDRAW_EVERY_FRAME);
复制代码


我们目前还不需要调用CL3D.Scene.forceRedrawNextFrame() ，因为我们的场景变化不大。我们可以在CopperCube编辑器里的发布项里进行这些设置。

为了让球体不断的旋转，我们用到了CopperLicht的Animators特性，Animators类是一个控制场景节点物体进行基本操作的类，如移动、旋转、路径运动、动画材质等，本案例我们用到了一个AnimatorRotation（旋转动画），速度为(0, 1.6, 0.8) ，直接把它加给球体就可以。
// additional, let the sphere constantly rotate
var sphereSceneNode = scene.getSceneNodeFromName('sphereMesh1');
if (sphereSceneNode)
  sphereSceneNode.addAnimator(new AnimatorRotation(new Vect3d(0, 1.6, 0.8)));
复制代码


键盘输入

这时本课程的最后部分，我们通过按键'F' 和 'G'来控制箱体的运动，我们设置一个程序来捕获键盘输入事件：
document.onkeydown = function(event)
{
复制代码


需要注意的是，当CopperLicht引擎的实例生成出来后，它自动就生成了自己的一套键盘事件处理程序，为了有我们自己的一套键盘事件响应程序，我们需要把CopperLicht自动生成的那套响应程序删除，我们这样做：
// we need to call the key handler of the 3d engine as well, so that the user is
// able to move the camera using the keys
engine.handleKeyDown(event);
复制代码


在这之前，我们通过按键来控制箱体的运动:
var key = String.fromCharCode(event.keyCode);
       
// when pressed 'L', move the cube scene node a bit up
if (key == 'F' && cubeSceneNode)
  cubeSceneNode.Pos.Y += 5;
 
// when pressed 'G', move the cube scene node a bit down
if (key == 'G' && cubeSceneNode)
  cubeSceneNode.Pos.Y -= 5;
复制代码


好了，到这里我们知道如何控制场景里的物体运动了！

 

  • 大小: 57.4 KB
  • 大小: 39.4 KB
分享到：
| 3D引擎CopperLicht
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    WebGL技术初步评估

    WebGL的普及也得益于中间件生态系统的成熟，开发者可以使用如C3DL、CopperLicht、Three.js等工具库，简化开发流程，提高开发效率。这些工具库提供了丰富的功能，帮助开发者快速构建复杂的3D场景和应用。 然而，...

    基于物联网智能化平台的智慧园区解决方案PPT(28页).pptx

    智慧园区，作为现代城市发展的新形态，旨在通过高度集成的信息化系统，实现园区的智能化管理与服务。该方案提出，利用智能手环、定制APP、园区管理系统及物联网技术，将园区的各类设施与设备紧密相连，形成一个高效、便捷、安全的智能网络。从智慧社区到智慧酒店，从智慧景区到智慧康养，再到智慧生态，五大应用板块覆盖了园区的每一个角落，为居民、游客及工作人员提供了全方位、个性化的服务体验。例如，智能手环不仅能实现定位、支付、求助等功能，还能监测用户健康状况，让科技真正服务于生活。而智慧景区的建设，更是通过大数据分析、智能票务、电子围栏等先进技术，提升了游客的游玩体验，确保了景区的安全有序。 尤为值得一提的是，方案中的智慧康养服务，展现了科技对人文关怀的深刻体现。通过智慧手环与传感器，自动感知老人身体状态，及时通知家属或医疗机构，有效解决了“空巢老人”的照护难题。同时，智慧生态管理系统的应用，实现了对大气、水、植被等环境要素的实时监测与智能调控，为园区的绿色发展提供了有力保障。此外，方案还提出了建立全域旅游营销平台，整合区域旅游资源，推动旅游业与其他产业的深度融合，为区域经济的转型升级注入了新的活力。 总而言之，这份智慧园区建设方案以其前瞻性的理念、创新性的技术和人性化的服务设计，为我们展示了一个充满智慧与活力的未来园区图景。它不仅提升了园区的运营效率和服务质量，更让科技真正融入了人们的生活，带来了前所未有的便捷与舒适。对于正在规划或实施智慧园区建设的决策者而言，这份方案无疑提供了一份宝贵的参考与启示，激发了他们对于未来智慧生活的无限遐想与憧憬。

    MES制造企业生产过程执行系统：全方位协同管理，提升生产效率与质量的信息化管理平台,MES制造企业生产过程执行系统：全面协同管理，提升生产效率与质量管理水平,mes制造企业生产过程执行系统，是一套面向

    MES制造企业生产过程执行系统：全方位协同管理，提升生产效率与质量的信息化管理平台,MES制造企业生产过程执行系统：全面协同管理，提升生产效率与质量管理水平,mes制造企业生产过程执行系统，是一套面向制造企业车间执行层的生产信息化管理系统。 MES 可以为企业提供包括制造数据管理、计划排产管理、生产调度管理、库存管理、质量管理、人力资源管理、工作中心 设备管理、工具工装管理、采购管理、成本管理、项目看板管理、生产过程控制、底层数据集成分析、上层数据集成分解等管理模块，为企业打造一个扎实、可靠、全面、可行的制造协同管理平台 ,MES制造企业生产过程执行系统;生产信息化管理;制造数据管理;计划排产管理;生产调度管理;库存管理;质量管理;人力资源管理;设备管理;数据集成分析,MES制造企业生产执行系统：全面协同管理平台助力制造企业高效运营

    C++指针与内存管理详解：避免常见错误及最佳实践

    内容概要：本文介绍了C++编程中常见指针错误及其解决方案，并涵盖了模板元编程的基础知识和发展趋势，强调了高效流操作的最新进展——std::spanstream。文章通过一系列典型错误解释了指针的安全使用原则，强调指针初始化、内存管理和引用安全的重要性。随后介绍了模板元编程的核心特性，展示了编译期计算、类型萃取等高级编程技巧的应用场景。最后，阐述了C++23中引入的新特性std::spanstream的优势，对比传统流处理方法展现了更高的效率和灵活性。此外，还给出了针对求职者的C++技术栈学习建议，涵盖了语言基础、数据结构与算法及计算机科学基础领域内的多项学习资源与实战练习。 适合人群：正在学习C++编程的学生、从事C++开发的技术人员以及其他想要深入了解C++语言高级特性的开发者。 使用场景及目标：帮助读者掌握C++中的指针规则，预防潜在陷阱；介绍模板元编程的相关技术和优化方法；使读者理解新引入的标准库组件，提高程序性能；引导C++学习者按照有效的路径规划自己的技术栈发展路线。 阅读建议：对于指针部分的内容，应当结合实际代码样例反复实践，以便加深理解和记忆；在研究模板元编程时，要从简单的例子出发逐步建立复杂模型的理解能力，培养解决抽象问题的能力；而对于C++23带来的变化，则可以通过阅读官方文档并尝试最新标准特性来加深印象；针对求职准备，应结合个人兴趣和技术发展方向制定合理的学习计划，并注重积累高质量的实际项目经验。

    VSC下垂控制策略仿真模型：基于MATLAB 2014a及更高版本的全面支持与应用实践,VSC下垂控制策略仿真模型MATLAB版本支持及功能解析,VSC下垂控制策略仿真模型，支持MATLAB2014a

    VSC下垂控制策略仿真模型：基于MATLAB 2014a及更高版本的全面支持与应用实践,VSC下垂控制策略仿真模型MATLAB版本支持及功能解析,VSC下垂控制策略仿真模型，支持MATLAB2014a及以上版本 ,VSC下垂控制策略; 仿真模型; MATLAB 2014a及以上版本; 核心关键词,MATLAB 2014a及以上版VSC下垂控制策略仿真模型研究

    信息技术知识赛系统设计与实现(代码+数据库+LW)

    摘  要 传统办法管理信息首先需要花费的时间比较多，其次数据出错率比较高，而且对错误的数据进行更改也比较困难，最后，检索数据费事费力。因此，在计算机上安装信息技术知识赛系统软件来发挥其高效地信息处理的作用，可以规范信息管理流程，让管理工作可以系统化和程序化，同时，信息技术知识赛系统的有效运用可以帮助管理人员准确快速地处理信息。 信息技术知识赛系统在对开发工具的选择上也很慎重，为了便于开发实现，选择的开发工具为Eclipse，选择的数据库工具为Mysql。以此搭建开发环境实现信息技术知识赛系统的功能。其中管理员管理用户，新闻公告。 信息技术知识赛系统是一款运用软件开发技术设计实现的应用系统，在信息处理上可以达到快速的目的，不管是针对数据添加，数据维护和统计，以及数据查询等处理要求，信息技术知识赛系统都可以轻松应对。 关键词：信息技术知识赛系统；SpringBoot框架，系统分析，数据库设计

    蓝桥杯python准备建议.zip

    蓝桥杯是全国范围内具有广泛影响力的编程竞赛，对于准备参加蓝桥杯 Python 组比赛的同学来说，系统化的学习和针对性的训练是取得好成绩的关键。本项目是一份详细的蓝桥杯 Python 组准备建议，涵盖基础知识、算法与数据结构、刷题策略、实战演练以及心态调整等方面。

    Simulink与Carsim联合仿真实现轨迹跟踪，考虑侧倾、曲率变化及侧偏刚度修正,考虑侧倾和曲率变化的轨迹跟踪：Simulink与Carsim联合仿真修正侧偏刚度技术解析,轨迹跟踪，考虑侧倾和曲率

    Simulink与Carsim联合仿真实现轨迹跟踪，考虑侧倾、曲率变化及侧偏刚度修正,考虑侧倾和曲率变化的轨迹跟踪：Simulink与Carsim联合仿真修正侧偏刚度技术解析,轨迹跟踪，考虑侧倾和曲率变化，同时修正侧偏刚度 simulink carsim联合仿真 ,轨迹跟踪; 侧倾和曲率变化; 侧偏刚度修正; Simulink; CarSim联合仿真,Simulink联合仿真：车辆轨迹跟踪及侧倾、曲率修正研究

    Unity-游戏开发-模型资源-科幻武器

    总共包含 32 款 AAA 级科幻武器。四种武器类型，每种有 8 种不同的纹理变化！ 所有内容均采用 PBR 材质，可直接用于开发游戏！

    Linux环境下PyTorch深度学习框架的搭建指南（Anaconda、CUDA、PyCharm、Jupyter）

    内容概要：本文详细介绍了在Ubuntu Linux上如何从零开始构建完整的PyTorch深度学习环境。步骤涵盖了镜像源配置、必需环境安装、Anaconda安装及配置，CUDA和显卡驱动安装，Anaconda虚拟环境创建，PyTorch安装及其相关依赖库的安装方法。对于安装过程中可能出现的一些问题提供了相应的解决方案。此外还简要涉及了Python环境的维护、IDE PyCharm的安装方法以及如何启动Anaconda附带的Jupyter Notebook。 适合人群：希望深入了解Linux操作系统下的机器学习环境配置过程的初级开发者和技术爱好者，特别是有兴趣应用PyTorch从事科研项目的人群。 使用场景及目标：旨在帮助读者掌握基于Ubuntu平台配置高性能PyTorch环境的具体流程，从而能快速投入到实际开发工作中；同时为未来扩展更多AI/ML应用打下坚实基础。 其他说明：本教程假设读者已经有一定Linux命令行操作基础，并且拥有基本的Python编程能力。教程重点在于具体的技术步骤而非理论讲解，对于每一阶段都附带有详尽的操作截图辅助理解。

    IEEE9节点系统Simulink仿真：实现潮流计算与稳定性分析的电力仿真模型,基于Matlab Simulink的IEEE9节点系统仿真：潮流计算与稳定性分析,IEEE9节点系统Simulink仿真

    IEEE9节点系统Simulink仿真：实现潮流计算与稳定性分析的电力仿真模型,基于Matlab Simulink的IEEE9节点系统仿真：潮流计算与稳定性分析,IEEE9节点系统Simulink仿真 1.基础功能:基于Matlab simulink平台搭建IEEE9节点仿真模型，对电力系统进行潮流计算(与编程用牛拉法计算潮流结果一致) 2.拓展功能: 可在该IEEE9节系统仿真模型上进行暂态、静态稳定性仿真分析。 ,IEEE9节点系统; Simulink仿真; 潮流计算; 牛拉法; 暂态稳定性仿真分析; 静态稳定性仿真分析,基于Simulink的IEEE9节点系统仿真：潮流计算与稳定性分析

    欧姆龙NJ/NX系列PLC ST语言编程：Modbus RTU读写轮询与八从站通讯集成，搭配CF105模块使用，含FB功能块调用案例参考,欧姆龙NJ/NX系列PLC的ST语言编程：集成Modbus R

    欧姆龙NJ/NX系列PLC ST语言编程：Modbus RTU读写轮询与八从站通讯集成，搭配CF105模块使用，含FB功能块调用案例参考,欧姆龙NJ/NX系列PLC的ST语言编程：集成Modbus RTU读写轮询与八个485从站通讯功能，搭配CF105模块使用，含通讯FB功能块与主程序调用案例,欧姆龙NJ,NX系列plc，ST语言编写，该程序包含ModbusRTU的读写轮询，带八个485从站，此程序必须搭配欧姆龙CF105模块才能使用。 通讯的程序都封装成FB功能块可以直接调用，主程序有调用案例参考 ,欧姆龙NJ; NX系列PLC; ST语言编写; ModbusRTU读写轮询; 485从站; 欧姆龙CF105模块; 通讯FB功能块; 主程序调用案例。,欧姆龙PLC ST语言Modbus RTU读写轮询程序：CF105模块八从站通讯应用

    数学建模相关主题资源2

    数学建模相关主题资源2

    Go语言教程&案例&相关项目资源

    Go语言教程&案例&相关项目资源

    企业微信会话存档+deepseek智能预警

    ### **软件更新公告：AI会话存档与分析功能全新上线！** 亲爱的用户， 我们很高兴地宣布，本次软件更新带来了全新的 **AI会话存档与分析功能**，旨在帮助企业更好地管理员工与客户的沟通内容，提升服务质量，优化运营效率。以下是本次更新的详细内容： --- #### **1. 会话存档** - **功能描述**：系统将自动拉取员工与客户的文本聊天内容，并完整存档，方便随时查阅。 - **使用场景**： - 查看员工与客户的历史沟通记录。 - 审计聊天内容，确保合规性。 - 为客户问题提供追溯依据。 --- #### **2. AI会话报告** - **功能描述**：结合 **DeepSeek AI** 技术，对员工发送给客户的聊天内容进行智能分析，判断是否存在以下行为： - **敲单行为**：识别员工是否诱导客户下单或进行不必要的推销。 - **辱骂客户**：检测聊天内容中是否存在不当言辞或辱骂行为。 - **索要回扣/红包**：分析员工是否向客户索要回扣、红包或其他不当利益。 - **使用场景**： - 实时监控员工与客户的沟通质量。

    点餐系统.zip

    毕业设计

    并联型APF有源电力滤波器Matlab Simulink仿真研究：涉及dq和αβ坐标系谐波无功检测与SVPWM调制方式的仿真介绍文档,基于Matlab Simulink仿真的并联型APF有源电力滤波器

    并联型APF有源电力滤波器Matlab Simulink仿真研究：涉及dq和αβ坐标系谐波无功检测与SVPWM调制方式的仿真介绍文档,基于Matlab Simulink仿真的并联型APF有源电力滤波器谐波及无功检测技术研究，包含PI控制与SVPWM调制方式的深入探讨,并联型APF 有源电力滤波器 Matlab Simulink仿真 *dq FBD谐波 无功检测 *两相旋转坐标系（dq）、两相静止坐标系（αβ）下的PI控制 *SVPWM调制方式 (含仿真介绍文档) ,核心关键词：并联型APF; 有源电力滤波器; Matlab Simulink仿真; dq FBD谐波无功检测; 两相旋转坐标系PI控制; 两相静止坐标系PI控制; SVPWM调制方式。,基于Matlab Simulink仿真的并联型APF有源电力滤波器研究：dq FBD谐波与无功检测的PI控制及SVPWM调制方式

    Swift编程语言详解：从基础语法到Swift 6新特性及跨平台发展趋势

    内容概要：本文详细介绍了苹果公司推出的编程语言 Swift，涵盖其基本概念、语法特点、环境搭建以及从 Swift 3 到 Swift 6 的重要更新与发展历程。Swift 是一门专注于 iOS、macOS、watchOS 和 tvOS 开发的语言，语法简洁，比 Objective-C 更易于学习和使用。文章首先简要介绍了 Swift 的基础知识，包括变量和常量、基本数据类型、控制流语句、函数定义、类和结构体，以及高级特性如可选类型、强制解包、可选绑定、闭包和协议。接着探讨了 Swift 的历史演变及其在不同操作系统（Linux 和 Windows）上的应用，尤其是 Swift 在 2015 年开源后的快速发展。最新的 Swift 6 版本引入了诸如编译时数据竞争保护等多项创新特性，极大地提升了并发编程的安全性和易用性。最后讨论了开发者的看法及其应用场景的可能性。 适合人群：具有一定编程基础的研发人员，尤其是那些有兴趣深入了解苹果生态系统或跨平台开发的技术爱好者。 使用场景及目标：帮助读者快速掌握 Swift 编程语言的核心概念和技术栈；指导初学者如何配置和使用 Xcode 编写首个 Swift 应用程序；分析最新发布的 Swift 6 更新亮点，并提供从 Swift 5 迁移到 Swift 6 期间可能遇到的问题及解决方法。 阅读建议：建议新手先掌握基本的 Swift 语法和面向对象编程思想再深入研究高级主题；同时密切关注官方发布的最新动态和支持资料，及时更新对 Swift 技术的认知；针对想要过渡到 Swift 6 的团队，务必进行充分的学习准备并在实践中积累经验以克服潜在困难。此外，考虑到 Swift 正逐渐扩展到非苹果平台的应用开发中，请对 Swift 在不同平台下的表现保持敏感并积极探索跨平台解决方案。

    024.JSP+SQL网上教学系统.zip

    毕业设计

    BLDC无刷直流电机与PMSM永磁同步电机的传感器/无传感器驱动算法全攻略：涵盖STM32F1实战代码与原理图,BLDC无刷直流电机与PMSM永磁同步电机的传感器/无传感器驱动算法集合，STM32F1

    BLDC无刷直流电机与PMSM永磁同步电机的传感器/无传感器驱动算法全攻略：涵盖STM32F1实战代码与原理图,BLDC无刷直流电机与PMSM永磁同步电机的传感器/无传感器驱动算法集合，STM32F1代码全解析与分享,BLDC无刷直流电机和PMSM永磁同步电机 可提供所有代码中所有算法的，每个代码都亲自验证过。 基于STM32F1的有传感器和无传感驱动 直流无刷电机有传感器和无传感驱动程序， 无传感的实现是基于反电动势过零点实现的，有传感的霍尔实现。 永磁同步电机有感无感程序，有感为霍尔FOC和编码器方式， 无感为滑模观测器方式。 有原理图和文档，识的赶紧，物超所值。 提供里面所有代码，所有算法的。 提供里面所有代码，所有算法的。 ,BLDC无刷直流电机; PMSM永磁同步电机; 算法验证; STM32F1驱动; 有传感器驱动; 无传感驱动; 反电动势过零点; 霍尔实现; 霍尔FOC; 编码器方式; 换滑模观测器; 原理图; 文档。,基于STM32F1的BLDC与PMSM电机驱动解决方案：全算法代码与原理图详解

Magicbox
Global site tag (gtag.js) - Google Analytics