三、js中的着色网格问题答案

【问题标题】：Issue in Coloring mesh in Three,js三、js中的着色网格问题
【发布时间】：2013-07-02 00:56:56
【问题描述】：

我有一个网格，我根据用户要求创建和着色。我正在使用 HTML5 颜色选择器。我正在从颜色选择器访问颜色值，如下所示： var colorChosen = $("#colorAgent").val() // 它给出的值是："#ff0080" ;

我正在删除 # 使其成为十六进制代码 => colorChosen = "0xff0080" 当我使用以下代码制作网格时

var material new THREE.MeshBasicMaterial({ color:colorChosen , 线框线宽：80，顶点颜色：三面颜色，线框：假，不透明度：0.8，透明：真，侧面：THREE.DoubleSide，可见：真 });

它不应用颜色，但如果我从 colorChosen 变量中删除引号（即 colorChosen = 0xff00），它会应用颜色。

请告诉如何删除引号，以便根据选择的颜色为我的网格着色。

谢谢

【问题讨论】：

标签： javascript three.js

【解决方案1】：

看看Color.js。您可以使用许多实用程序。

例如，在你创建了你的材质之后，你可以像这样重置颜色：

material.color.setStyle( "#ff0080" );

您也可以在第一次使用此模式时正确设置颜色：

var color = new THREE.Color( "#ff0080" );
var hex = color.getHex();
var material = new THREE.MeshBasicMaterial( { color: hex } );

three.js r.58

【讨论】：

【解决方案2】：

它不带引号的原因是color 属性应该是一个整数，而不是一个字符串。将其转换为十六进制代码后，您可以将其传递给 parseInt()，它会返回等效的整数：

colorChosen = 0xff0080;
var material new THREE.MeshBasicMaterial({ color: parseInt(colorChosen) , wireframe_linewidth: 80,vertexColors:THREE.FaceColors, wireframe: false,opacity: 0.8,transparent: true, side: THREE.DoubleSide, visible: true });

【讨论】：

【解决方案3】：

你也可以像这样给网格的颜色，

var material = new THREE.MeshLambertMaterial({color: 0xffffff, vertexColors: THREE.FaceColors, shading: THREE.FlatShading});

【讨论】：