THREEJS----修复spotLight.toJSON()后 通过ObjectLoader加载target朝向问题

最新推荐文章于 2023-05-09 10:01:30 发布
最新推荐文章于 2023-05-09 10:01:30 发布
阅读量534 收藏
点赞数
分类专栏： threejs js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/github_38108899/article/details/105242233
版权
js 同时被 2 个专栏收录
41 篇文章 0 订阅
订阅专栏
threejs
9 篇文章 1 订阅
订阅专栏

 

37220行 Object.toJSON 添加判断 object是否有target属性 如果有 通过direction属性记录 target的位置

38931行 添加根据direction(记录spotLight.target的位置) 修改spotLight.target的朝向

测试最终所有属性正常  但是依旧 光线朝向(0,0,0)点 , 

THREE.ObjectLoader(json)后 创建空物体 target = THREE.Object3D();

target.position.copy( spotLight.target.position)

scene.add(target) 最终正常

 

天边那朵云
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
three-json-loader:用于ThreeJS的自定义JSON加载器
05-19
三个js加载器 从JSON文件加载网格数据，然后将其导入场景。 依靠ThreeJS。 预期的数据格式由。 例子： // Standard three.js setup. var THREE = require ( "three" ) ; var scene = new THREE . Scene ( ) ; var camera = new THREE . PerspectiveCamera ( 75 , window . innerWidth / window . innerHeight , 0.1 , 1000 ) ; var renderer = new THREE . WebGLRenderer ( ) ; renderer . setSize ( window . innerWidth , window . innerHeight ) ; document . body .
【three.js : 3D】【loader】THREE.js中加载不同格式的模型及动画(fbx、json和obj)
热门推荐
weitaming1的博客
12-03 1万+
  转载：THREE.js中加载不同格式的模型及动画(fbx、json和obj) 注：本文章内容基于 Three.js 88dev 实现 作为刚接触three.js的小萌新，励志将自己开荒历程记录下来，希望对后来人有所帮助。 网上有很多demo，文档却不多。每次都是，照搬别人的数据没问题，换成自己的模型/动画总会报错！ (╯‵□′)╯︵┻━┻ 多次踩坑后，总结出三种常用格式的加载方法。 1...
