7 个小改动，将对您的交互式图表产生重大影响

数据可视化是任何分析师或专业人士的基本技能之一。不同的公司提供不同的图表选项，无论是静态的还是交互式的。

然而，用户往往更喜欢交互式图表，因为它们可以描述更多信息。

在本文中，我们将深入探讨交互式图表。此外，我们将讨论一些将对交互式图表的功能产生重大影响的小特性。

什么是交互式图表？
如何安装 FusionCharts 以使用交互式图表？
如何实现交互式图表？
哪些七项更改将对您的交互式图表产生重大影响？
格式化数字
启用缩放/滚动/平移
将品牌添加到您的图表
导出图表
工具提示
向下钻取图表
管理空间
准备好享受交互式图形体验了吗？

什么是交互式图表？

与静态图表不同，交互式图表响应不同的用户操作。例如，用户可以平移、调整大小和放大交互式图形。它还提供替代数据视图，放大选定区域，并根据最终应用程序一目了然地显示完整的数据集。

尽管有许多用于绘制数据图表的工具，但大多数只生成静态图表。简而言之，交互式图表积极参与并提供交互式用户体验。FusionCharts通过支持所有类型的用户与图表的交互，进一步提升了这种交互性。

如何安装 FusionCharts 以使用交互式图表？

可以使用三种方法安装 FusionCharts。

最简单的方法是使用 CDN。您必须包含来自 CDN 的 FusionCharts JS 脚本和主题文件。

代码如下，

<头>

< !– 第1步– 包含 fusioncharts 核心库 →

< script type=”text/javascript” src=”https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js ”></script>光盘。融合图。com / fusioncharts /最新/ fusioncharts 。js ” ></脚本>

< !– 第2步– 包含融合主题 →

< script type=”text/javascript” src=”https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js ”></script>光盘。融合图。com / fusioncharts /最新/主题/ fusioncharts 。主题。融合。js ” ></脚本>

< /头>

第二种方法是下载 Fushion 图表文件并在代码中使用本地文件路径。

代码如下，

<头>

< !– Step 1 – 包含 fusioncharts 核心库 – >

< script type=”text/javascript” src=”path/to/local/fusioncharts. js ” >< /脚本>

< !– Step 2 – 包含融合主题 – >

< script type=”text/javascript” src=”path/to/local/themes/fusioncharts. 主题。融合。js ” >< /脚本>

< /头>

第三种方法是使用 NPM 安装 FushionCharts。如果您已经在机器上安装了 Node.js，则可以运行以下命令。

npm 安装 fusioncharts

如何实现交互式图表？

首先，下载FusionCharts并复制JS文件夹下的JavaScript文件

BITNAMI_INSTALL_DIR\apache2\htdocs

. 然后下载 jQuery 2.x。接下来，创建一个 Html 页面来呈现图表，如下所示：

< !DOCTYPE html >

< html >

<头>

< title > FusionCharts < /title >

< /头>

<身体>

< div id=”chart-container” > FusionCharts < /div >

< script src=”js/jquery- 2.1 . 4 . js ” >< /脚本>

< script src=”js/fusioncharts. js ” >< /脚本>

< script src=”js/fusioncharts. 图表。js ” >< /脚本>

< script src=”js/themes/fusioncharts. 主题。祖尼_ js ” >< /脚本>

<脚本 src=”js/app. js ” >< /脚本>

< /正文>

< /html >

现在您可以使用 jQuery 从服务器获取数据。检索数据后，将其与 FusionCharts 集成。

哪些七项更改将对您的交互式图表产生重大影响？

我可以在图表中格式化数字吗？

FusionCharts 允许用户以多种方式格式化数字。

数字前缀– 用户可以为所有值添加前缀字符以强调图表上显示的值。“numberprefix”属性可用于定义属性。
数字后缀– 用户可以为所有数据添加后缀字符，以帮助访问者了解您的图表。“numbersuffix”属性可用于定义属性。
双 Y 轴– 您可以使用属性：前缀和后缀在具有两个 Y 轴的多系列图表中为两个 Y 轴添加前缀或后缀。主 Y 轴可以定义为 numberPrefix 和 numberSuffix，而辅助 Y 轴可以定义为 sNumberPrefix 和 sNumberSuffix。
数字格式– 数值在 FusionCharts 中自动格式化。在某些情况下，FusionCharts 会自动用逗号分隔值，还允许配置小数位。
十进制和千位分隔符– 不同的国家使用不同的十进制和千位分隔符。因此，FusionCharts 可以根据国家/地区自定义图表。
递归数字缩放– 当您的图表配置了数字比例时，就需要递归数字缩放。您可以通过将指定的数字刻度分成小块来呈现图表数据。