指标管理器

指标管理器会收集并报告与 Blockly 工作区相关的所有指标。本指南介绍了从 Metrics Manager 返回的每组指标的含义。如需详细了解指标管理器，您还可以观看我们的 2021 年指标深度解析。

指标

工具箱指标

workspace.getMetricsManager().getToolboxMetrics();

工具箱指标由类别工具箱的 height、width 和 position 组成。这不包括附加到工具箱的弹出式菜单中的信息。

Blockly 工作区，其中箭头显示了工具箱的宽度和高度。

工具箱的 position 属于 Blockly.utils.toolbox.Position 类型。

弹出式菜单指标

workspace.getMetricsManager().getFlyoutMetrics();

弹出式菜单指标由弹出式菜单工具箱的 height、width 和 position 组成。请务必注意，此功能区不是附加到类别工具箱的功能区。这仅适用于弹出式工具箱，如下面的照片所示。

Blockly 工作区，其中显示了指向悬浮窗宽度和高度的箭头。

弹出式界面的 position 的类型为 Blockly.utils.toolbox.Position。

SVG 指标

workspace.getMetricsManager().getSvgMetrics();

SVG 指标由工作区父 SVG 的 width 和 height 组成。对于主工作区，这是具有 blocklySvg 类的 SVG。 此 SVG 包含可见的工作区以及工具箱。

Blockly 工作区，周围环绕着蓝色矩形。

查看指标

workspace.getMetricsManager().getViewMetrics(opt_getWorkspaceCoordinates);

视图指标由视口的 height、width、top 和 left 组成。视口是工作区的可见部分。这不包括任何类型的工具箱。

Blockly 工作区，其中不包括工具箱的区域周围有一个蓝色矩形。

左上角相对于工作区原点。当我们拖动工作区时，视口的顶部和左侧位置会更新。

Blockly 工作区，其中用蓝色矩形圈出了不包括工具箱的区域，并显示了与左上角偏移的原点。

绝对指标

workspace.getMetricsManager().getAbsoluteMetrics();

绝对指标由视口相对于父 SVG 的 top 和 left 偏移量组成。具体取决于工具箱在工作区中的位置，通常是工具箱的宽度或高度。

Blockly 工作区，工具箱右侧和工作区顶部有一条蓝线。 带有水平工具箱的 Blockly 工作区。工作区的左侧和工具箱下方有一条蓝线。

内容指标

workspace.getMetricsManager().getContentMetrics(opt_getWorkspaceCoordinates);

内容指标由任何块或工作区注释周围的边界框的 height、width、top 和 left 组成。

Blockly 工作区，其中包含一个蓝色框，框住了工作区的内容。

滚动指标

workspace.getMetricsManager().getScrollMetrics(opt_getWorkspaceCoordinates);

滚动指标由可滚动区域的 height、width、top 和 left 组成。对于可移动的工作区，可滚动区域是内容区域加上一些内边距。

Blockly 工作区，周围环绕着一个蓝色大框。

坐标系

默认情况下，指标管理器计算的所有指标均以像素坐标的形式返回。在适用的情况下，您可以将 true 传递给指标方法，以获取工作区坐标中的某些指标。例如 metricsManager.getViewMetrics(true)。

workspaceCoordinate = pixelCoordinates / workspace.scale

工作区坐标通常用于位于工作区上的项，例如块和工作区注释。当用户放大和缩小工作区时，工作区坐标不会发生变化。

替换指标

如果开发者希望为工作区提供自己的指标，可以注册一个实现 IMetricsManager 接口或扩展 Blockly.MetricsManager 的替代指标管理器对象。

您可以在 Continuous Toolbox 插件或 Fixed Edges 插件中找到这方面的示例。