百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术教程 > 正文

如何用LightningChart创建Android图表数据可视化应用程序(上)

mhr18 2025-03-10 18:23 16 浏览 0 评论

LightningChart JS 是一款高性能的 JavaScript 图表工具,专注于性能密集型、实时可视化图表解决方案。

LightningChart JS官方最新版免费下载试用,历史版本下载,在线文档和帮助文件下载-慧都网

本次我们将介绍如何使用Android Studio 和 LightningChart JS (IIFE)创建一个 android 图表数据可视化应用程序。

接下来的教程中,我们将使用 Ionic Capacitor 等其他框架,它们是构建移动应用程序必需的,所以建议安装本文中提到的所有工具。

一、项目概况

LightningChart JS 拥有大量适用于 JS 的高性能 Android 图表库,这些图表库都可以在 Android 应用程序中使用,同时您也可以通过LightningChart JS GitHub 模板来了解更多信息。

该应用程序将包含三个图表:

  • 音频频谱图
  • 渲染速度图
  • 蜡烛图交易

二、设置Android Studio

Android studio是一个免费的IDE,所以你有机会在Windows、macOS和Linux上使用它。你可以在这里下载Android Studio。
安装非常简单,您可以从这里获得官方的Android文档,然后进入SDK管理器,安装安卓的最新平台。

你可以安装你需要的所有平台,但我建议安装最新的平台,因为如果你想在 Google Play 控制台中发布你的 Android 图表应用程序,这就是其中的一个要求。

要完成 Android Studio 的设置,请安装适用于 Android 的 SDK 工具。您可以下载本文中展示的工具或选择您需要的工具。

下一件事情是安装最新的 Java SDK。安装这个SDK,您必须访问Oracle 官方网站,而且需要创建一个帐户。

三、开发工具

Gradle

Gradle是一个用于多语言软件开发的构建自动化工具。所以,Gradle对于移动应用程序来说将是非常重要的。你可以从这里得到和看到安装文档。
Gradle的安装基本上是把源文件复制到指定的路径上。

四、环境参数

有必要为 Android Studio、Java SDK 和 Gradle 创建环境变量。 您可以通过在 Windows 菜单中键入这些词来直接转到环境变量:

然后,点击【环境变量】按钮:

现在您只需要添加带有 android SDK 路径的变量:

接下来需要转到系统变量部分并编辑 [Path] 变量:

最后,只需添加 Java 路径和 Gradle 路径,然后在 Android Studio 中继续编写代码:

五、安卓项目

当你在android studio中打开app文件夹,你会看到一棵这样的树:

现在,让我们看看每个文件夹的解释以及类与 HTML 文件之间的关系。

清单 - AndroidManifest.xml

每个应用程序项目都必须在项目源集的根目录下有一个 AndroidManifest.xml 文件。清单文件向 Android 构建工具、Android 操作系统和 Google Play 描述了有关您的应用的基本信息。


        
        
        
        
            
                
                
            
        
    

在清单中,我们需要指定将在我们的应用程序中呈现窗口的类。 如果您转到 java/lightningChart 文件夹,您将看到一些与我们在 android 清单中具有相同名称的文件/类。

这些名称应该与我们创建并要呈现的每个类相匹配, manifest 文件是一个非常重要的文件,以后你会用到这个文件来指定很多设置,比如深度链接属性。
Java / LightningChart

在每个文件中,我们可以创建函数来验证、修改或创建要在窗口中显示的元素。 默认情况下,您会找到[onCreate]函数

protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_chart_display);
final Bundle bundle = getIntent().getExtras();
webView = findViewById(R.id.chartDisplayWebView);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadUrl("file:///android_asset/AudioSpectogramChart.html");
}

onCreate]方法,将在活动被创建时被调用。换句话说,当我们点击一个引用特定活动的按钮时,[onCreate]方法将被调用,在这个方法中我们可以加载一个HTML文件(这个文件可以作为一个用户界面)。在[RenderingSpeedChart]文件里面,你会看到更多的代码。

