drawcall / Proton

Javascript particle animation library
https://drawcall.github.io/Proton/
MIT License
2.42k stars 275 forks source link

rendering problem #48

Closed jackysharpmotion closed 6 years ago

jackysharpmotion commented 6 years ago

Dear A-jie,

How are you? My name is Jacky, I've tried to use your proton.js to add a particle effect into my webpage, it works fine in FireFox, mobile Safari & mobile Chrome, but not sure why there is a problem of my page when rendering in Mac desktop version Safari and Chrome - but your demo page still looks fine under these 2 platforms!

Here is my link:

https://www.sharpmotion.com.hk/ https://www.sharpmotion.com.hk/about

Attached is the screen shot screenshot

Thanks a lot!

Jacky

drawcall commented 6 years ago

You can use the following way. First I suggest you upgrade proton to v3.0

renderer = new Proton.WebGLRenderer(canvas);
renderer.gl.blendFuncSeparate(renderer.gl.SRC_ALPHA, renderer.gl.ONE, renderer.gl.ONE, renderer.gl.ONE_MINUS_SRC_ALPHA);
proton.addRenderer(renderer);
jackysharpmotion commented 6 years ago

We’ve found that it seems not the problem of your old or new js version, as we need to set the particle with an alpha transparency, the problem occurs in Mac desktop version Safari and Chrome only, FireFox and mobile Safari/Chrome is fine

however, when we delete the alpha (change back to 100% opacity), it is OK in Mac desktop version Safari and Chrome again.

Best Regards,

Jacky Cheung Director | Creative Director | MHKDA BA (Hons)

Direct: (852) 2529 3715 Mobile: (852) 9871 3371

WeChat: jackysharpmotion Email: jacky@sharpmotion.com.hk

816, 8/F, Topsail Plaza, 11 On Sum Street, Shek Mun, Shatin, Hong Kong www.sharpmotion.com.hk

On 26 Jun 2018, at 11:25 AM, A-JIE notifications@github.com wrote:

Is it fixed?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/a-jie/Proton/issues/48#issuecomment-400165897, or mute the thread https://github.com/notifications/unsubscribe-auth/AGPZ12DXP1ht20Y-vSBHETrlsAJ0GOCzks5uAamNgaJpZM4QzkNE.

drawcall commented 6 years ago

Use my following method to try it

renderer = new Proton.WebGLRenderer(canvas);
renderer.gl.blendFuncSeparate(renderer.gl.SRC_ALPHA, renderer.gl.ONE, renderer.gl.ONE, renderer.gl.ONE_MINUS_SRC_ALPHA);
proton.addRenderer(renderer);
jackysharpmotion commented 6 years ago

Dear A-jie,

Thanks a lot! we’ll try it out and let you know the outcome shortly!!

Best Regards,

Jacky Cheung Director | Creative Director | MHKDA BA (Hons)

Direct: (852) 2529 3715 Mobile: (852) 9871 3371

WeChat: jackysharpmotion Email: jacky@sharpmotion.com.hk

816, 8/F, Topsail Plaza, 11 On Sum Street, Shek Mun, Shatin, Hong Kong www.sharpmotion.com.hk

On 26 Jun 2018, at 12:28 PM, A-JIE notifications@github.com wrote:

Use my following method to try it

renderer = new Proton.WebGLRenderer(canvas); renderer.gl.blendFuncSeparate(renderer.gl.SRC_ALPHA, renderer.gl.ONE, renderer.gl.ONE, renderer.gl.ONE_MINUS_SRC_ALPHA); proton.addRenderer(renderer); — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/a-jie/Proton/issues/48#issuecomment-400174619, or mute the thread https://github.com/notifications/unsubscribe-auth/AGPZ1yv1EmEx7Y6Iqhe0cCJRnLK-zIpBks5uAbhlgaJpZM4QzkNE.

jackysharpmotion commented 6 years ago

Dear A-jie,

tried the code but the particle effect even wouldn’t show up …. sorry!

Best Regards,

Jacky Cheung Director | Creative Director | MHKDA BA (Hons)

