model - 来自three.js中的灯模型的光-6ren

model - 来自three.js中的灯模型的光

转载作者：行者123 更新时间：2023-12-03 14:32:44

25

4

我在 blender 中开发了一个 3D 灯模型，并使用 three.js 将其加载到网络上。 .

该模型非常基础，但对我而言重要的是我希望有人告诉我如何在 three.js 中产生光的想法。这应该给人一种来自灯内部的错觉，因为你可以找到很多关于如何从远处照亮一个物体的例子，但是从像这盏灯这样的物体(特别是模型)的一侧发射光呢？设想。

请理解我不是偷懒，只是three.js文档非常有限，我无法找到特定于我需要的示例或解释。

这是我到目前为止加载模型的代码:

<!DOCTYPE html>
<html>
<head>
<title>example 1: load model</title>
<script type="text/javascript" src="js/three.js"></script>
<script src="js/TrackballControls.js"></script>

<script type="text/javascript">
var controls;
var init = function() {
  var canv = document.getElementsByTagName("canvas")[0];
  var w = canv.clientWidth;
  var h = canv.clientHeight;

  var renderer = new THREE.WebGLRenderer({canvas:canv, antialias: true});
  renderer.setSize( w, h );


  var scene = new THREE.Scene();

  var camera = new THREE.PerspectiveCamera(
      40,     // Field of view
      w / h,  // Aspect ratio
      5,    // Near
      10000   // Far
  );
  camera.position.set( -10, 7, 10 );
  camera.lookAt(scene.position);

  // CONTROLS
 controls = new THREE.TrackballControls( camera );

  light = new THREE.PointLight( 0xFFFFDD );
  light.position.set( -15, 10, 15 );
  scene.add( light );



  var loader = new THREE.JSONLoader(  );
  var onGeometry = function(geom, mats) {
    var mesh = new THREE.Mesh( geom, new THREE.MeshFaceMaterial( mats ) );
    scene.add(mesh);
  };
  loader.load("models/lamp.js", onGeometry);

  var render = function() {

    renderer.render(scene, camera);
    controls.update();
  };

  setInterval(render,10);
};

window.onload = init;
window.onresize = init;
</script>
</head>
<body><canvas style="width:100%;height:95%;border:1px gray solid;"></body>
</html>

最佳答案

真正的灯可以做很多事情，所有这些都有助于整体体验。因此，在尝试复制这种错觉时，您可能需要考虑许多方面。和不同的技术......当然不是所有的都需要。

照亮周围。这是最明显的，并且很简单地涉及将灯定位到灯泡所在的位置。这可以是 SpotLight 或 PointLight，具体取决于您想要的灯类型。如果你看看这个真实的例子:http://www.piggsvinet.com/jalkalamppu.jpg-for-web-normal.jpg ，您甚至可以考虑多个灯。一盏聚光灯用于柔和的普通灯光，两盏聚光灯用于上下照明。

灯是塑造光线还是以某种方式阻碍光线？您可以使用上述多个灯光和/或阴影映射来创建更逼真的灯光输出。其他技术是轻 cookies ，如下所述:http://docs.unity3d.com/Documentation/Components/class-Light.html .但是 Three.js 没有内置对轻量 cookie 的支持，我不知道有任何例子可以做到这一点。

您可能希望为实际灯模型提供发光外观。一种方法是为灯罩 Material 赋予发光颜色。

可能你想给灯一个光环效果，或者类似的让周围的空气看起来有点戴手套(空气中的小颗粒反射一些光)。这可以使用粒子、纹理广告牌或某种类似这样的神光后处理效果来完成:http://threejs.org/examples/webgl_postprocessing_godrays.html

对于您的灯模型示例，您甚至可以创建一个锥形几何体来表示从灯中发出的光的形状。这可以设置为部分透明，使用合适的混合/纹理/发光颜色，除了实际的 3d 光(仅影响它照亮的表面)之外，还可以创建聚光灯锥的错觉。

可能考虑镜头光晕，http://threejs.org/examples/webgl_lensflares.html

如您所见，“来自灯内的错觉”是一个巨大的主题。也许你可以更具体地说明你真正想要完成的事情。

关于model - 来自three.js中的灯模型的光，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17265735/

25

4

0

文章推荐： certificate - 如何找出openssl可信证书的路径？

文章推荐： visual-studio - 在 Visual Studio 2010 中更改行长

文章推荐： coffeescript - CoffeeScript 上的 Javadoc？

文章推荐： scala - 是否有 "advanced Scala"主题的中心站点/页面？

