Bullseye Chart

基础

下载与安装

Qlik Sense Desktop

要在 Qlik Sense Desktop 中安装 AnyChart Bullseye Extension，请执行以下操作：

1. 下载适用于 Qlik Sense 的 AnyChart Bullseye Extension。
2. 解压压缩包。
3. 打开 Windows 资源管理器窗口并导航到 Qlik Sense Extensions 目录：
   ..\Users\<UserName>\Documents\Qlik\Sense\Extensions。
4. 将 anychart-4x-bullseye 文件夹复制到 Extensions 目录。
5. 重新启动 Qlik Sense Desktop。

Qlik Sense Server

要在 Qlik Sense Server 上安装 AnyChart Bullseye Extension，

1. 下载适用于 Qlik Sense 的 AnyChart Bullseye Extension。
2. 打开 Qlik Management Console (QMC)：https://<QPS server name>/qmc
3. 在 QMC 开始页面或 Start 下拉菜单中选择 Extensions。
4. 点击操作栏中的 Import。
5. 在对话框中，选择下载的压缩包。将密码区域留空。
6. 在文件浏览器窗口中点击 Open。
7. 点击 Import。

Qlik Sense Cloud

要在 Qlik Sense Cloud 中安装 AnyChart Bullseye Extension，请执行以下操作：

1. 下载适用于 Qlik Sense Cloud 的 AnyChart Bullseye Extension。
2. 访问 Management Console：
   • 在您的租户地址后添加 /console：https://<your tenant address>/console
   • 或使用 hub 中用户个人资料下的导航链接 Administration

1. 转到 Extensions 页面并点击 Add。
2. 在对话框中，选择下载的压缩包。
3. 点击 Add。
4. 在 Management Console 中，转到 Content Security Policy 部分并点击 Add。
5. 在对话框中，为 Content Security Policy 起一个名称——例如 AnyChart。
6. 输入源服务器地址：qlik.anychart.com
7. 选择以下指令：
   • connect-src
   • font-src
   • img-src
   • script-src
   • style-src

1. 点击 Add。

概述

Bullseye chart 是一种将数据点显示为散布在一组同心圆环上的标记的工具，这些圆环代表序数类别或数值范围。

您可以配置图表的外观：设置 colors，调整 markers、legend、axes 和 grids，设置 start angle 和 inner radius，启用并配置 labels，以及设置 tooltips 的文本。

此外，还提供以下选项：interactivity 和 calculation conditions。

快速入门

本快速教程介绍了如何创建一个基础的 Bullseye chart。

首先，向工作表添加一个空图表：

1. 转到资产面板中的 Custom objects > AnyChart。
2. 将一个空的 AnyChart Bullseye 图表拖动到工作表中。

然后添加三个 dimensions，第一个代表定类类别（数据点组），第二个代表序数类别（圆环名称），第三个代表点的 ID：

1. 转到属性面板中的 Dimensions。
2. 点击 Add dimension 并选择一个维度。
3. 点击 Add dimension 并选择一个维度。
4. 点击 Add dimension 并选择一个维度。

或者，如果您的 数据结构 有此要求，也可以添加两个维度和一个 measure。

请注意，您也可以从字段创建维度和度量，或者通过点击空图表上的按钮来添加它们。

维度和度量

维度

要添加维度，请执行以下操作：

1. 转到属性面板中的 Dimensions。
2. 点击 Add dimension 并选择一个维度。

根据 数据结构，您可以添加两个或三个维度。

度量

要添加度量，请执行以下操作：

1. 转到属性面板中的 Measures。
2. 点击 Add measure 并选择一个度量。

根据 数据结构，您可以添加一个度量或创建一个不带度量的图表。数据结构

Bullseye chart 支持两种不同的设置数据的方式（数据结构）。您应该选择最适合您数据的一种。

3 个维度

如果您希望 Y-axis 显示序数类别（圆环名称），请添加三个 dimensions：

• 第一个维度 (Categories) 代表定类类别的名称，显示在 X-axis 上。
• 第二个维度 (Rings) 代表圆环的名称，显示在 Y-axis 上。
• 第三个维度 (ID) 代表数据点的 ID。

