iOS12.3.1でWebGLが描画されない

Question

lightglというライブラリを読み込み、流体アニメーションを実現したいのですが、iOSでは描画されず苦戦しています。
自分はiOS12.3.1しか持ってないのですが、もしかすると他のバージョンでも表示されないかもしれません。
Android端末では表示されました。

コードは以下です。
WebGL自体が初めてなので、何が間違っているか検討もつかず、
原因が分かる方がいればご教示いただきたいです。
よろしくおねがいします。

https://codepen.io/macoo/pen/KLjeVo

Answer 1

確証はないですが処理が重すぎて動作していない気がします。
(iOSだと制限がかかる？)

Answer 2

直接的な回答ではないですが、他のシェーダを試してみるというのは如何でしょうか？

■ GLSL Sandbox #8143.0
http://glslsandbox.com/e#8143.0

■ GLSL Sandbox #37120.9
http://glslsandbox.com/e#37120.9

■ WebGL Fluid Simulation
https://paveldogreat.github.io/WebGL-Fluid-Simulation/

Comments

[cx20]

> ■ GLSL Sandbox #8143.0
> http://glslsandbox.com/e#8143.0

例示しておいて何ですが iOS 12.3 で見たら結構実行結果違いますね。
参考情報ですが iPhone でシェーダが綺麗に表示されない場合は、精度の指定を変更すると改善する場合があります。その分負荷はかかるようになりますけど。
precision mediump float;
→ precision highp float;

[退会済みユーザー]

ありがとうございます。
■ WebGL Fluid Simulation
https://paveldogreat.github.io/WebGL-Fluid-Simulation/
今回はこちらで試してみようと思います。

Answer 3

yasutomiさんのご回答で正着かと思いますが、
macOSと、実機をつなげ、Safariにて設定することによって、
実機を使っての、JavaScriptなどの動きなどの検証を行うことができます。
その中で、

[Error] Error while parsing the 'sandbox' attribute: 'allow-presentation' is an invalid sandbox flag. (KLjeVo, line 1500)
[Error] Error: Rendering to this texture is not supported (incomplete framebuffer)
    drawTo (lightgl.js:1836:94)
    reset (KLjeVo:488)
    FluidSim (KLjeVo:493)
    runFluidSim (KLjeVo:632)
    グローバルコード (KLjeVo:628)

とエラーが出ておりました。
ここら辺のワードを検索ワードにし、調査せれると、原因や、対処法が見つかるかと思います。