bi可视化工具

通过智能数据分析使复杂变得简单 (Making the complex simple with smart data analysis)

It is hard to overestimate the value of insightful analytics nowadays. All business processes have become data-driven: marketing, accounting, human resources, customer service, finance.

如今，很难高估具有洞察力的分析的价值。 所有业务流程都已成为数据驱动的：营销，会计，人力资源，客户服务，财务。

And to convince the decision makers, you need to properly convey the meaning of the data. One possible technique is composing an analytical web report. Another essential part of it is high-powered data visualization which helps you understand the business trends of your company.

为了说服决策者，您需要正确传达数据的含义。 一种可能的技术是编写分析网络报告。 它的另一个重要部分是强大的数据可视化，可帮助您了解公司的业务趋势。

I’ve done some research, and I’ll now give you a comprehensive overview of four popular tools for web reporting and data analysis. The first two of them are free, the following two are more advanced. These tools will be useful for both the developers and data analysts.

我已经进行了一些研究，现在将为您提供四种流行的Web报告和数据分析工具的全面概述。 其中的前两个是免费的，接下来的两个是更高级的。 这些工具对开发人员都将有用 和数据分析员 。

免费工具 (Free tools)

The following options provide opportunities for basic web reporting.

以下选项为基本的Web报告提供了机会。

数据透视表 (PivotTable.js)

PivotTable.js is an open-source JavaScript Pivot Table. It aims to provide the functionality for data analysis, and requires a good knowledge of JavaScript to reach its full potential.

PivotTable.js是一个开放源代码JavaScript Pivot Table。 它旨在提供用于数据分析的功能，并且需要具备JavaScript的丰富知识才能发挥其全部潜能。

1. Built-in web reporting features:
   内置的网络报告功能：

• Support of .csv and JSON data sources

  支持.csv和JSON数据源

• Aggregation, filtering, sorting, and grouping are available. There are 22 functions which include functions for statistical research.

  聚合 ， 过滤 ， 排序 ， 和分组可用。 有22个功能 ，其中包括统计研究功能。

• You can move the fields from columns to rows, and vice versa, with the help of drag & drop functionality.

  您可以在拖放功能的帮助下将字段从列移动到行，反之亦然。

• Custom cell formatting

  自定义单元格格式

• TSV renderer for exporting to TSV format

  用于导出为TSV格式的TSV渲染器

• Ability to define multiple aggregators

  能够定义多个聚合器

• A heat map rendering option

  热图渲染选项

2. View customization features:

2.查看自定义功能：

• Mobile-enabled renderers for touch devices are available.
  提供了用于触摸设备的支持移动设备的渲染器。

• Cells of the grid can be colored.

  网格的单元可以着色。

• There is an Excel-like layout available: each hierarchy is displayed in a separate column or row.
  有一个类似于Excel的布局：每个层次结构显示在单独的列或行中。

• Custom formatting is possible as well as making a custom heat map color-scale.

  自定义格式以及制作自定义热图色标都是可能的。

• Language localization: the pivot table is available in English and French, and it’s possible to write your own “language pack” in JavaScript.

  语言本地化 ：数据透视表提供英语和法语两种语言 ， 并且可以用JavaScript编写自己的“语言包”。

3. Integration and compatibility:

3.集成和兼容性：

• There is a React version with integrated Plotly charts.

  有一个带有集成的Plotly图表的React版本 。

• It is compatible with Python/Jupyter and R/RStudio.
  它与Python / Jupyter和R / RStudio兼容。

4. Limits:

4.限制：

• Handles up to 100K rows
  处理多达10万行
• Unfortunately, subtotals can be rendered only via an additional plugin.
  不幸的是，小计只能通过其他插件来呈现。
• Built-in renderers for export to CSV and Excel are not available.
  无法使用用于导出到CSV和Excel的内置渲染器。

• To save the configuration of the report, you need to implement this functionality yourself. PivotTable.js provides a freedom in customization, though.

  要保存报告的配置，您需要自己实现此功能。 但是，PivotTable.js提供了自定义的自由。

5. Creating charts:

5.创建图表：

You can use the renderers for integration with C3 Charts, D3.js, Plotly, and Google Charts. It is possible to use Highcharts along with the pivot table with the help of a third-party plugin.