请记住，Y-axis 上的类别顺序由第二个维度的排序设置定义。

2 个维度 + 1 个度量

如果您希望 Y-axis 显示数值，请添加两个 dimensions 和一个 measure：

• 第一个维度 (Categories) 代表定类类别的名称，显示在 X-axis 上。
• 第二个维度 (ID) 代表数据点的 ID。
• 度量 (Rings) 代表数值，显示在 Y-axis 上。

请注意，当 Y-axis 显示数值时，可以设置 scale type（线性或对数）。

外观

颜色

AnyChart Bullseye 支持为图表的 markers 着色的不同方式。

其中一种颜色模式（By dimension）也会影响 legend。此外，根据模式的不同，图例可能可用，也可能不可用。

要选择颜色模式，

1. 转到属性面板中的 Appearance > Colors and legend。
2. 切换 Colors 滑块。
3. 从下拉菜单中选择一种颜色模式。

下表说明了不同模式之间的区别，并列出了每种模式可用的设置：

Single Color

您可以设置一种颜色，应用于所有 markers：

1. 转到属性面板中的 Appearance > Colors and legend。
2. 切换 Colors 滑块。
3. 从下拉菜单中选择 Single color。
4. 使用 Color 和 Opacity 选项。

在此模式下，legend 不可用。

Color by Dimension

您可以使用内置调色板通过任何维度为 markers 着色（取决于 数据结构，有两个或三个维度）：

1. 转到属性面板中的 Appearance > Colors and legend。
2. 切换 Colors 滑块。
3. 从下拉菜单中选择 By dimension。
4. 从 Select dimension 下拉菜单中选择一个维度。
5. 选择一个调色板并使用 Reverse colors 和 Opacity 选项。

legend 自动生成并着色。但是，如果需要，您随时可以禁用或自定义它。

在此屏幕截图中，标记和图例按第一个维度着色：

此处标记和图例按第二个维度着色：

Color by Expression

如果图表的 数据结构 包含度量，您可以通过表达式为其 markers 着色：

1. 转到属性面板中的 Appearance > Colors and legend。
2. 切换 Colors 滑块。
3. 从下拉菜单中选择 By expression。
4. 在 Expression 输入框中输入表达式。

此外，标记的形状也可以 有条件地设置。legend 可用，但您必须手动添加每个项目并为其着色。

按表达式着色使用用户定义的表达式设置颜色。按表达式着色时，您可以定义要使用的颜色以及与哪些值一起使用，从而更好地控制在可视化中如何使用颜色。例如，您可以突出显示特别感兴趣的值，或者区分不同数值范围内的值。按表达式着色还可以用于按可视化中未包含的值对可视化进行着色，例如按备选度量或维度为标记着色。

示例

这里有几个示例展示了您可以使用按颜色表达式执行的操作。请注意，表达式不会影响图例，因此在这些示例中，图例是手动配置的。

示例：按度量着色

If(Price < 1, 'green',
If(Price < 100, 'gold',
If(Price < 1000, 'orange', 
If(Price >= 1000, 'red'))))

在此示例中，4 种颜色表示 Y-axis 上显示的度量的 4 个范围（价格）。

示例：按备选度量着色

If(EstimatedCompletionTime < 4, 'red',
If(EstimatedCompletionTime < 8, 'orange',
If(EstimatedCompletionTime >= 8, 'green')))

在此示例中，3 种颜色表示预计完成时间的 3 个范围。然而，Y-axis 显示的是另一个度量——价格。

示例：按备选维度着色

If(Type = 'Antibiotic', 'green',
If(Type = 'Antiviral', 'orange',
If(Type = 'Analgesic', 'blue',
If(Type = 'Anticancer', 'red'))))

在此示例中，4 种颜色区分属于 4 个不同组（药物类型）的标记。X-axis 显示其他组（国家）。

标记

类型和大小

要配置标记，请转到属性面板中的 Appearance > Colors and legend，切换 Colors 滑块，并执行以下操作：

