逻辑表达式可视化工具

Logical Expression Visualizer

本文关键字：工具可视化表达式更新时间：2024-02-03

我开发了一个业务规则引擎，用户可以用布尔语法编写规则。

例如，规则为：R1、R2、R3

示例表达式：（R1 AND R2）OR R3

我想把这个表达形象化。例如，可视化框架可以在树视图中显示表达式并插入颜色。

是否有任何javascript或任何其他代码框架可以实现这一点？（应用程序是一个ASP.NET应用程序）

我忍不住回答了这个问题，尽管我的回答可能无法帮助您轻松解决问题。早在1998年，我的第一个Javascript项目就是一个布尔表达式可视化工具。

该代码在任何地方都不可用，所以我不能分享它。（我怀疑我的前雇主是否还有副本。）即使是这样，它也在IE4、5.0和5.5上运行；我认为它从未为IE6更新过，也不知道它是否在那里运行。

但我仍然可以告诉你基本的想法，即使在今天，我仍然为结果感到骄傲，尽管我知道看到实际的代码我会不寒而栗。

当然，布尔表达式可以很容易地用树结构来表示。树中的每个非叶节点都是AND、OR或NOT节点，AND和OR可以有多个子节点（所以我将"a和B以及C和D"表示为AND（a、B、C、D），而不仅仅是二进制AND的组合。）为了显示数据，我只使用了嵌套框。and水平运行，or垂直运行，在块之间重复关键字"and"answers"or"。NOT只是一个框中的一个框，外框中有关键字"NOT"。

我的叶节点与用户可以用于测试的真实数据场景相关联，因此它们看起来不像，而不仅仅是"A"answers"B"

age < 30
gender = 'F'
income > 40000

用户可以输入字段age、gender和income的样本数据，输出将变为红绿色显示，以显示表达式的每个块，当然还有整个表达式是真是假。

要使用的字段是可配置的，并且测试用例被保存以备将来详述。

这是一个非常有趣的项目，它有助于编写规则的商务人员和执行规则的程序员之间的沟通，这些人对如何在礼貌的公司中使用"answers"这个词往往有着截然不同的想法。：-）

但要点是，可视化布尔表达式的一种非常有用的方法是使用简单的框：NOT是框中的框，单词"NOT"在外框中。or是包含中间带"或"的垂直分组框的框，and是包含中间带有"answers"的水平分组框的方框。如果你真的可以为你的基元指定truthy/falsy值，那么绿色代表truthy框，红色代表falsy框，这将是一个非常引人注目的显示。

但你必须自己编写代码。很抱歉