【Three.js】九、three.js模型加载器
MAXLZ的博客
09-27 4534
【Three.js】九、three.js模型加载器
Three.js数据结构、导入导出(.toJSON())
u014291990的博客
12-03 4221
Three.js数据结构、导入导出 本文是Three.js电子书的14.1节 通过Three.js模型数据导入导出过程的学习，可以让你对Threejs解析加载外部模型的过程更为了解。 Threejs导出模型信息 你可以通过下面代码导出模型的各类信息，然后在浏览器控制台打印出来模型数据，然后复制浏览器控制台模型数据粘贴到json文件中，最后可以尝试加载解析这些Threejs导出的json文件。之所以...
threeJS JSON加载器和创建蓝色天空
qq_42683219的博客
04-29 1806
本例来源官方案例 效果图 总体步骤 ① 创建场景 ② 创建相机 ③ 创建物体 *** 创建顶点着色器 *** 创建片元着色器 ④创建渲染器 html代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</ti...
threejs-volumetric-spotlight:Three.js的体积聚光灯
04-11
threejs-volumetric-spotlight Three.js的体积聚光灯
Spotlight.js-crx插件
03-29
Logitech Spotlight演示文稿远程控制JavaScript库。 使用此Chrome扩展程序可以仿真Logitech Spotlight在任何操作系统上的行为，即使是不受支持的操作系统（Chrome操作系统，Linux:registered:）。
ue VueJS 3 + ViteJS + ThreeJS:high_voltage:-Vue.js开发
05-27
:sparkles:VueJS 3 + ViteJS + ThreeJS:high_voltage:我想尝试编写一个类似于react-three-fiber-fiber的库，但是是针对VueJS的。 演示：https://troisjs.github.io/trois/我从头开始...我不知道我是否有时间来维护它...
Sketch-Action：一个可模拟Spotlight的Sketch插件
02-06
素描动作 :red_heart_selector: 支持我的应用 :red_heart_selector: :red_heart_selector: :red_heart_selector: :... 重新加载草图 建立 打开SketchActionApp.xcodeproj 选择方案SketchActionFramework方案 运行P
图形化开发（五）052-Three.js之Points 粒子——Sprite 精灵-实例1-普通精灵
weixin_44867717的博客
09-11 346
图形化开发（五）052-Three.js之Points 粒子——Sprite 精灵-实例1-普通精灵 效果 代码 1、hello-world.html <!DOCTYPE html> <html> <head> <meta charset=utf-8> <title>我的第一个Three.js案例</title> <style> body { margin:
threejs看这里就行了
越努力越幸运
06-07 4506
threejs技术预研 现代浏览器都支持WebGL，这样我们就不必使用Flash、Java等插件就能在浏览器中创建三维图形。虽然WebGL提供的接口非常丰富和强大，但使用起来过于繁琐和复杂。Three.js的出现完美地解决了这个矛盾。它提供一个很简单的关于WebGL特性的JavaScript API，使得用户不需要详细地学习WebGL，就能轻松创作出好看的三维图形样例。 1、基本介绍 1.1 Three.js 的功能特点 创建简单和复杂的三维几何图形。 在三维场景下......
Three.js入门学习笔记05：外部模型导入-C4D转成json文件供网页使用
基本无害的博客
03-05 4537
参考学习： https://www.jianshu.com/p/906072e60197 var objectLoader = new THREE.ObjectLoader(); objectLoader.load("../model/eee.json", function ( obj ) { console.log(obj); scope.obj=obj;...
Three.js - 保存和加载 json 格式的场景
ithanmang
08-28 4416
scene也是对象，并且继承自Object3D，其中有一个方法，toJSON()可以以json格式返回场景的数据。 因此，可以同样将scene的数据保存下来，并且通过THREE.ObjectLoader()加载。 示例 http://ithanmang.com/threeJs/home/201808/20180828/01-save-scene-and-load.html 主要代码 ...
ThreeJs学习笔记——ObjLoader加载以及渲染分析
weixin_34268610的博客
12-11 6193
一、前言 这篇文章主要学习 ThreeJs 中的 demo loader/obj2，主要是分析一下 obj 是如何加载的，纹理以及材质是如何加载的，3d camera 以及 camera controller 这些是如何实现的等。那么，先来 2 个 gif 图震撼一下吧。 二、代码分析 1.html 部分 &lt;div id="glFullscreen"&gt; &lt;!-- 渲染...
Three.js 3D建模必备基础
新缸中之脑
02-13 4738
在 three.js 中，可见对象由几何体和材质构成。我们已经了解了如何创建适用于点和线图元的简单几何图形，并且遇到了各种标准网格几何图形，例如 THREE.CylinderGeometry 和 THREE.IcosahedronGeometry。在本节中，我们将了解如何从头开始创建新的网格几何体。我们还将了解 three.js 为处理对象和材质提供的其他一些支持。推荐：使用快速搭建 3D场景。
three.js 载入 3D 模型的方法
w418856的博客
05-09 3419
三维模型的加载器ColladaLoader模型加载器。GLTFLoader模型加载器。OBJLoader模型加载器。FBXLoader模型加载器。
threeJS19-Loader-json
谷子的博客
12-21 1295
需要电子档书籍或者源码可以Q群：828202939   希望可以和大家一起学习、一起进步！！ 如有错别字或有理解不到位的地方，可以留言或者加微信15250969798，博主会及时修改！！！！！ 博主的案例并不难，只是为了更好的给想入门threeJS的同学一点点经验！！！！！ 涉及的知识点博主已经从three源码库里面摘要出来放在对应的注释里面！ 今天学习three里面json格式模型的加载...
Three.js 使用JSON格式保存和加载模型
蜗牛速度额的博客
07-30 8150
前言 从外部资源中加载几何体，首先我们学会如何保存和加载Three.js的JSON格式文件。 案例 在Three.js中导出JSON文件非常容易，并且不需要引入额外的库。你需要做的只是将THREE.Mesh导出为JSON，代码如下： // 保存数据到数据库 export function addProject() { return new Promise(function(resol...
64 Three.js 使用JSON格式保存和加载模型
现在学习也不晚
03-15 9064
前言 学习从外部资源中加载几何体，首先我们学会如何保存和加载Three.js的JSON格式文件。 简单案例 案例查看地址：http://www.wjceo.com/blog/threejs/2018-03-15/124.html 在Three.js中导出JSON文件非常容易，并且不需要引入额外的库。你需要做的只是将THREE.Mesh导出为JSON，代码如下： var result ...
three.js SpotLight
最新发布
09-22
THREE.SpotLight是一种具有锥形效果的光源，它可以产生具有方向和角度的光。它通常被用于需要使用阴影的场景。相比之下，THREE.DirectionalLight则是一种平行光源，所有的光线都是平行的，并没有光锥的效果。相对于...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值