• 要设置大小，请使用 Size 选项。
• 要设置类型，请切换 Marker shape 滑块，并从下方的下拉菜单中选择一个内置图标（形状）。
• 要将标记设置为自定义图像，请在 Image URL 输入框中输入图像链接。

这是内置图标之一：

Type by Expression

您可以添加用户定义的表达式，为不同的标记分配不同的内置图标。当标记被 按表达式着色 时，此选项可用。要使用它，

1. 转到属性面板中的 Appearance > Colors and legend。
2. 切换 Marker shape 滑块。
3. 在 Marker shape expression 输入框中输入表达式。

在表达式中，您应该通过名称引用图标：

'circle'

'cross'

'diamond'

'diagonal-cross'

'square'

'star4'

'line'

'star5'

'trapezium'

'star6'

'pentagon'

'star7'

'arrowhead'

'star10'

'triangle-down'

'arrow-down'

'triangle-up'

'arrow-up'

'triangle-left'

'arrow-left'

'triangle-right'

'arrow-right'

在下面的示例中，颜色和形状代表 Y-axis 上显示的度量（价格）的不同范围。使用以下表达式来设置形状：

If(Price < 1, 'triangle-up',
If(Price < 100, 'diamond',
If(Price < 1000, 'cross', 
If(Price >= 1000, 'star4'))))

定义形状的表达式不需要与定义颜色的表达式相似。例如，这里的颜色代表 Y-axis 上显示的度量（价格），但形状代表 X-axis 上显示的维度（国家）：

If(Country = 'China', 'triangle-up',
If(Country = 'Germany', 'cross',
If(Country = 'USA', 'star4')))

图例

当图表 按维度着色 时，图例会自动生成并着色。但是，您可以禁用或自定义它。

当图表 按表达式着色 时，图例可用，但您必须手动添加每个项目并为其着色。

要配置图例，请转到属性面板中的 Appearance > Colors and legend，并执行以下操作：

• 要启用或禁用，请切换 Legend 滑块。
• 要设置位置，请从 Position 下拉菜单中选择 Top、Right、Bottom 或 Left。
• 要设置对齐方式，请从 Alignment 下拉菜单中选择可用选项之一。
• 要设置标题，请转到 Title 并在 Title 输入框中输入文本。
• 要配置标题字体，请使用 Style、Color、Size、Family 和 Shadow 选项。

要添加新的图例项目，

1. 转到 Items 并切换 Items 滑块（如果存在）。
2. 点击 Add legend item。
3. 在 Label 输入框中输入项目名称。
4. 要设置颜色，请使用 Color 选项。

自定义项目会替换自动生成的项目。

在此屏幕截图中，图表按第二个维度着色，并显示自动生成的图例，其位置和标题已自定义：

这里图表按表达式着色，图例显示自定义项目，其位置和标题已自定义：

轴

X-Axis

X-axis 显示定类类别的名称（任何 数据结构 中的第一个维度）。

要配置 X-axis，请转到属性面板中的 Appearance > X-axis 并执行以下操作：

• 要禁用或启用标签，请切换 Labels 滑块。
• 要配置描边，请转到 Line 并使用 Line、Color 和 Style 选项。
• 要配置 X-grid，请切换 Grid 滑块并使用下方的选项。

Y-Axis

根据 数据结构，Y-axis 显示序数类别（圆环名称）或数值（对应于度量）。

Y-axis 的位置受图表的 start angle 影响。

要配置 Y-axis，请转到属性面板中的 Appearance > X-axis 并执行以下操作：

• 要禁用或启用标签，请切换 Labels 滑块。
• 要配置描边，请转到 Line 并使用 Line、Color 和 Style 选项。
• 要配置 Y-grid，请切换 Grid 滑块并使用下方的选项。

此外，要设置 Y-scale 的类型，

1. 转到 Scale type。
2. 从下拉菜单中选择 Linear 或 Logarithmic。

请记住，仅当 Y-axis 显示数值 时，此选项才可用。如果值的范围非常宽，您可能需要使用 Logarithmic 刻度类型。