class DataTask extends TimerTask {
        private WebView view;
        private Random random;
DataTask(WebView view) {
            this.view = view;
            this.random = new Random();
}
        @Override
public void run() {
            // Generate random float to show
            float f = random.nextFloat();
            final String data = Float.toString(f);
            // send the generated data to the WebView
            // method for sending depends on Android version
            if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.KITKAT) {
view.post(new Runnable() {
                    @Override
                    public void run() {
view.evaluateJavascript("addData('" + data + "')", null);
}
});
} else {
view.post(new Runnable() {
                    @Override
                    public void run() {
view.loadUrl("javascript:addData('" + data + "')");
}
});
}
} 

[ addData]函数位于正在加载的 HTML 文件中 ( file:///android_asset/RenderingSpeed.html )。我们正在访问 HTML 作为这个“控制器”的“视图”,使用 Android [WebView]类:

“WebView 对象允许您将 Web 内容显示为活动布局的一部分,但缺少完全开发的浏览器的某些功能。当您需要增加对 UI 和高级配置选项的控制时,WebView 很有用,这些选项允许您将网页嵌入到专门为您的应用程序设计的环境中。”参考
Java / LightningChart / MainActivity
MainActivity 将用作我们的[main()]方法。该组件是用户启动应用程序时出现的第一个屏幕。 从这个文件中,我们将声明将执行我们的活动的方法。这些方法可以通过按下一个 UI 对象来执行:

public void createRenderingSpeedChart(View view) {
Intent intent = new Intent(this, RenderingSpeedChart.class);
Bundle bundle = new Bundle();
bundle.putBoolean("useRandom", true);
intent.putExtras(bundle);
startActivity(intent);
}
    public void createAudioSpectogramChart(View view) {
Intent intent = new Intent(this, AudioSpectogramChart.class);
Bundle bundle = new Bundle();
bundle.putBoolean("useRandom", true);
intent.putExtras(bundle);
startActivity(intent);
}
    public void createTradingChart(View view) {
Intent intent = new Intent(this, TradingChart.class);
Bundle bundle = new Bundle();
bundle.putBoolean("useRandom", true);
intent.putExtras(bundle);
startActivity(intent);
}

六、布局

在创建新项目时,我们会在 Layout 文件夹中发现一些 XML 文件:

activity_main.xml 将作为默认接口工作,它将与我们的 MainActivity 类相关。 如果打开该文件,您将看到一个包含每个图表按钮的设计器:

您可以在此处添加 UI 控件。如果单击每个按钮,您将在窗口右侧看到属性面板。 在 [text] 属性中,您可以设置要在应用程序中显示的文本。

在 [onClick] 属性中,您可以指定将调用活动的方法的名称。此方法应位于 MainActivity 类中。

七、资产文件夹

在创建新项目时,我们会在 Layout 文件夹中发现一些 XML 文件:
activity_main.xml 将作为默认接口工作,它将与我们的 MainActivity 类相关。 如果打开该文件,您将看到一个包含每个图表按钮的设计器:
在此文件夹中,您将找到将为活动加载的 HTML 文件。此外,您还会找到一个 JSON 文件,其中包含频谱图的源数据。

IIFE.js 文件包含创建 LC JS 图表所需的所有函数和属性。在之前的文章中,我们已经回顾了频谱图和渲染图。在使用 Android 图表时,请随时查看它们以获取更多参考。

今天关于“如何用LightningChart创建Android图表数据可视化应用程序”第一部分的介绍到这里了,关注我们了解完整教程。

下期阅读:如何用LightningChart创建Android图表数据可视化应用程序(下)

Javascript高性能WebGL图表工具-LightningChart JS中文资源,最新版免费下载,视频教程,技术支持,正版购买-慧都网-慧都网

相关推荐

【预警通报】关于WebLogic存在远程代码执行高危漏洞的预警通报

近日,Oracle官方发布了2021年1月关键补丁更新公告CPU(CriticalPatchUpdate),共修复了包括CVE-2021-2109(WeblogicServer远程代码执行漏洞)...

医院信息系统突发应急演练记录(医院信息化应急演练)

信息系统突发事件应急预案演练记录演练内容信息系统突发事件应急预案演练参与人员信息科参与科室:全院各部门日期xxxx-xx-xx时间20:00至24:00地点信息科记录:xxx1、...

一文掌握怎么利用Shell+Python实现完美版的多数据源备份程序

简介:在当今数字化时代,无论是企业还是个人,数据的安全性和业务的连续性都是至关重要的。数据一旦丢失,可能会造成无法估量的损失。因此,如何有效地对分布在不同位置的数据进行备份,尤其是异地备份,成为了一个...

docker搭建系统环境(docker搭建centos)

Docker安装(CentOS7)1.卸载旧版Docker#检查已安装版本yumlistinstalled|grepdocker#卸载旧版本yumremove-ydocker.x...

基础篇:数据库 SQL 入门教程(sql数据库入门书籍推荐)

SQL介绍什么是SQLSQL指结构化查询语言,是用于访问和处理数据库的标准的计算机语言。它使我们有能力访问数据库,可与多种数据库程序协同工作,如MSAccess、DB2、Informix、M...

Java21杀手级新特性!3行代码性能翻倍

导语某券商系统用这招,交易延迟从12ms降到0.8ms!本文揭秘Oracle官方未公开的Record模式匹配+虚拟线程深度优化+向量API神操作,代码量直降70%!一、Record模式匹配(代码量↓8...

一文读懂JDK21的虚拟线程(java虚拟线程)

概述JDK21已于2023年9月19日发布,作为Oracle标准Java实现的一个LTS版本发布,发布了15想新特性,其中虚拟线程呼声较高。虚拟线程是JDK21中引入的一项重要特性,它是一种轻量级的...

效率!MacOS下超级好用的Linux虚拟工具:Lima

对于MacOS用户来说,搭建Linux虚拟环境一直是件让人头疼的事。无论是VirtualBox还是商业的VMware,都显得过于笨重且配置复杂。今天,我们要介绍一个轻巧方便的纯命令行Linux虚拟工具...

所谓SaaS(所谓三维目标一般都应包括)

2010年前后,一个科技媒体的主编写一些关于云计算的概念性问题,就可以作为头版头条了。那时候的云计算,更多的还停留在一些概念性的问题上。而基于云计算而生的SaaS更是“养在深闺人未识”,一度成为被IT...

ORA-00600 「25027」 「x」报错(报错0xc0000001)

问题现象:在用到LOB大对象的业务中,进行数据的插入,失败了,在报警文件中报错:ORA-00600:内部错误代码,参数:[25027],[10],[0],[],[],[],[],[...

安卓7源码编译(安卓源码编译环境lunch失败,uname命令找不到)

前面已经下载好源码了,接下来是下载手机对应的二进制驱动执行编译源码命令下载厂商驱动https://developers.google.com/android/drivers?hl=zh-cn搜索NGI...

编译安卓源码(编译安卓源码 电脑配置)

前面已经下载好源码了,接下来是下载手机对应的二进制驱动执行编译源码命令下载厂商驱动https://developers.google.com/android/drivers?hl=zh-cn搜索NGI...

360 Vulcan Team首战告捷 以17.5万美金强势领跑2019“天府杯“

2019年11月16日,由360集团、百度、腾讯、阿里巴巴、清华大学与中科院等多家企业和研究机构在成都联合主办了2019“天府杯”国际网络安全大赛暨2019天府国际网络安全高峰论坛。而开幕当日最激荡人...

Syslog 日志分析与异常检测技巧(syslog发送日志配置)

系统日志包含有助于分析网络设备整体运行状况的重要信息。然而,理解并从中提取有效数据往往颇具挑战。本文将详解从基础命令行工具到专业日志管理软件的全流程分析技巧,助你高效挖掘Syslog日志价值。Gr...

从Oracle演进看数据库技术的发展(从oracle演进看数据库技术的发展的过程)

数据库技术发展本质上是应用需求驱动与基础架构演进的双向奔赴,如何分析其技术发展的脉络和方向?考虑到oracle数据库仍然是这个领域的王者,以其为例,管中窥豹,对其从Oracle8i到23ai版本的核...

取消回复欢迎 发表评论: