Javascript Table 在 Cognos 中，使用列表作为数据

Question

我们有 Javascript 可以根据代码中的 table 数据生成图表。

我们希望使用 Cognos 来自动化提取数据的过程。本质上，我们想在 Report Studio 中使用一个列表来填充下面 Javascript 代码的 table 部分。

我们尝试使用 table 前后的代码在列表前后添加 HTML 项目，页面填充为空白。

如有任何帮助，我们将不胜感激。谢谢

<script type="text/javascript"     src="https://www.gstatic.com/charts/loader.js"></script>

<script type="text/javascript">
  google.charts.load("current", {packages:["timeline"]});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {

var container = document.getElementById('example5.1');
var chart = new google.visualization.Timeline(container);
var dataTable = new google.visualization.DataTable();
dataTable.addColumn({ type: 'string', id: 'Room' });
dataTable.addColumn({ type: 'string', id: 'Name' });
dataTable.addColumn({ type: 'date', id: 'Start' });
dataTable.addColumn({ type: 'date', id: 'End' });
dataTable.addRows([

['Job1', '',  new Date(0,0,0,18,0,0), new Date(0,0,0,18,0,1) ],
['Job2', '',  new Date(0,0,0,18,3,0), new Date(0,0,0,18,3,7) ],
['Job3', '',  new Date(0,0,0,17,30,0), new Date(0,0,0,18,0,39) ],
['Job4', '',  new Date(0,0,0,18,0,0), new Date(0,0,0,18,10,19) ],
['Job5', '',  new Date(0,0,0,18,0,0), new Date(0,0,0,18,0,22) ]


  ]);

var options = {
  timeline: { colorByRowLabel: true }
};

chart.draw(dataTable, options);
  }

</script>

<div id="example5.1" style="height: 500px;" style="width: 100px;"></div>

Answer 1

我们想出了如何做到这一点。

首先，我们必须将 Javascript 放在单例中的 HTML 项中。一旦带有 JS 的 HTML 项目处于单例中，我们就能够在运行宁 Cognos 报告时显示图表（使用静态 table）。

由于我们希望 JS 中的 table 从 Cognos Query 中的数据运行，我们从 HTML 中删除了现有的 JS，并将单例中 HTML 项中的 JS。

JS第一部分：

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<script type="text/javascript">
  google.charts.load("current", {packages:["timeline"]});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {

var container = document.getElementById('example5.1');
var chart = new google.visualization.Timeline(container);
var dataTable = new google.visualization.DataTable();
dataTable.addColumn({ type: 'string', id: 'Room' });
dataTable.addColumn({ type: 'string', id: 'Name' });
dataTable.addColumn({ type: 'date', id: 'Start' });
dataTable.addColumn({ type: 'date', id: 'End' });
dataTable.addRows([

接下来在 HTML 项目的右侧放置一个 Repeater。在 Repeater 中放置一个 HTML 项目。在此 HTML 项的属性中，将源类型更改为数据项值。在数据项值中，将您希望显示在 JS 的 table 部分中的数据项。

注意：确保使用与原始 JS 中 table 相同的格式格式化数据项。我们制作 table 的数据项代码概述如下。使用 Repeater 中 HTML 中的 [FinalDataItem]。

[串联数据项]

'['''+[JobName]+''''+', ''' +
[ExecutionStatus] + ''''
+', new Date(0,0,0,'
+cast(Datepart({HH}, [StartTime]) as nvarchar(10)) + ',' 
+ cast(DatePart({MI}, [StartTime]) as nvarchar(10)) + ',' + cast(DatePart({SS}, [StartTime]) as nvarchar(10)) + '), new Date(0,0,0,' + cast(Datepart({HH}, [EndTime]) as nvarchar(10)) + ','
+ cast(DatePart({MI}, [EndTime]) as nvarchar(10)) + ',' + cast(DatePart({SS}, [EndTime]) as nvarchar(10)) + ') ]'

由于除最后一行外每行末尾都需要一个逗号，所以我们使用了下面的方法。

1) [RowNum]：创建一个数据项，使用运行ning-count([YourConcatenatedDataItem]) 为每一行指定一个数字。

2) [MaxRowNum]：创建另一个数据项以使用 Maximum([RowNumberDataItem] FOR REPORT) 获取报表的最大行号。将两个聚合函数都设置为自动。

3) [FinalDataItem]：创建一个新的数据项。在这个新的数据项中，我们将使每一行的末尾都有一个逗号，最后一行除外。使用 CASE WHEN [RowNum] <> [MaxRowNum] THEN [YourConcatenatedDataItem]+',' ELSE [YourConcatenatedDataItem] END。

返回报告，您需要在转发器右侧添加另一个 HTML 项目。在此 HTML 项中，您将在其中放置 JS 的最后一部分。

  ]);

var options = {
  timeline: { colorByRowLabel: true }
};

chart.draw(dataTable, options);
  }

</script>

<div id="example5.1" style="height: 500px;" style="width: 100px;"></div>

Javascript Table 在 Cognos 中，使用列表作为数据

Javascript Table within Cognos, using List as Data

javascript

cognos-10