流行的仪表盘:街机

201
0
一个月前
JenniferAcunto
Esri贡献者
4 0 201

流行的仪表板:HTML

流行的仪表板:地图

流行的仪表板:图标

流行的仪表盘:颜色

我带着另一个dashboard That Pop回来了。今天我们将讨论高级格式和街机。不是街机大师?没关系,因为我也不是!我的大脑不适合编写任何语言的脚本,但我确实有一些简单而通用的拱廊技巧来修饰你的仪表板。如果我能做到,那你也可以。

这是我们的开始仪表盘。此仪表板显示USGS火山的地位数据来自生活阿特拉斯

没有任何街机的仪表盘没有任何街机的仪表盘

有一些条件格式应用于指示器,如果有的话,会改变文本的颜色是否有警报。

基于警报号码的条件格式基于警报号码的条件格式

现在让我们在仪表板上应用一些Arcade。

带街机的仪表盘带街机的仪表盘

指标的条件格式也提高了一个档次使用高级格式

基于警报号码的条件格式。基于警报号码的条件格式。

高级格式与街机

通过启用高级格式,可以在表、列表和指示器元素中使用Arcade。

启用高级格式启用高级格式

一旦你启用高级格式,Arcade编辑器将打开.每一个元素有自己的具体的返回声明包括所有的可配置的部分元素的。注意改变各种返回元素的值是如何改变索引的tor的外观。

返回语句返回语句

: light_bulb:提示:如果您不确定具体的返回元素是什么,可以添加一个值并查看预览中的更改。

您可能已经注意到return语句中的一些元素是灰色的,并且以//开头。这意味着它们被“注释掉了”,它们被忽略了。您将需要删除//来使用该元素。

评论断断续续评论断断续续

如果有一个未注释的元素,但不提供值。将使用默认值。在这个例子中,我没有为背景颜色、顶部文本颜色、顶部文本轮廓颜色、中间文本颜色、或中间文字轮廓颜色。因此,使用元素背景颜色和文本颜色的默认仪表板主题值。

违约违约

要使用默认值,需要使用空引号。如果你去掉引号,完全保留它一片空白,您将得到一个错误。

语法错误语法错误

值类型

现在我们知道了return语句是如何工作的,让我们看看可以在return语句中使用的不同类型的值。有三种类型的值可以添加到每个返回元素:

  • 硬编码的值
  • 数据属性
  • 商场的变量

硬编码的值

这些是最直接的。只需添加您想要使用的值中间引用.颜色元素可以使用十六进制代码或HTML颜色名称

硬编码的值硬编码的值

当您像这样硬编码值时,它们将不是动态的。价值总是你所提供的。在某些情况下,这是完全没问题的。在示例仪表板中,我硬编码了条件返回的背景颜色。

硬编码背景色硬编码背景色

: light_bulb:提示:如果要使用条件格式,请打开条件格式第一个然后启用高级格式。这样,就为您创建了条件格式返回语句。

数据属性

这是直接从数据中提取值的情况。

数据属性数据属性

随着数据的变化,显示也会发生变化。

动态更改属性数据动态更改属性数据

在使用属性数据时,不需要使用引号,所以一定要在添加属性之前删除它们。我总是用全局变量窗格以添加我的属性。这样,我就不必担心语法正确或任何拼写错误。

全局为赢全局为赢

商场的变量

如果你想使用不属于你数据集的值,但仍然需要它们是动态的,这是正确的方法。

警报级别在数据中有一个指定的颜色值,而威胁级别没有。如果我们想要专注于威胁等级,并使用动态变化的颜色来突出非常高的威胁,我们将需要使用Arcade来做到这一点。

我将从一个简单的when语句开始。当威胁等级是非常高威胁时,给我红色,否则留空。

当美元数据。威胁==“非常高威胁”,“红色”,”)

商场的表情商场的表情

当功能具有非常高的威胁级别时,我们的Arcade语句将动态地将颜色从默认值更改为红色。但是,我们还不能在任何地方使用它,因为我们还没有将它分配给变量。

让我们将它分配给一个名为ThreatColor的变量。

var威胁颜色=当($datapoint. var威胁==“非常高威胁”,“红色”,”)

现在无论我们想在哪里使用动态颜色,我们只需添加威胁颜色。因为它是一个变量而不是一个硬编码的值,所以我们不需要将它包含在引号中。

带变量的街机语句带变量的街机语句

如果我们看一个威胁等级不是很高的火山,我们可以看到我们没有得到红色的文字。

动态街机变量动态街机变量

混合搭配

您可以混合和匹配您在return语句中使用的值类型,以获得您想要的外观。

多种值类型多种值类型

商场的属性

