ServiceNow / GlideRecord-查询表格后如何为图表准备数据？

编程问答 2022-08-11

问题描述

我正在尝试在动态内容块中构建可视化内容以用于仪表板。 我正在使用d3.js作为图表库。它已经看起来像预期的一样，但是我只使用硬编码的数据，我想查询表中的实时数据。

这是我到目前为止所做的：

<?xml version="1.0" encoding="utf-8" ?>  
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">  
<html>
    <script src="https://d3js.org/d3.v6.min.js"></script>
    <style>
        .chart rect {
            fill: steelblue;
        }

        .chart text {
            fill: white;
            font: 10px sans-serif;
            text-anchor: start;
        }

        .centered-chart {
            text-align: center;
        }
    </style>
    <body>
        <div class="centered-chart">
            <h1>D3 Chart Test - Incidents (Priority) </h1>
            <svg class="chart"></svg>
        </div>
    </body>
    <script>

        var c = this;


        var data = [
        
        {"category": "1 - Critical","value": 26},{"category": "2 - High","value": 4},{"category": "3 - Moderate","value": 8},{"category": "4 - Low","value": 3},{"category": "5 - Planning","value": 14}
        
        ];


        var width = 600,barHeight = 20;



        var chart = d3.select(".chart")

        .attr("width",width)

        .attr("height",barHeight * data.length);




        var x = d3.scaleLinear()

        .range([0,width])

        .domain([0,d3.max(data,function(d) { return d.value; })]);




        var bar = chart.selectAll("g")

        .data(data)

        .enter().append("g")

        .attr("transform",function(d,i) { return "translate(0," + i * barHeight + ")"; });




        bar.append("rect")

        .attr("width",function(d) { return x(d.value); })

        .attr("height",barHeight - 1);




        bar.append("text")

        .attr("x",5)

        .attr("y",barHeight / 2)

        .attr("dy",".35em")

        .text(function(d) { return d.category; });



        bar.append("text")

        .attr("x",function(d) { return x(d.value) - 15; })

        .attr("y",".35em")

        .text(function(d) { return d.value; });
    </script>
</html>
</j:jelly>

但是如前所述，我只使用硬编码数据：（

所以，我做了一些这样的测试：

<script>
    var gr = new GlideRecord('incident');
        gr.addQuery('priority','=',1);
        gr.query(response);

    function response(result) {
        while(result.next()) {
            console.log(result.getValue('number')); 
        }
    }
</script>

只是为了查看此查询任务是否起作用，但我并不真正了解SNow脚本或gliderecord以了解或了解想法，我如何将这些事件按优先级分组或计数，我的意思是 如何准备数据，以便能够像硬编码数据一样在图表中使用它？

我知道，这是一个非常简单的场景，它只供我了解基础知识并深入了解它，但是我在早期阶段已经遇到了问题，我希望任何人都知道如何进行或可以给予帮助给我一些关于这件事逻辑的技巧。

所以，我希望大家在本周能有一个好的开始，并且有人对我正在尝试做的事情有更好的了解，并能给我一些建议。

greetz 丹尼斯

解决方法

我对ServiceNow或GlideRecord不熟悉，所以希望能为您提供帮助。

您的问题与d3并没有特别的关系，因为您知道如何将数据从一种格式转换为可视化格式，而是与如何将数据从GlideRecord转换为所述格式相关。

   var categories = {
      1: "1 - Critical",2: "2 - High",3: "3 - Moderate",4: "4 - Low"
      5: "5 - Planning"
    };

    var data = [];
    var gr = new GlideRecord('incident');

    // Object.entries returns sets of (key,value)
    Object.entries(categories).forEach(function(entry) {
      var priority = entry[0];
      var category = entry[1];
      gr.addQuery('priority','=',priority);

      // getRowCount returns the number of matching rows
      data.push({ category: category,value: gr.getRowCount() });
    });

编辑，您询问了如何获取所有类别。我不知道。在普通数据库中，您将有一个单独的表priority或category表。如果是这样，您可以执行以下操作：

    var categories = [];
    var gr = new GlideRecord('priority');

    gr.query();
    while(gr.next()) {
      categories[gr.priority] = gr.category; // or name/identifier or anything else really
    }

这将创建一个对象，从数据库中获取所有优先级，然后将它们放在那里。我不建议您将所有事件都放在优先位置，因为那样可能会贵得多。