[英]Blurred canvas texture in Three.js
I'm trying to use blurred texture in Three.js scene, but it looks incorrect. 我正在尝试在Three.js场景中使用模糊的纹理,但是它看起来不正确。
Canvas: 帆布:
var c = document.getElementById("myCanvas");
var context1 = c.getContext("2d");
context1.filter = "blur(16px)";
context1.beginPath();
context1.fillStyle = "red";
context1.moveTo(35, 65);
context1.lineTo(905, 55);
context1.lineTo(605, 155);
context1.lineTo(65, 105);
context1.fill();
Canvas texture: http://jsfiddle.net/7Lzag9kc/ 画布纹理: http : //jsfiddle.net/7Lzag9kc/
Three.js material: Three.js资料:
var texture1 = new THREE.Texture(canvas1)
texture1.needsUpdate = true;
var material = new THREE.MeshBasicMaterial({
map: texture1,
transparent: true,
side: THREE.DoubleSide,
alphaTest: 0.5
});
Three.js scene: http://jsfiddle.net/h31wv2xb/5/ Three.js场景: http : //jsfiddle.net/h31wv2xb/5/
What am I missing? 我想念什么?
尝试从纹理构造函数中删除“ alphaTest”。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.