您可以将渲染器与C3图表 ， D3.js ， Plotly ， 和Google图表 。 借助第三方插件，可以将Highcharts与数据透视表一起使用。

Learn more:

学到更多：

• Download from GitHub

  从GitHub下载

Demos on JSFiddle:

JSFiddle上的演示：

• Main demo

  主要示范

• Analysis of R datasets

  R数据集分析

WebDataRocks (WebDataRocks)

WebDataRocks is an embeddable web pivot table written in JavaScript. It is a lightweight component. You can use it in a web application and build an interactive report based on your data. It can be viewed on mobile devices and desktop clients. It is suitable for less technical end-users, but offers advanced customization options for developers.

WebDataRocks 是用JavaScript编写的可嵌入网络数据透视表 。 它是轻量级的组件。 您可以在Web应用程序中使用它，并根据您的数据构建交互式报告。 可以在移动设备和桌面客户端上查看它。 它适合技术含量较低的最终用户，但为开发人员提供了高级自定义选项。

1. Built-in web reporting features:

1.内置的网络报告功能：

• Support of local and remote JSON and .csv data sources

  支持本地和远程 JSON和.csv数据源

• The main functionality is accessible via the special extra-part of the pivot table — the Toolbar.

  可通过数据透视表的特殊额外部分( 工具栏 )访问主要功能。

• Aggregation, multiple filtering, sorting, and grouping are easy with the UI. There are 13 aggregation functions and the ability to create a custom calculated value.

  使用UI可以轻松进行聚合，多种过滤，排序和分组 。 共有13种汇总功能，可以创建自定义计算值。

• Configuring fields via the Field List and moving them from columns to rows and vice versa with the help of drag and drop functionality

  通过字段列表配置字段，并通过拖放功能将它们从列移动到行，反之亦然

• Creation of multi-level hierarchies

  创建多层次结构

• Each cell of the grid can be drilled through.
  网格的每个单元均可钻取。

• Sharing your results with colleagues: you can save the report and export it to PDF, Excel, and HTML formats, or print it.

  与同事共享结果：您可以保存报告并将其导出为PDF，Excel和HTML格式，或进行打印 。

2. View customization features:

2.查看自定义功能：

• The look and feel of the reporting tool can be changed. There are four predefined themes that may be to your taste, and the possibility to create your own theme.

  报告工具的外观可以更改。 有四个预定义的主题可能会合您的喜好，并且可以创建您自己的主题。

• You can use a conditional formatting feature to highlight the most important cells of the pivot table based on particular values.

  您可以使用条件格式设置功能根据特定值突出显示数据透视表中最重要的单元格。

• Number formatting
  数字格式

• If you need to change the layout, you can choose a classic, compact, or flat form of the pivot table. For me, the compact form has the most laconic and neat style.

  如果需要更改布局 ，则可以选择经典，紧凑或平面形式的数据透视表。 对我来说，紧凑的形式具有最简洁，整洁的风格。

• Language localization — you can choose among available languages, or translate your pivot table into the needed language using a simple template JSON file.

  语言本地化 — 您可以选择可用的语言，也可以使用简单的模板JSON文件将数据透视表转换为所需的语言。

3. Integration and compatibility:

3.集成和兼容性：

• WebDataRocks can be embedded into AngularJS, Angular and React applications.
  WebDataRocks可以嵌入到AngularJS，Angular和React应用程序中。

4. Limits:

4.限制：

• Maximum data size is 1Mb.
  最大数据大小为1Mb。

5. Creating charts:

5.创建图表：

It is easy to integrate WebDataRocks with Google Charts, Highcharts or any other charting library. There are tutorials available in the documentation.

将WebDataRocks与Google Charts，Highcharts或任何其他图表库集成起来很容易。 文档中有可用的教程。

Learn more:

学到更多：

• Quick start

  快速开始

• 3 installation options

  3个安装选项

CodePen demos:

CodePen演示：

• Multi-level hierarchy with types

  具有类型的多级层次结构

• A dashboard with HighCharts

  具有HighCharts的仪表板

先进的解决方案 (Advanced solutions)

Let’s move on to tools that are more high-powered embedded BI tools and provide a more advanced web reporting experience.