网格

Bullseye chart 有两个网格：

• X-grid 与 X-axis 相交并将图表划分为扇区。
• Y-grid 与 Y-axis 相交并将图表划分为圆环。

要配置网格，请转到属性面板中的 Appearance > X-axis 或 Y-axis，切换 Grid 滑块，并执行以下操作：

• 要配置描边，请转到 Line 并使用 Line、Color 和 Style 选项。
• 要配置填充，请向下滚动，从下拉菜单中选择填充类型，并使用下方的可用选项。

X-grid 和 Y-grid 支持不同的填充方案和设置：

可以通过将不同的方案应用于不同的网格来组合填充类型。下面的屏幕截图显示了大部分填充及其组合：

起始角度

您可以调整图表的 start angle，这会影响图表的方向和 Y-axis 的位置：

1. 转到属性面板中的 Appearance > Presentation。
2. 使用 Start angle 选项。

默认情况下，起始角度为 0°。

内半径

您可以调整图表的 inner radius，以设置中心开放空间的大小：

1. 转到属性面板中的 Appearance > Presentation。
2. 使用 Inner radius 选项。

默认情况下，内半径为 0%：中心被内环占据，不留额外空间。

标签

Labels 是链接到 markers 的文本对象，用于显示有关其所代表的数据点的附加信息。

默认情况下，图表上没有标签，但您可以启用并配置它们。转到属性面板中的 Appearance > Labels 并执行以下操作：

• 要启用或禁用，请切换 Labels 滑块。
• 要设置文本，请切换 Text 滑块并在输入框中输入字符串值或字符串表达式。
• 要配置背景，请切换 Background 滑块并使用 Fill、Opacity、Corner type、Border type 和 Border radius 选项。
• 要配置字体，请切换 Font 滑块并使用 Style、Color、Size、Family 和 Shadow 选项。
• 要设置字符限制，请切换 Character limit 滑块并在输入框中输入一个数字。

在下面的示例中，标签显示以下表达式：

If(Price >= 1000, Drug & Chr(10) & '$' & Round(Price), ' ')

工具提示

Tooltips 是当用户将鼠标悬停在 markers 上时出现的文本框。您可以设置自定义工具提示文本。

请注意，工具提示文本既可以设置为字符串值，也可以设置为任意字符串表达式。使用表达式允许您突出显示特别感兴趣的值，显示可视化中未包含的值或计算结果，等等。

此外，您可以在工具提示中使用 HTML。

要禁用或启用工具提示，请转到属性面板中的 Interactivity 并切换 Tooltips 滑块。

要配置工具提示文本，

1. 转到属性面板中的 Appearance > Tooltips。
2. 切换 Tooltip text 滑块。
3. 在输入框中输入字符串值或字符串表达式。

这里是一个用于配置工具提示文本的表达式示例：

'<b>' & Upper(Drug) & '</b>'&
'<br><i>' & Type & '</i>' &
'<hr>Stage: ' & Phase &
'<br>Estimated Price: $' & Price

其他功能

交互性

默认情况下，提供以下交互功能：选择、快照和 tooltips。要禁用或启用它们，请转到属性面板中的 Interactivity 并切换以下滑块：

• Selection
• Snapshots
• Tooltips

计算条件

AnyChart 支持计算条件：您可以设置一个必须满足（为 true）才能显示对象的条件。如果不满足该条件，则会显示自定义消息。

当图表或表格非常大且导致可视化响应缓慢时，计算条件非常有用。计算条件可以提供帮助，例如，在用户通过应用选择将数据过滤到更易于管理的级别之前，不显示对象。

要添加条件，请执行以下操作：

1. 转到属性面板中的 Add-ons > Data handling。
2. 在 Calculation condition 输入框中输入表达式。
3. 在 Displayed message 输入框中输入字符串值或字符串表达式。

例如，以下表达式允许仅在用户选择少于 10 个数据项时显示图表：

If(Count(Drug) < 10, 1, 0)

如果项目太多，AnyChart 会显示此消息：

'There are too many items (' & Count(Drug) & ').'