如果您想使用Arcade来创建未在预定义配置选项中使用的动态值,该怎么办?这就是return语句中的所有属性行发挥作用的地方。

让我们从这个简单的列表开始。

默认列表默认列表

: light_bulb:提示:想知道我是怎么得到那个方形图标的吗?读我的图标的博客学习HTML象征年代。

我们有两个目标:

  1. 根据威胁等级动态更改威胁等级颜色旁边的方框。
  2. 把我们的观测场变成更有用的东西。

让我们启用高级格式来实现它。

首先,我们将使我们的街机表情创建威胁颜色。这次我们希望每个威胁级别都有自己的颜色,所以我们只需要添加到我们上面使用的表达式上。我们还将添加一个默认颜色,以应用于任何其他值。

var ThreatLevel = When($datapoint. var威胁== '非常高的威胁','#780116',$数据点。威胁== '高威胁','#981e1d', $datapoint。威胁== '中度威胁','#f7b538', $数据点。威胁== '低威胁','#1f4d2e', $数据点。威胁==“极低威胁”,“#008040”,“#fff1e6”)

看看我们的return语句,我们只有一个text color元素,如果我们使用它,所有的我们的文本会改变颜色。这根本不是我们想要的。

不

而不是使用我们的威胁级别变量在textColor元素。我们将把它作为一个属性返回。

我们需要取消所有属性元素的注释,然后将变量添加到attribute1。我们将删除attribute2,因为我们只返回这一个属性。

返回属性返回属性

我们已经将威胁级别变量添加到返回语句中,但是列表中没有任何变化。这是因为除非显式地添加这些属性,否则不会使用这些属性。

它的语法是{表达式/ attributeName}

我们将把它添加到我们的列表中,这样我们就可以看到它的实际运行。

看它是否正常工作很简单。看它是否正常工作很简单。

所以,我们知道我们的声明是有效的。现在我们只需要用它来改变盒子的颜色。为此,我们将使用富文本编辑器更改方框的文本颜色。选择什么颜色并不重要,因为我们只使用编辑器,以便为我们创建HTML语法

我们可以写自己的HTML,但为什么要这么做呢?我们可以写自己的HTML,但为什么要这么做呢?

现在我们将使用source按钮来查看HTML。查找所添加的十六进制代码并将其替换我们的ThreatLevel属性。

用表达式替换十六进制代码用表达式替换十六进制代码

我们将从列表中删除test属性,下面是我们的列表现在的样子。

哦,方方正正!哦,方方正正!

现在让我们清理我们的观察场。我们将再次使用When语句,只是这一次我们将返回文本而不是返回颜色,并且我们的默认值将为空白。

var obs = When($datapoint. var obs = When($datapoint. var)观测== 'avo', '阿拉斯加火山观测站(avo)', $ datpoint。观测== 'calvo', 'USGS加州火山观测站(calvo)', $ datpoint。观测== 'cvo', 'USGS Cascades火山观测站(cvo)', $ datpoint。观测== 'hvo', 'USGS夏威夷火山观测站(hvo)', $ datpoint。观测== 'yvo', '黄石火山观测站(yvo)', ")

添加额外属性添加额外属性

同样,我们需要在属性部分返回这个变量,因此我们将添加另一个属性行。我们本可以使用attribute2,就像他们的例子一样。但是,我发现使用变量名更容易。当您获得越来越多的属性时,很难记住哪个是attribute1,哪个是attribute4。

我们将移动到列表和替换我们的观察领域与我们的新街机obs领域。

啊哈,格式很好的文本,而不是令人困惑的首字母缩写啊哈,格式很好的文本,而不是令人困惑的首字母缩写

当()函数

你可能注意到我用当()很多。这是因为它是如此的多功能和简单。如果你只学习一个街机功能,我建议它是这一个。我用它来动态地改变颜色,清理文本字段,甚至将它与其他函数结合起来。

下面是示例仪表板中由When()语句提供支持的所有内容。

所有的“何时”所有的“何时”

  1. 当警报级别为“X”时,提供“X”十六进制代码。
  2. 当威胁级别为“低”时,提供警报级别十六进制代码,否则提供浅黑色。(重复每一个威胁框)
  3. 当警报日期小于24小时前,提供火山表情符号,否则留空。(结合DateDiff)
  4. 如果警报日期小于24小时,则以小时为单位提供从现在开始的时间长度,否则以天为单位提供。(结合DateDiff和Concatenate)
  5. 当观察代码是“X”时,提供一个更容易理解的值。

: light_bulb:提示:检查我的HTML的博客关于创建自己的状态栏的技巧。

仪表盘快乐!

作者简介
我是一名技术顾问,专注于应用程序配置,其中包含一些地理空间策略和治理。