让我们继续使用功能更强大的嵌入式BI工具并提供更高级的Web报告体验的工具。

A free 30-day trial is available for testing both tools.

可免费试用30天，以测试这两种工具。

威龙 (Flexmonster)

Flexmonster Pivot Table & Charts is a JavaScript pivot table component. It is well-suited for deep analysis of tabular and multidimensional data, and building visual reports based on these. The main differences from the free options are OLAP cube support and more integration options.

Flexmonster数据透视表和图表 是JavaScript数据透视表组件。 它非常适合对表格和多维数据进行深度分析，并基于这些数据构建可视化报告。 与免费选项的主要区别是对OLAP多维数据集的支持和更多的集成选项。

1. Built-in web reporting features:

1.内置的网络报告功能：

• Supported data formats are CSV, JSON, data from SQL and NoSQL databases, and OLAP cubes — such as Microsoft Analysis Services and Pentaho Mondrian cubes).

  支持的数据格式为CSV，JSON ， SQL和NoSQL数据库中的数据以及OLAP多维数据集 - 例如Microsoft Analysis Services和Pentaho Mondrian多维数据集)。

• You can use multiple aggregations to summarize numerical data. There are 16 aggregation functions available and the ability to create a calculated value.

  您可以使用多个汇总来汇总数字数据。 有16种聚合函数可用，并具有创建计算值的功能。

• Sorting and grouping of the data

  数据排序和分组

• Filtering can be performed by values — to display Top/Bottom N records — member names and/or applied to the whole report.

  可以按值执行过滤 -以显示前N个/后N个记录- 成员名称和/或应用于整个报表。

• You can add interactivity to your pivot table by using event handlers.

  您可以使用事件处理程序将交互性添加到数据透视表中。

• The final report can be saved in a JSON file with all the configurations and formatting applied. You can load it later for further work.

  最终报告可以保存在 应用了所有配置和格式的JSON文件 。 您可以稍后加载它以进行进一步的工作。

• Export the report to HMTL, Image, CSV, Excel or PDF formats without the need to connect any third-party plugins.

  出口 可以将报告转换为HMTL，Image，CSV，Excel或PDF格式，而无需连接任何第三方插件。

2. View customization features

2.查看自定义功能

• It is possible to choose one of the five theme styles or create a custom one.

  可以选择五种 主题样式之一或创建自定义样式 。

• Grid customization functionality allows the creation of heat map visualizations.

  网格自定义功能允许创建热图可视化。

• Conditional formatting of cells

  单元格的条件格式

• Number formatting

  数字格式

• Date values can be displayed in user-defined formatting.

  日期值可以以用户定义的格式显示。

• Component localization includes seven languages. You can translate the pivot table by yourself with the help of a template JSON file.

  组件本地化包括七种语言。 您可以借助模板JSON文件自己转换数据透视表。

• A mobile-friendly design
  便于移动的设计

3. Integration and compatibility

3.集成和兼容性

• Flexmonster can be included in the simple web page or integrated into AngularJS, Angular, or React applications. There are also tutorials on the official website on integrating with jQuery and Webpack.

  Flexmonster可以包含在简单的网页中，也可以集成到AngularJS，Angular或React应用程序中。 官方网站上还有关于与jQuery和Webpack集成的教程。

• MongoDB data analysis is of special interest for those who have huge amounts of data stored in documents. Connection to MongoDB is supported via Node.js.

  MongoDB数据分析特别适合那些在文档中存储大量数据的人。 通过Node.js支持与MongoDB的连接。

4. Limits:

4.限制：

Handles up to 1 million rows so there is no problem with big datasets.

处理多达一百万行，因此大型数据集没有问题。

5. Creating charts:

5.创建图表：

Flexmonster has pivot charts as a part of the component. To get access to other charts, you can use guides on integration with Google Charts, Highcharts, FusionCharts, or any other third party charting libraries. All these approaches help to create interactive dashboards.

Flexmonster将数据透视图作为组件的一部分。 要访问其他图表，您可以使用与Google Charts，Highcharts，FusionCharts或任何其他第三方图表库集成的指南。 所有这些方法都有助于创建交互式仪表板。

Learn more:

学到更多：

• Quick start

  快速开始

• Download options

  下载选项

Demos:

演示：

• Main demo

  主要示范

