在互動式通訊中使用圖表 using-charts-in-interactive-communications

圖表或圖表是資料的視覺化表示法。 它會將大量資訊壓縮為容易理解的視覺格式，讓互動式通訊的收件者更能將複雜資料視覺化、解讀及分析。

建立互動式通訊時，您可以新增圖表，以視覺化方式呈現互動式通訊表單資料模型中的二維資料。 「圖表」元件可讓您新增及設定下列型別的圖表：圓形圖、直條圖、環形圖、橫條圖、折線圖、折線圖和點圖、點圖、區域圖以及象限圖。

在互動式通訊中新增及設定圖表 add-and-configure-chart-in-an-interactive-communication

執行以下步驟，在互動式通訊中新增及設定圖表：

設定圖表屬性 configure-chart-properties

為列印和Web通道建立圖表時，請設定下列屬性：

在圖表中使用函式 use-functions-in-chart

您可以設定圖表以使用統計函式來計算來源資料的值，以便在圖表上繪圖。 透過在圖表中套用函式，您可以繪圖表單資料模型不直接提供的資料。

雖然圖表元件隨附一些內建函式，但您可以撰寫 自訂函式 並使其可用於Web Channel的圖表設定。

下列函式預設可用於圖表元件：

平均值（平均） 傳回X或Y軸上指定值在其他軸上的平均值。

Sum 傳回X或Y軸上指定值在其他軸上的所有值總和。

最大值 傳回X或Y軸上指定值在另一個軸上的最大值。

頻率 傳回X或Y軸上指定值在其他軸上的值數目。

Range 傳回X軸或Y軸上，指定值在另一個軸上的最大值和最小值之差。

中間值 傳回在X軸或Y軸上將另一個軸上指定值的高值和低值以一半分隔的值。

最小值 傳回X或Y軸上指定值在其他軸上的最小值。

模式 傳回在X或Y軸上出現次數最多的值，代表另一個軸上的指定值。

如需詳細資訊，請參閱 範例2：在折線圖中使用總和和和頻率函式.

Web Channel中的自訂函式 customfunctionsweb

除了在圖表中使用預設函式之外，您也可以在JavaScript中撰寫自訂函式，™且在Web channel的Chart元件中，讓函式清單中的函式可供使用。

函式將一或多個值和類別名稱視為輸入並傳回值。 例如：

Multiply(valueArray, category) {
 var val = 1;
 _.each(valueArray, function(value) {
 val = val * value;
 });
 return val;
}

編寫自訂函式後，請執行以下操作以使其可用於圖表設定：

函式現在可用於圖表中。

範例1：列印和網頁中的圖表輸出 chartoutputprintweb

在「基本」標籤中，您可以定義圖表型別、包含資料的來源表單資料模型屬性、要在圖表的X軸和Y軸繪製的標籤，以及可選的統計函式，以計算圖表上繪製的值。

讓我們透過使用互動式通訊產生的卡片陳述式，詳細瞭解基本屬性中最低必要資訊。 假設您要產生圖表，以描述對帳單中不同費用的金額。 您想要使用不同型別的圖表來列印互動式通訊及Web輸出。

列印用的柱狀圖 columnchartprint

若要完成此作業，請指定下列屬性：

互動式通訊列印管道中的直條圖

適用於Web的環形圖 donutchartweb

若要完成此作業，請指定下列屬性：

互動式通訊Web channel中的環形圖

範例2：在折線圖中使用總和和和頻率函式 applicationsumfrequency

透過在圖表中套用函式，您可以繪圖表單資料模型不直接提供的資料。 在此範例中，我們使用信用卡對帳單範例來瞭解如何將總和和和頻率函式套用至圖表。

沒有函式的折線圖，具有兩個「AirBnB的借方」交易

Sum函式 sum-function

您可以套用sum函式將相同資料屬性的多個執行個體的值相加，並且只顯示一次。 例如，在下圖中，Sum函式套用在Y軸，以加總兩個AirBnB交易（2050和1050）的Debit金額，並且只顯示一個交易(3100)。

當您想要為相同資料屬性的許多執行個體進行排序及顯示總和時，Sum函式可讓圖表變得更實用。

頻率函式 frequency-function

Frequency函式會傳回另一個軸上指定值Y軸的值數目。 在Y軸（「交易金額」）上套用「頻率」函式後，圖表顯示AirBnB交易出現兩次「借方」，其餘交易型別出現一次。

範例3：Web中的多系列象限圖 example-multi-series-quadrant-chart-in-web

圖表會繪製在特定日期範圍內執行的交易金額。 象限圖表可將圖表區域分成四個標示的區段。 字元會針對X軸和Y軸使用靜態參考點。 使用多重序列功能，根據銀行名稱來分隔資料。

若要完成此作業，請指定下列屬性：