c# - Mvvm 模型 View 模型
可不可以命名为MVVM模型？因为View通过查看模型数据。 View 是否应该只与 ViewModelData 交互？我确实在某处读到正确的 MVVM 模型应该在 ViewModel 而不是 Mode
javascript - 模型 -> 观察者 -> View -> Controller -> 模型 ->
我正在阅读有关设计模式的文章，虽然作者们都认为观察者模式很酷，但在设计方面，每个人都在谈论 MVC。我有点困惑，MVC 图不是循环的，代码流具有闭合拓扑不是很自然吗？为什么没有人谈论这种模式: mo
c# - WPF 中的便笺项目。模型、 View 、 View 模型
我正在开发一个 Sticky Notes 项目并在 WPF 中做 UI，显然将 MVVM 作为我的架构设计选择。我正在重新考虑我的模型、 View 和 View 模型应该是什么。我有一个名为 Not
C# 根据模型中的枚举属性将列表<模型> 转换为字典<枚举，列表<模型>>？
不要混淆:How can I convert List to Hashtable in C#? 我有一个模型列表，我想将它们组织成一个哈希表，以枚举作为键，模型列表(具有枚举的值)作为值。 publi
c# - 实体 vs 模型 vs View 模型
我只是花了一些时间阅读这些术语(我不经常使用它们，因为我们没有任何 MVC 应用程序，我通常只说“模型”)，但我觉得根据上下文，这些意味着不同的东西: 实体这很简单，它是数据库中的一行: 2) In
c# - 在大型应用程序中使用 MVVM - 共享 View 模型、模型、状态等
我想知道你们中是否有人知道一些很好的教程来解释大型应用程序的 MVVM。我发现关于 MVVM 的每个教程都只是基础知识解释(如何实现模型、 View 模型和 View )，但我对在应用程序页面之间传递
swift - 清除 Realm 中除一种对象类型(模型)之外的所有对象类型(模型)的方法
我想realm.delete() 我的 Realm 中除了一个模型之外的所有模型。有什么办法可以不列出所有这些吗？也许是一种遍历 Realm 中当前存在的所有类型的方法？最佳答案您可以从您的 R
php - Mocking Laravel Eloquent 模型 - AppServiceProvider 中使用的 Mocking 模型
我正在尝试使用 alias 指令模拟一个 Eloquent 模型，如下所示: $transporter = \Mockery::mock('alias:' . Transporter::class)
R Stargazer 与 pglm 模型 - 在 plm 模型中转换二项式 pglm 模型
我正在使用 stargazer 创建我的 plm 汇总表。 library(plm) library(pglm) data("Unions", package = "pglm") anb1 <- pl
ASP.NET MVC + EF 4.1 分层、模型、 View 模型
我读了几篇与 ASP.NET 分层架构相关的文章和问题，但是读得太多后我有点困惑。 UI 层是在 ASP.NET MVC 中开发的，对于数据访问，我在项目中使用 EF。我想通过一个例子来描述我的问题
ios -/ml 模型/Inception V3.ml 模型 : unable to read document
我收到此消息错误: Inceptionv3.mlmodel: unable to read document 我下载了最新版本的 xcode。 9.4 版测试版 (9Q1004a) 最佳答案您没有
c# - ASP.NET MVC3 Automapper View 模型/模型 View 验证
(同样，一个 MVC 验证问题。我知道，我知道......) 我想使用 AutoMapper ( http://automapper.codeplex.com/ ) 来验证我的创建 View 中不在我
android - 如何使用 sharedview 模型 koin android 注入(inject)具有作用域的 View 模型
需要澄清一件事，现在我正在处理一个流程，其中我有两个 View 模型，一个依赖于另一个 View 模型，为了处理这件事，我尝试在我的基本 Activity 中注入(inject)两个 View 模型，
wpf - 如何在 Window.Resources 标签中使用带有数据绑定(bind)的 View 模型、模型、命令类？
如果 WPF MVVM 应该没有代码，为什么在使用 ICommand 时，是否需要在 Window.xaml.cs 代码中实例化 DataContext 属性？我已经并排观看并关注了 YouTube
asp.net - 模型-存储库-服务-验证器- View - View 模型- Controller 设计模式(？)
当我第一次听说 ASP.NET MVC 时，我认为这意味着应用程序由三个部分组成:模型、 View 和 Controller 。然后我读到 NerdDinner并学习了存储库和 View 模型的方法
python - 如何使用 mmconvert 将 tensorflow 模型(InceptionResnetV2 pb 文件)转换为 pytorch 模型？
Platform : ubuntu 16.04 Python version: 3.5.2 mmdnn version : 0.2.5 Source framework with version :
swift - 在 super.init 初始化 self super.init 之前，在属性访问 'self' 中使用 'model'(品牌 : brand, 模型:模型)
我正在学习本教程:https://www.raywenderlich.com/160728/object-oriented-programming-swift ...并尝试对代码进行一些个人调整，看看
AngularJS 模型
我正试图围绕 AngularJS。我很喜欢它，但一个核心概念似乎在逃避我——模型在哪里？例如，如果我有一个显示多个交易列表的应用程序。一个列表向服务器查询匹配某些条件的分页事务集，另一个列表使用不同
模型、业务规则和持久性
我在为某个应用程序找出最佳方法时遇到了麻烦。我不太习惯取代旧 TLA(三层架构)的新架构，所以这就是我的来源。在为我的应用程序(POCO 类，对吧？？)设计模型和 DAL 时，我有以下疑问: 我的模
Django - 模型 - 如何描述两个模型之间的特定双向关系？
我有两个模型:Person 和 Department。每个人可以在一个部门工作。部门可以由多人管理。我不确定如何在 Django 模型中构建这种关系。这是我不成功的尝试之一 [models.py]:

首页

博学

6Ren·AI

商城

model - 来自three.js中的灯模型的光