V1
V1

图表

ActiveReportsJS 设计器中, 您可以使用 图表 控件展示数据可视化。 图表控件提供了多种图表类型,可根据实际需要选择不同图表类型来展示。

图表数据区域根据您选择的图表类型以不同方式显示一系列点。 有关图表类型的更多信息,请参阅 图表类型

如何使用图表, 包含单价,库存和类别名称字段的数据源。

创建报表布局

  1. 在设计器中添加 图表 控件。
  2. 在属性窗口 系列 会默认添加为绘图区域1
  3. 在资源管理器中选择, 选择绘图区域1 ,并设置属性如下:
    a. 在 Values 属性, 点击 显示项,选择添加项目
    b. 点击 显示值选项。
    c. 单击单选按钮以显示字段并选择** UnitsInStock **。请注意,UnitsInStock字段将添加到数据字段中。.
  4. 选择绘图区域 1,转到Encodings> Category然后选择添加项。
  5. 单击单选按钮以显示字段,然后选择CategoryName。
  6. 将图例中的显示值名称设置为True。
  7. 转到“图表”选项卡,然后从“设置图表模板”中选择“线”。
  8. 要添加另一个绘图区域,请选择图表数据区域,然后转到属性选项卡。
  9. 单击“绘图”属性旁边的“显示项目”,然后添加另一个绘图区域2。
  10. 同上,将绘图区域2的Values属性设置为UnitPrice。
  11. 选择绘图区域 1,转到Encodings> Category然后选择添加项。
  12. 单击单选按钮以显示字段,然后选择** CategoryName **。
  13. 设置 隐藏图例 为 是.
  14. 图表 选项卡中设置,图表类型选择柱状图.

指定轴数据, 标签及图例

  1. 在资源管理中, 选择 纵轴 - [Plot 1].
  2. 设置 标题 > 数据 Units In Stock.
  3. 同上,设置 纵轴标题 - [Plot 2] 设置标题 > 数据 .
  4. 设置 坐标轴标签 > 数据格式 为 货币。
  5. 选择X轴 .
  6. 设置标题为分类名称Category Name.
  7. 设置 绘图区域 为 绘图区域1 和 绘图区域2。

添加图表标题

  1. 选择图表标题,
  2. 在标题属性中输入 Products,现在图表如下:
  3. Preview your report.