You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Android Studio集成AnyChart热力图白屏及代码报错求助

Android集成AnyChart热力图白屏及WebView访问问题解决

问题背景

在Android Studio的Java应用中集成AnyChart热力图组件,采用官方示例代码开发,打开对应Activity时界面白屏,Run面板输出包含EGL_emulation、chromium相关报错。尝试通过anyChartView.webview.getSettings().setDomStorageEnabled(true);解决时,出现“无法解析符号webview”错误,导入的android.webkit.WebView未被调用。

解决方案

1. 正确访问AnyChartView内部的WebView

AnyChartView的webview是私有成员,无法直接访问,需使用官方提供的getWebView()方法获取实例,同时必须开启JavaScript(AnyChart依赖JS渲染图表):

// 替换原错误代码
WebView webView = anyChartView.getWebView();
webView.getSettings().setDomStorageEnabled(true);
webView.getSettings().setJavaScriptEnabled(true);

2. 修复布局层级遮挡问题

原XML布局中,标题和进度条的约束设置可能覆盖AnyChartView,调整布局顺序和约束,确保图表区域足够且不被遮挡:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".VPDChartActivity">

    <!-- Page Title -->
    <TextView
        android:id="@+id/text_view_vpd_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/title_activity_vpd_hm_chart"
        android:textAlignment="center"
        android:textSize="24sp"
        android:textStyle="bold"
        android:visibility="visible"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_marginTop="16dp"/>

    <ProgressBar
        android:id="@+id/progress_bar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="visible"
        app:layout_constraintTop_toBottomOf="@+id/text_view_vpd_title"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>

    <com.anychart.AnyChartView
        android:id="@+id/any_chart_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:visibility="visible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/progress_bar"/>

</androidx.constraintlayout.widget.ConstraintLayout>

3. 补充必要配置

  • 在AndroidManifest.xml中添加网络权限(WebView加载本地资源也可能需要):
<uses-permission android:name="android.permission.INTERNET"/>
  • 若目标SDK为28及以上,在application标签内添加明文访问允许,避免WebView加载资源受限:
android:usesCleartextTraffic="true"

4. 调试WebView JS错误

如果仍白屏,开启WebView调试查看JS报错:

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

然后在Chrome浏览器中输入chrome://inspect,连接设备查看WebView控制台的错误信息,定位具体问题。

修改后的完整Java代码

package com.example.hortus;

import android.os.Build;
import android.os.Bundle;
import android.webkit.WebView;
import androidx.appcompat.app.AppCompatActivity;
import com.anychart.AnyChart;
import com.anychart.AnyChartView;
import com.anychart.chart.common.dataentry.DataEntry;
import com.anychart.chart.common.dataentry.HeatDataEntry;
import com.anychart.charts.HeatMap;
import com.anychart.enums.SelectionMode;
import com.anychart.graphics.vector.SolidFill;
import java.util.ArrayList;
import java.util.List;

public class VPDChartActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_vpd_chart);
        
        AnyChartView anyChartView = findViewById(R.id.any_chart_view);
        
        // 正确配置WebView设置
        WebView webView = anyChartView.getWebView();
        webView.getSettings().setDomStorageEnabled(true);
        webView.getSettings().setJavaScriptEnabled(true);
        
        // 开启WebView调试(可选,用于排查问题)
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            WebView.setWebContentsDebuggingEnabled(true);
        }
        
        anyChartView.setProgressBar(findViewById(R.id.progress_bar));
        
        HeatMap riskMap = AnyChart.heatMap();
        riskMap.stroke("1 #fff");
        riskMap.hovered()
                .stroke("6 #fff")
                .fill(new SolidFill("#545f69", 1d))
                .labels("{ fontColor: '#fff' }");
        riskMap.interactivity().selectionMode(SelectionMode.NONE);
        riskMap.title().enabled(true);
        riskMap.title()
                .text("Risk Matrix in Project Server")
                .padding(0d, 0d, 20d, 0d);
        riskMap.labels().enabled(true);
        riskMap.labels()
                .minFontSize(14d)
                .format("function() {\n" +
                        "      var namesList = [\"Low\", \"Medium\", \"High\", \"Extreme\"];\n" +
                        "      return namesList[this.heat];\n" +
                        "    }");
        riskMap.yAxis(0).stroke(null);
        riskMap.yAxis(0).labels().padding(0d, 15d, 0d, 0d);
        riskMap.yAxis(0).ticks(false);
        riskMap.xAxis(0).stroke(null);
        riskMap.xAxis(0).ticks(false);
        riskMap.tooltip().title().useHtml(true);
        riskMap.tooltip()
                .useHtml(true)
                .titleFormat("function() {\n" +
                        "      var namesList = [\"Low\", \"Medium\", \"High\", \"Extreme\"];\n" +
                        "      return '&lt;b&gt;' + namesList[this.heat] + '&lt;/b&gt; Residual Risk';\n" +
                        "    }")
                .format("function () {\n" +
                        "       return '&lt;span style=\"color: #CECECE\"&gt;Likelihood: &lt;/span&gt;' + this.x + '&lt;br/&gt;' +\n" +
                        "           '&lt;span style=\"color: #CECECE\"&gt;Consequence: &lt;/span&gt;' + this.y;\n" +
                        "   }");
        
        List<DataEntry> data = new ArrayList<>();
        data.add(new CustomHeatDataEntry("Rare", "Insignificant", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Rare", "Minor", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Rare", "Moderate", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Rare", "Major", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Rare", "Extreme", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Unlikely", "Insignificant", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Unlikely", "Minor", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Unlikely", "Moderate", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Unlikely", "Major", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Unlikely", "Extreme", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Possible", "Insignificant", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Possible", "Minor", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Possible", "Moderate", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Possible", "Major", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Possible", "Extreme", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Likely", "Insignificant", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Likely", "Minor", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Likely", "Moderate", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Likely", "Major", 2, "#ef6c00"));
        data.add(new CustomHeatDataEntry("Likely", "Extreme", 2, "#ef6c00"));
        data.add(new CustomHeatDataEntry("Almost\nCertain", "Insignificant", 0, "#90caf9"));
        data.add(new CustomHeatDataEntry("Almost\nCertain", "Minor", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Almost\nCertain", "Moderate", 1, "#ffb74d"));
        data.add(new CustomHeatDataEntry("Almost\nCertain", "Major", 2, "#ef6c00"));
        data.add(new CustomHeatDataEntry("Almost\nCertain", "Extreme", 3, "#d84315"));
        
        riskMap.data(data);
        anyChartView.setChart(riskMap);
    }
    
    private static class CustomHeatDataEntry extends HeatDataEntry {
        CustomHeatDataEntry(String x, String y, Integer heat, String fill) {
            super(x, y, heat);
            setValue("fill", fill);
        }
    }
}

内容的提问来源于stack exchange,提问作者fiefie

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.25 05:32:04