Direct: (852) 2529 3715 Mobile: (852) 9871 3371

WeChat: jackysharpmotion Email: jacky@sharpmotion.com.hk

816, 8/F, Topsail Plaza, 11 On Sum Street, Shek Mun, Shatin, Hong Kong www.sharpmotion.com.hk

On 26 Jun 2018, at 12:28 PM, A-JIE notifications@github.com wrote:

Use my following method to try it

renderer = new Proton.WebGLRenderer(canvas); renderer.gl.blendFuncSeparate(renderer.gl.SRC_ALPHA, renderer.gl.ONE, renderer.gl.ONE, renderer.gl.ONE_MINUS_SRC_ALPHA); proton.addRenderer(renderer); — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/a-jie/Proton/issues/48#issuecomment-400174619, or mute the thread https://github.com/notifications/unsubscribe-auth/AGPZ1yv1EmEx7Y6Iqhe0cCJRnLK-zIpBks5uAbhlgaJpZM4QzkNE.

drawcall commented 6 years ago

This is the code for proton v3. I have tried it with your similar example. You can try it

jackysharpmotion commented 6 years ago

Oh yes, v3 is OK now, we’re fine tuning the parameter as the emission seems not as smooth as the old version

Old and existing: www.sharpmotion.com.hk

New testing: www.sharpmotion.com.hk/index3.html

Thanks a lot!

Jacky

Sent from my iPhone

On 28 Jun 2018, at 11:52 AM, A-JIE notifications@github.com wrote:

This is the code for proton v3

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

jackysharpmotion commented 6 years ago

Not sure why the emission is jigging, not smooth, any pararmeter i need to adjust?

Thanks!

Sent from my iPhone

On 28 Jun 2018, at 12:47 PM, Jacky@SharpMotion jacky@sharpmotion.com.hk wrote:

Oh yes, v3 is OK now, we’re fine tuning the parameter as the emission seems not as smooth as the old version

Old and existing: www.sharpmotion.com.hk

New testing: www.sharpmotion.com.hk/index3.html

Thanks a lot!

Jacky

Sent from my iPhone

On 28 Jun 2018, at 11:52 AM, A-JIE notifications@github.com wrote:

This is the code for proton v3

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

jackysharpmotion commented 6 years ago

Dear A-jie,

adjusted a parameter and the problem is fixed.

Thanks a lot for your help indeed! coz this bug bother me quite a bit of time, cheers!

Best Regards,

Jacky Cheung Director | Creative Director | MHKDA BA (Hons)

Direct: (852) 2529 3715 Mobile: (852) 9871 3371

WeChat: jackysharpmotion Email: jacky@sharpmotion.com.hk

816, 8/F, Topsail Plaza, 11 On Sum Street, Shek Mun, Shatin, Hong Kong www.sharpmotion.com.hk

On 28 Jun 2018, at 1:03 PM, Jacky@SharpMotion jacky@sharpmotion.com.hk wrote:

Not sure why the emission is jigging, not smooth, any pararmeter i need to adjust?

Thanks!

Sent from my iPhone

On 28 Jun 2018, at 12:47 PM, Jacky@SharpMotion <jacky@sharpmotion.com.hk mailto:jacky@sharpmotion.com.hk> wrote:

Oh yes, v3 is OK now, we’re fine tuning the parameter as the emission seems not as smooth as the old version

Old and existing: www.sharpmotion.com.hk http://www.sharpmotion.com.hk/

New testing: www.sharpmotion.com.hk/index3.html http://www.sharpmotion.com.hk/index3.html

Thanks a lot!

Jacky

Sent from my iPhone

On 28 Jun 2018, at 11:52 AM, A-JIE <notifications@github.com mailto:notifications@github.com> wrote:

This is the code for proton v3

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/a-jie/Proton/issues/48#issuecomment-400902615, or mute the thread https://github.com/notifications/unsubscribe-auth/AGPZ10_7ryoFVGOsHad1VYxM9fVvD443ks5uBFLmgaJpZM4QzkNE.