How do I set rotation of lensflare?

Questions
,
1 
        var textureLoader = new THREE.TextureLoader();
        var textureFlare0 = textureLoader.load('model/sparkle5.png');

        var pointLight = new THREE.PointLight(0xffffff, 1.5, 1000);
        pointLight.position.set(0, 50, 15);
        scene.add(pointLight);

        var lensflare = new THREE.Lensflare();
        lensflare.addElement(new THREE.LensflareElement(textureFlare0, 700, 0, pointLight.color));
        var lensflareElement = new THREE.LensflareElement(textureFlare0, 200, 0)
        lensflare.addElement(lensflareElement);
        lensflare.rotation = Math.PI / 4;// It does not works,why?
        pointLight.add(lensflare);

why set rotation of lensflare does not works?
Original drawing：image
I want it:

image
image844Ă—627 68.9 KB

2

There is no rotation for the Lensflare implementation. If you only want to rotate it do it with the image file itself and a image editing tool, if you want to animate it you could only modify it’s shader material to apply a rotation.

1 Like
3

For all images rotation, into “Lensflare.js” add code:

float angle=0.5;
vec3 vRotated=vec3(position.x*cos(angle)-position.y*sin(angle),position.y*cos(angle)+position.x*sin(angle),position.z);
pos=vRotated.xy;

image
image960Ă—496 9.21 KB

image

1 Like
4

Hi,thank for your reply, I try and it works, but I still don’t know how to achieve this effect,the lensflare of the diamond looks so real! Can u give me some solutions?
And the website is: https://jcd.bavlo.com/WebJewelry/designInfo_pc.html?v=U2FsdGVkX18zlyGvUFvVSs4bYp5tpd7l7V7+dykNQ1M&d=U2FsdGVkX1/eavk7EVFl22O1ETAeqTfJKHHV0XD8oMY=
image

5

Code obfuscated. Very hard to get right code

6

Deobfuscated, optimized: Diamond spark shader

1 Like
7

Wow, the effect looks very great! It must spend lot of time, thank you very much!