需要相当于three.js javascript'loadTexture'语句的clojurescript答案

【问题标题】：Need clojurescript equivalent of a three.js javascript 'loadTexture' statement需要相当于three.js javascript'loadTexture'语句的clojurescript
【发布时间】：2015-02-14 07:50:50
【问题描述】：

我正在尝试将图像应用于 three.js (3js) 项目中的多维数据集。我正在用 clojurescript (cljs) 编写它。为此，您需要从磁盘加载图像并将其应用于材质。原始的 JavaScript 语句如下所示：

var material = new THREE.MeshPhongMaterial({map:THREE.ImageUtils.loadTexture("images/webgl-logo-256.jpg")})

在 cljs 中我能想到的最好的方法是：

(def material  (js/THREE.MeshPhongMaterial. (clj->js {:map (THREE.ImageUtils.loadTexture "images/webgl-logo-256.jpg")})))

这有效，因为它不会给我一个错误，但立方体没有应用图像，而是深蓝色。

使用type 命令，我可以看到map 属性（我认为应该有文件名）没有设置：

(type material)
function(parameters) {

    THREE.Material.call( this );

    this.type = 'MeshPhongMaterial';

    this.color = new THREE.Color( 0xffffff ); // diffuse
    this.ambient = new THREE.Color( 0xffffff );
    this.emissive = new THREE.Color( 0x000000 );
    this.specular = new THREE.Color( 0x111111 );
    this.shininess = 30;

    this.metal = false;

    this.wrapAround = false;
    this.wrapRGB = new THREE.Vector3( 1, 1, 1 );

    this.map = null;
   # ...

更新：即使在解决了问题之后（参见下面的答案），this.map 在type 命令输出中仍然显示为null。因此，我认为type 输出中的字段只是默认值，您不应期望它们反映正在使用的实际值（？）

我最不确定的部分是 loadTexture 命令。我希望它会写成这样：

(.-loadTexture THREE.ImageUtils "images/webgl-logo-256.jpg")

但这会返回：

clojure.lang.ExceptionInfo: (.THREE.ImageUtils -loadTexture ("images/webgl-logo-256.jpg")) 的未知点形式，分类为 [:cljs.analyzer/expr :cljs.analyzer/property :cljs.analyzer /expr] 在第 1 行 {:tag :cljs/analysis-error, :file "", :line 1, :column 1} 零

有谁知道这个语句应该如何用 clojurescript 编写？

【问题讨论】：

请学习如何在 SO 上正确地format code。

标签： javascript clojure three.js clojurescript

【解决方案1】：

(THREE.ImageUtils.loadTexture "images/webgl-logo-256.jpg") 不是有效的 ClojureScript 函数调用（至少，对于 tree.js）。这次尝试

(.-loadTexture THREE.ImageUtils "images/webgl-logo-256.jpg")

非常接近。应该改为：

(.loadTexture (.-ImageUtils THREE) "images/webgl-logo-256.jpg")

在 ClojureScript 中，. 用于 JS 函数调用（包括方法），.- 用于访问对象属性。更多详情here。

【讨论】：

谢谢你。这是我解决问题的关键。我在另一篇文章中发布了我的最终答案。我还应该注意，对三个对象的任何引用都需要写为“js/THREE”。

【解决方案2】：

根据 Jarlax 的建议，这是我想出的最终解决方案。

我以两种形式实现它：一种分为两个表达式，一种组合。注意：部分问题是使用“MeshPhongMaterial”而不是“MeshBasicMaterial”。无论我做什么，使用“MeshPhongMaterial”时都无法显示图像，因此我切换到使用“MeshBasicMaterial”。

解决方案 A（两行）：

(def mat-map (.loadTexture (.-ImageUtils js/THREE) "images/webgl-logo-256.jpg"))
(def material (js/THREE.MeshBasicMaterial. (clj->js {:map mat-map})))

解决方案 B（组合）：

(def material (js/THREE.MeshBasicMaterial. (clj->js {:map (.loadTexture (.-ImageUtils js/THREE) "images/webgl-logo-256.jpg")})))

注意：你总是需要在三个对象前加上'js/'，例如“js/THREE”，否则你会得到一个编译错误。

【讨论】：