CN111414404A - 一种数据可视化装置和方法 - Google Patents
一种数据可视化装置和方法 Download PDFInfo
- Publication number
- CN111414404A CN111414404A CN202010199905.1A CN202010199905A CN111414404A CN 111414404 A CN111414404 A CN 111414404A CN 202010199905 A CN202010199905 A CN 202010199905A CN 111414404 A CN111414404 A CN 111414404A
- Authority
- CN
- China
- Prior art keywords
- chart
- data
- htm
- iframe
- displayed
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000013079 data visualisation Methods 0.000 title claims abstract description 31
- 238000000034 method Methods 0.000 title claims abstract description 16
- 238000011161 development Methods 0.000 claims abstract description 23
- 238000013523 data management Methods 0.000 claims abstract description 9
- 230000000007 visual effect Effects 0.000 claims description 10
- 230000006870 function Effects 0.000 claims description 4
- 238000012800 visualization Methods 0.000 abstract description 7
- 238000010586 diagram Methods 0.000 description 5
- 230000008520 organization Effects 0.000 description 3
- 230000008569 process Effects 0.000 description 3
- 238000012545 processing Methods 0.000 description 2
- 238000004458 analytical method Methods 0.000 description 1
- 230000007812 deficiency Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/24—Querying
- G06F16/248—Presentation of query results
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Computational Linguistics (AREA)
- Data Mining & Analysis (AREA)
- Databases & Information Systems (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明涉及一种数据可视化装置和方法，包括：数据管理模块，用户通过数据管理模块，选择需要显示的数据；图表类库，包括图表开发器，其根据需要显示的数据选择图表类型；图表开发模块，对选定的图表类型进行可视化图表开发，将每张可视化图表对应生成子HTML页面，并通过Iframe标记，将HTML页面嵌入到另一个需进行数据显示的HTML页面中。由于使用了本发明中数据可视化系统和方法进行图表开发，开发人员可以直接通过配置的方式开发可视化图表，无需进行复杂的编码开发工作，提升了开发效率，降低了数据可视化的开发门槛。
Description
技术领域
本发明是关于一种数据可视化装置和方法，属于数据处理技术领域。
背景技术
数据可视化是指将大型数据集中的数据以图形图像形式显示。数据可视化已经成为数据科学领域非常重要的一部分。不同网络系统中产生的数据，都需要经过适当的可视化处理，以便用户读取和分析。
对任何一个企业或组织来说，如果能够充分的获取数据、可视化数据和分析数据，那么就能很大程度上帮助企业或组织了解数据产生的深层次原因，以便据此做出正确的决定。通常，这些可视化的图表数据，会通过网站HTML页面显示给用户。
在对可视化图表进行开发时，通过图表库，开发者可以实现将数据转化为易于理解的图表显示给网站HTML页面浏览者，JavaScript中图表库也会使前端HTML页面的数据可视化变得更加容易。
在现有的技术方案中，通常采用Echart、Chart.js等插件对图表进行可视化显示。但这两种插件对于普通使用者来说，只提供了方法类库，需要专业的程序开发人员进行编码开发，使用门槛高且开发周期时间长。
发明内容
针对上述现有技术的不足，本发明的目的是提供了一种数据可视化装置和方法，其改变了可视化开发过程中需要编码的情况，降低用户使用的门槛，从而能快速、便捷的进行数据可视化开发。
为实现上述目的，本发明提供了一种数据可视化装置，包括：数据管理模块，用户通过数据管理模块，选择需要显示的数据；图表类库，包括图表开发器，图表开发器根据需要显示的数据选择图表类型；图表开发模块，对选定的图表类型进行可视化图表开发，将每张可视化图表对应生成子HTML页面，并通过Iframe标记，将HTML页面嵌入到另一个需进行数据显示的HTML页面中。
进一步，数据管理模块包括数据管理器和多种数据库，数据管理器用于根据用户需要从数据库调取需要显示的数据；数据库用于对需要显示的数据进行存储、分类和管理。
进一步，数据库具体类型包括：Oracle、MySQL和SQL Server。
进一步，图表类库通过用户选择确定图表类型；或图表类库根据数据类型自动选择图表类型。
进一步，图表类型包括柱状图、函数图、条形图、饼图、散点图、气泡图、箱图、折线图、雷达图、漏斗图、和弦图和概率分布图。
进一步，图表开发模块包括：图表开发器、图表存储器和Iframe访问接口，图表开发器根据需要显示的数据和选定的图像类型生成与数据对应的图表；图表存储器存储图表开发器生成的图表，并将图表进行Iframe标记；图表通过Iframe访问接口直接将嵌入需进行数据显示的HTML页面中。
进一步，还包括用户终端模块，用于接收用户指令，并将需进行数据显示的HTML页面嵌入到Web浏览器显示。
本发明还公开了一种数据可视化方法，包括以下步骤：S1：登陆上述任一项的数据可视化装置；S2：使用数据管理器，选择可视化图表需要显示的数据，使用图表类库，选择需要显示的图表的类型，使用图表开发器进行可视化图表开发；S3：图表开发器将开发好的图表存储到图表存储器中，并将图表进行Iframe标记；S4：用户通过Iframe访问接口，发送显示图表请求，Iframe访问接口查询图表存储器中的相应图表，返回给Iframe访问接口；S5：Iframe访问接口得到图表后，通过用户终端模块进行显示。
本发明由于采取以上技术方案，其具有以下优点：由于使用了本发明中数据可视化系统和方法进行图表开发，开发人员可以直接通过配置的方式开发可视化图表，无需进行复杂的编码开发工作，提升了开发效率，降低了数据可视化的开发门槛。
附图说明
图1是本发明一实施例中数据可视化装置的结构示意图；
图2是本发明一实施例中数据可视化方法的逻辑示意图。
具体实施方式
为了使本领域技术人员更好的理解本发明的技术方向，通过具体实施例对本发明进行详细的描绘。然而应当理解，具体实施方式的提供仅为了更好地理解本发明，它们不应该理解成对本发明的限制。在本发明的描述中，需要理解的是，所用到的术语仅仅是用于描述的目的，而不能理解为指示或暗示相对重要性。
实施例一
本实施例提供了一种数据可视化装置，如图1所示，包括：数据管理模块，用户通过数据管理器，选择需要显示的数据；图表类库，图表开发器根据需要显示的数据选择图表类型；图表开发模块，对选定的图表类型进行可视化图表开发，将每张可视化图表对应生成子HTML页面，并通过Iframe标记，将HTML页面嵌入到另一个需进行数据显示的HTML页面中。本实施例中装置改变了可视化开发过程中需要编码的情况，降低用户使用的门槛，从而能快速、便捷的进行数据可视化开发
其中，数据管理模块包括数据管理器和多种数据库，数据管理器用于根据用户需要从数据库调取需要显示的数据；数据库用于对需要显示的数据进行存储、分类和管理。数据库具体类型包括：Oracle、MySQL和SQL Server。
图表类库通过用户选择确定图表类型，例如图表类库中所有图表类型设置于表格中，用户根据自己的喜好选择图表类型。此外图表类库也可以根据数据类型、性质自动选择图表类型。例如对于数据类别少，但是数据点很多的数据就可以采用函数图、折线图等图表类型。对于数据类别多，但数据点少的可以采用柱状图、条形图和饼图等。也可以将两种图表选择方式相结合，先根据数据类型、性质确定几种比较适合的图表类型，将这几种图表类型推送至用户界面，再由用户在这几种比较适合额图表类型中选出一个图表类型作为最终的图表类型。图表类型包括柱状图、函数图、条形图、饼图、散点图、气泡图、箱图、折线图、雷达图、漏斗图、和弦图和概率分布图等。此处列举的图表类型只是比较常用的图表类型，用户也可以根据需要自行设计图表类型，并将其保存至图表类库。
图表开发模块包括：图表开发器、图表存储器和Iframe访问接口，图表开发器根据需要显示的数据和选定的图像类型生成与数据对应的图表；图表存储器存储图表开发器生成的图表，并将图表进行Iframe标记；图表通过Iframe访问接口直接将嵌入需进行数据显示的HTML页面中。
Iframe标记为HTML文件中的一个标签，通过该标签，Iframe会创建包含另外一个HTML的文档，具体过程为：在用户使用图表开发器开发好图表之后，系统将开发好的图表存储为一个HTML文件，在图表存储器中进行存储，该HTML文件又会通过Iframe的方式，对外形成一个接口，将该图表暴露给用户，用户只需要通过Web浏览器进行访问即可。
本实施例中数据可视化装置还包括用户终端模块，主要用于进行人机交互和数据显示。用户终端模块用于接收用户指令。用户指令包括数据显示指令、图表显示指令等，用户终端模块将图表开发模块获得的需要进行数据显示的HTML页面嵌入到Web浏览器显示，HTML页面的位置由用户使用URI(统一资源标示符)指定。浏览器解释并显示HTML文件的方式是在HTML和CSS规范中指定的。这些规范由网络标准化组织W3C(万维网联盟)进行维护。
实施例二
本实施例公开了一种数据可视化方法，如图2所示，包括以下步骤：
S1：登陆实施例一中任一种数据可视化装置；
S2：使用数据管理器，选择可视化图表需要显示的数据，使用图表类库，选择需要显示的图表的类型，使用图表开发器进行可视化图表开发，其中图表类库中的图表采用开源图表系统中Echart、Chart.js组件，部分采用JavaScript语言自行开发。图表类库中的定义了图表的结构，而图表中的数据均可由用户自行配置；
S3：图表开发器将开发好的图表保存成一个HTML文件，存储到图表存储器中，并基于HTML语言的规定，将HTML文件通过Iframe标记内嵌到其他HTML文件中，在该图表HTML文件保存到图表存储中后，同时返回给系统该图表HTML文件所在的存储位置，返回格式为一个超链接；
S4：用户通过Iframe访问接口，即点击超链接，发送显示图表请求，Iframe访问接口查询图表存储器中的相应图表，返回给Iframe访问接口；S5：Iframe访问接口得到图表后，通过用户终端模块进行显示。
通过iframe访问接口，用户终端只要点击超链接，即可访问图表开发器开发好的图表，整个过程中，达到了图表类型的复用，用户只需要在页面上进行配置，即可生成各种不同类型的可视化图表，极大的减轻了开发的工作量。
上述内容仅为本申请的具体实施方式，但本申请的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本申请揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本申请的保护范围之内。因此，本申请的保护范围应以权利要求的保护范围为准。
Claims (8)
1.一种数据可视化装置，其特征在于，包括：
数据管理模块，用户通过所述数据管理模块，选择需要显示的数据；
图表类库，包括图表开发器，所述图表开发器根据所述需要显示的数据选择图表类型；
图表开发模块，对选定的所述图表类型进行可视化图表开发，将每张所述可视化图表对应生成子HTML页面，并通过Iframe标记，将所述HTML页面嵌入到另一个需进行数据显示的HTML页面中进行显示。
2.如权利要求1所述的数据可视化装置，其特征在于，所述数据管理模块包括数据管理器和多种数据库，所述数据管理器用于根据用户需要从所述数据库调取需要显示的数据；所述数据库用于对所述需要显示的数据进行存储、分类和管理。
3.如权利要求2所述的数据可视化装置，其特征在于，所述数据库具体类型包括：Oracle、MySQL和SQL Server。
4.如权利要求1-3任一项所述的数据可视化装置，其特征在于，所述图表类库通过用户选择确定图表类型；或所述图表类库根据数据类型自动选择图表类型。
5.如权利要求4所述的数据可视化装置，其特征在于，所述图表类型包括柱状图、函数图、条形图、饼图、散点图、气泡图、箱图、折线图、雷达图、漏斗图、和弦图和概率分布图。
6.如权利要求1-3任一项所述的数据可视化装置，其特征在于，所述图表开发模块包括：图表开发器、图表存储器和Iframe访问接口，所述图表开发器根据需要显示的数据和选定的所述图表类型生成与所述数据对应的图表；所述图表存储器存储所述图表开发器生成的图表，并将所述图表进行Iframe标记，生成子HTML页面；通过所述Iframe访问接口直接将所述子HTML页面嵌入需进行数据显示的HTML页面中。
7.如权利要求1-3任一项所述的数据可视化装置，其特征在于，还包括用户终端模块，用于接收用户指令，并将需进行数据显示的HTML页面嵌入到Web浏览器显示。
8.一种数据可视化方法，其特征在于，包括：
S1：登陆如权利要求1-7任一项所述的数据可视化装置；
S2：使用数据管理器，选择可视化图表需要显示的数据，使用图表类库，选择需要显示的图表的类型，使用图表开发器进行可视化图表开发；
S3：图表开发器将开发好的图表存储到图表存储器中，并将所述图表进行Iframe标记；
S4：用户通过Iframe访问接口，发送显示图表请求，所述Iframe访问接口查询图表存储器中的相应图表，返回给Iframe访问接口；
S5：Iframe访问接口得到所述图表后，通过用户终端模块进行显示。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010199905.1A CN111414404A (zh) | 2020-03-20 | 2020-03-20 | 一种数据可视化装置和方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010199905.1A CN111414404A (zh) | 2020-03-20 | 2020-03-20 | 一种数据可视化装置和方法 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111414404A true CN111414404A (zh) | 2020-07-14 |
Family
ID=71494540
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010199905.1A Pending CN111414404A (zh) | 2020-03-20 | 2020-03-20 | 一种数据可视化装置和方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111414404A (zh) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112256789A (zh) * | 2020-10-19 | 2021-01-22 | 杭州比智科技有限公司 | 数据智能可视化分析方法和装置 |
| CN112650486A (zh) * | 2021-01-14 | 2021-04-13 | 智慧神州(北京)科技有限公司 | 数据可视化处理方法及装置 |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102257489A (zh) * | 2008-12-18 | 2011-11-23 | 微软公司 | 网格和相关联的可视化的双向更新 |
| US20160321224A1 (en) * | 2015-04-30 | 2016-11-03 | Icharts, Inc. | Publishing interactive visualized analytics |
| CN107918516A (zh) * | 2017-10-17 | 2018-04-17 | 广东广业开元科技有限公司 | 一种可视化动态配置生成图表的系统及方法 |
| CN108446381A (zh) * | 2018-03-19 | 2018-08-24 | 武汉华大国家数字化学习工程技术有限公司 | 一种基于Web的数据可视化系统与方法 |
-
2020
- 2020-03-20 CN CN202010199905.1A patent/CN111414404A/zh active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102257489A (zh) * | 2008-12-18 | 2011-11-23 | 微软公司 | 网格和相关联的可视化的双向更新 |
| US20160321224A1 (en) * | 2015-04-30 | 2016-11-03 | Icharts, Inc. | Publishing interactive visualized analytics |
| CN107918516A (zh) * | 2017-10-17 | 2018-04-17 | 广东广业开元科技有限公司 | 一种可视化动态配置生成图表的系统及方法 |
| CN108446381A (zh) * | 2018-03-19 | 2018-08-24 | 武汉华大国家数字化学习工程技术有限公司 | 一种基于Web的数据可视化系统与方法 |
Non-Patent Citations (1)
| Title |
|---|
| 赵岚: ""基于HTML5的跨平台图表框架的设计与实现"" * |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112256789A (zh) * | 2020-10-19 | 2021-01-22 | 杭州比智科技有限公司 | 数据智能可视化分析方法和装置 |
| CN112256789B (zh) * | 2020-10-19 | 2022-06-17 | 杭州比智科技有限公司 | 数据智能可视化分析方法和装置 |
| CN112650486A (zh) * | 2021-01-14 | 2021-04-13 | 智慧神州(北京)科技有限公司 | 数据可视化处理方法及装置 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| JP3998706B2 (ja) | ドキュメントデータの管理方法、管理システム及びコンピュータソフトウェア | |
| JP4682284B2 (ja) | 文書差分検出装置 | |
| CN109739725A (zh) | 基于浏览器的监控方法、装置、系统及存储介质 | |
| CN107562600B (zh) | 页面检测方法、装置、计算设备以及存储介质 | |
| CN107220274B (zh) | 一种可视化数据接口集市实现方法 | |
| CN110263222B (zh) | 一种数据获取方法、装置、设备及介质 | |
| JP2013084259A (ja) | ウェブ・ブラウザー画面の段階的な視覚的比較 | |
| CN110347984B (zh) | 保单页面变更方法、装置、计算机设备及存储介质 | |
| CN112836018A (zh) | 应急预案的处理方法及装置 | |
| CN111414404A (zh) | 一种数据可视化装置和方法 | |
| CN109491884A (zh) | 代码性能检测方法、装置、计算机设备和介质 | |
| CN114661745A (zh) | 基于rpa和ai的招聘信息发布方法及装置 | |
| CN114647409A (zh) | 大屏可视化应用创建平台、方法、计算设备和存储介质 | |
| CN113032496A (zh) | 一种基于产业知识图谱的产业大脑数据分析系统 | |
| CN111722881B (zh) | 一种容器云平台的资源扩展方法、系统及装置 | |
| CN116992851A (zh) | 一种基于遥感数据的水体变化调查文档批量生成方法 | |
| CN115186240A (zh) | 基于关联性信息的社交网络用户对齐方法、装置、介质 | |
| CN115145674A (zh) | 基于动态锚点的页面跳转方法、装置、设备及介质 | |
| JP2012141974A (ja) | リンクされたテキストボックスを有する電子文書のレンダリング | |
| US7222296B2 (en) | Configurable display of web site content | |
| CN107045465A (zh) | 一种服务器诊断结果图文化显示的方法及装置 | |
| CN115544969B (zh) | 基于超文本标记语言的页面对比方法、设备及介质 | |
| CN115392887B (zh) | 自然资源一体化平台构建方法、装置 | |
| JP7197531B2 (ja) | 情報処理装置、情報処理システム、情報処理方法、およびプログラム | |
| US20210286621A1 (en) | Systems and Methods for Configurable Ordered Transformation of Database Content |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200714 |