• Heat Map

  热图

DhtmlxPivot (DhtmlxPivot)

DhtmlxPivot is a JavaScript Pivot Grid for analytical reports creation. It is a part of the dhtmlxSuite, but can be purchased separately from the bundle. It offers a modern UI and integration with different server-side technologies.

DhtmlxPivot 是用于创建分析报告JavaScript Pivot网格。 它是dhtmlxSuite的一部分，但可以从捆绑包中单独购买。 它提供了现代化的UI并与不同的服务器端技术集成。

1. Built-in web reporting features:

1.内置的网络报告功能：

• Supports connection to JSON, .csv, and XML data sources. Data can be loaded from JavaScript array and HTML table.

  支持与JSON ， .csv和XML数据源的连接。 可以从JavaScript数组和HTML表加载数据。

• There are only four inbuilt aggregation functions — max, min, sum and count. Custom ones can be created.
  只有四个内置的聚合函数-最大，最小，总和和计数。 可以创建自定义的。

• Grouping, searching, and sorting of the data

  分组 ， 搜索 ， 和数据排序

• Filtering using UI or pre-defined string, number, and dates filters. Also, you can define global filters and set the number of rows to display per page on the grid.

  使用UI或预先定义字符串，数字和日期过滤器过滤 。 另外，您可以定义全局过滤器并设置要在网格上每页显示的行数。

• Drag and drop functionality

  拖放功能

• Cells can be edited and filled with the custom content
  可以编辑单元格并填充自定义内容
• Built-in module for exporting the report to an Excel file with all the configurations saved
  内置模块，用于将报告导出到Excel文件并保存所有配置

2. View customization features:

2.查看自定义功能：

• The layout can be adjusted. For example, you can change the width of columns, left margin, turn on a “read-only” mode for the pivot table.
  布局可以调整。 例如，您可以更改列的宽度，左边距，打开数据透视表的“只读”模式。

• Conditional formatting and custom CSS of the cells

  单元格的条件格式和自定义CSS

• Mobile-friendly design as well
  以及适合移动设备的设计
• Localization of the interface is possible via the special method.
  可以通过特殊方法对接口进行本地化。

3. Integration and compatibility:

3.集成和兼容性：

• Supports integration with multiple technologies, such as PHP, Java, .NET, Node.js, Ruby on Rails, ASP.NET, ColdFusion, and Typescript and other technologies.
  支持与多种技术的集成，例如PHP，Java，.NET，Node.js，Ruby on Rails，ASP.NET，ColdFusion和Typescript等技术。

4. Limits:

4.限制：

There is no information about a data size on the official website. Testing showed that the pivot table renders up to 10K rows.

官方网站上没有有关数据大小的信息。 测试表明，数据透视表最多可渲染1万行。

5. Creating charts:

5.创建图表：

To use charts in your web reports, the best option is to use dhtmlxChart. If you purchased the dhtmlxSuite, they are already included in the bundle. However, you can purchase it separately.

要在您的Web报表中使用图表，最好的选择是使用dhtmlxChart。 如果您购买了dhtmlxSuite ，则它们已包含在捆绑包中。 但是，您可以单独购买。

Learn more:

学到更多：

• Samples

  样品

• Download packages

  下载包

摘要 (Summary)

To my mind, a perfect tool contains a bundle of built-in features such as:

在我看来，一个完美的工具包含许多内置功能，例如：

• Loading of CSV, JSON and multidimensional data
  加载CSV，JSON和多维数据
• Support of aggregation pipeline via UI
  通过UI支持聚合管道
• The ability to display the data in charts and integrate with any server-side and front-end technology
  能够以图表形式显示数据并与任何服务器端和前端技术集成
• Exporting should be easy as well, without the need to include any third party modules.
  导出也应该很容易，无需包含任何第三方模块。

Furthermore, the tools should always evolve to meet the new demands of end-users. It is up to you which one to choose for your project, and I hope it will help improve the way you work with the data.

此外，工具应始终发展以满足最终用户的新需求。 由您决定要为项目选择哪一个，我希望它将有助于改善处理数据的方式。

翻译自: https://www.freecodecamp.org/news/4-data-visualization-and-web-reporting-tools-for-your-bi-solution-35503cc8b7e3/

bi可视化工具