I want to see 3D model in Android Webview

Question

I want to see 3D model in Android Webview. Lots of Android smartphones can be able to seen 3D model by WebView, But, One product, named 'Galaxy Note Pro 12.2' cannot be able to seen.

First, I give you some options.

1. My Chrome(chromium) version is 48.0.2564.109.

2. Android version is 5.0.2(Lollipop)

3. WebGL is newest version.

Now, I give you some example codes.

import android.os.Build;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.webkit.CookieManager;
import android.webkit.WebSettings;
import android.webkit.WebView;

public class MainActivity extends AppCompatActivity {

private WebView mWebView;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mWebView = (WebView) findViewById(R.id.activity_main_webview);

    WebSettings webSettings = mWebView.getSettings();
    webSettings.setJavaScriptEnabled(true);
    webSettings.setSupportZoom(true);
    webSettings.setBlockNetworkImage(false);
    webSettings.setLoadsImagesAutomatically(true);
    webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE);
    webSettings.setDomStorageEnabled(true);
    webSettings.setAllowContentAccess(true);
    webSettings.setDatabaseEnabled(true);
    webSettings.setAppCacheEnabled(true);

    if(Build.VERSION.SDK_INT >= 19){
        WebView.setWebContentsDebuggingEnabled(true);
    }

    webSettings.setUserAgentString("Mozilla/5.0 (Linux; Android 5.1.1; Nexus 5 Build/LMY48B; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/43.0.2357.65 Mobile Safari/537.36");
    webSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
    CookieManager cookieManager = CookieManager.getInstance();
    cookieManager.setAcceptCookie(true);
    cookieManager.setAcceptThirdPartyCookies(mWebView, true);
    mWebView.loadUrl("http://threejs.org/examples/#webgl_multiple_renderers");
}

@Override
public void onBackPressed() {
    if(mWebView.canGoBack()) {
        mWebView.goBack();
    } else {
        super.onBackPressed();
    }
}

very easy code I think.

I already set permission. When I use other portable products(like galaxy smart phone), no problems are happen. But, Only above product can't. Also, I already check chrome://flags I read other questions, and do everything, but my problem doesn't solve.

How can I do? Are there any missing checks?

Answer 1

Webview is not well support by the device, I recoment use the XWalkView of CrossWalk to replace the webview. XWalkView supports well with the device that not support in the webview.

Here is an answer of mine about how to render 3D models with three.js in XWalkView.

Hope it helps.