Creazione di grafici a barre raggruppate
Il grafico a barre raggruppate viene utilizzato per visualizzare i valori tra più categorie contemporaneamente. I gruppi di dati possono essere tracciati sotto forma di barre raggruppate con larghezze uguali e altezze variabili che rappresentano la grandezza della quantità. I diagrammi a barre raggruppati possono essere utilizzati per visualizzare il tasso di variazione di una quantità per più categorie rispetto agli obiettivi predefiniti in base alla cifra statistica.
Informazioni su questa attività
- Titolo scheda
- Un'etichetta o un'intestazione univoca assegnata alla scheda.
- Descrizione comandi della scheda
- Un suggerimento fornisce ulteriori dettagli sui dati visualizzati sulla scheda.
- Soglia
- Una linea sul grafico al di sopra o al di sotto della quale sono valori significativi.
- Titolo asse Y
- Un'etichetta assegnata all'asse verticale del grafico.
- Titolo asse X
- Un'etichetta assegnata all'asse orizzontale del grafico.
- Legenda
- L'etichetta del gruppo di dati.
- Link di piè di pagina
- Un campo selezionabile o un collegamento con un'etichetta. Ad esempio,
View all.
Procedura
Esempio
La seguente query richiama la linea limite scaduta dal fornitore. La query include la variabile tenantId .
Per un grafico a barre raggruppato, è possibile visualizzare qualsiasi attributo restituito da una query.
query pastDueOrderlineBySupplier($tenantId: String!) {
pastDueOrderLineBySupplierChar: businessObjects(
simpleFilter: {type: OrderLine, tenantId: $tenantId}
hint: {viewId: "graph"}
advancedFilter: {AND: [{GREATER_THAN: [{SELECT: "order.plannedDeliveryDelay", type: FLOAT}, {VALUE: "0.0", type: FLOAT}]}, {EQUALS: [{SELECT: "order.orderType", type: STRING}, {VALUE: "INBOUND", type: STRING}]}]}
aggregationParams: {paginationParams: {first: 50, sort: [{fieldPath: "totalOrderLinesBySupplier.sum", order: DESC}]}, dimension: {fieldPath: "order.vendor.name", type: STRING}, reduce: {expression: {fieldPath: "value", operator: SUM, type: INT}, output: {resultAlias: "totalOrderLinesBySupplier", type: INT}}}
) {
totalCount
aggregationResults {
dimensionValues {
name
value
}
values {
name
numValue
}
}
edges {
cursor
object {
... on OrderLine {
valueCurrency
}
}
}
}
}
Il seguente codice è un esempio di come definire le variabili da utilizzare nella query:
{
"tenantId": "{{ tenantId }}"
}
Il seguente codice è un esempio dei dati restituiti dalla query:
{
"data": {
"pastDueOrderLineBySupplierChar": {
"totalCount": 289,
"aggregationResults": [
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 167457072,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "McGrey Electrical",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 604160,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "Total Source Extrusion Corporation",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 226800,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "F & M Metals",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 153200,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "LightLens Industries",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 107920,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "Alumi-lux Metal Products",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 59605,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "Gemini Design Technology",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 39040,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "Amos Wire Products Inc",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 28160,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "SilverOptics",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 13392,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "SJN Fuels",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 9518,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
},
{
"dimensionValues": [
{
"name": "order.vendor.name",
"value": "Interalloy Corporation",
"__typename": "NameValuePair"
}
],
"values": [
{
"name": "totalOrderLinesBySupplier",
"numValue": 744,
"__typename": "NameValueNumValuePair"
}
],
"__typename": "AggregationResult"
}
],
"edges": [
{
"cursor": "NDgzMzA0NA==",
"object": {
"valueCurrency": "USD",
"__typename": "OrderLine"
},
"__typename": "BusinessObjectEdge"
},
{
"cursor": "NDgzMzE3NA==",
"object": {
"valueCurrency": "USD",
"__typename": "OrderLine"
},
"__typename": "BusinessObjectEdge"
},
{
"cursor": "NDgzNDQ2Nw==",
"object": {
"valueCurrency": "USD",
"__typename": "OrderLine"
},
"__typename": "BusinessObjectEdge"
},
{
"cursor": "NDgzNDQyNw==",
"object": {
"valueCurrency": "USD",
"__typename": "OrderLine"
},
"__typename": "BusinessObjectEdge"
},
{
"cursor": "NDgzNDM5OQ==",
"object": {
"valueCurrency": "USD",
"__typename": "OrderLine"
},
"__typename": "BusinessObjectEdge"
}
],
"__typename": "BusinessObjectsCursor"
}
},
"loading": false,
"networkStatus": 7
}
Il seguente codice è un esempio della trasformazione applicata ai dati. L'attributo visualizzato deve corrispondere a quanto restituito dai dati. Questo attributo viene scelto nella sezione dei gruppi di dati. Qualsiasi calcolo può essere eseguito sui dati restituiti.
{
"errors": "{{ #? this.errors }}",
"totalCount": "{{ this.data.pastDueOrderLineBySupplierChar.totalCount }}",
"pageInfo": {},
"results": {
"{{ #each this.data.pastDueOrderLineBySupplierChar.aggregationResults }}": {
"group": "{{this.dimensionValues[0].value}}",
"value": "{{this.values[0].numValue}}",
"key": "Past due orderline"
}
}
}
Cosa fare successivamente
Aggiungere la scheda a un dashboard utilizzando il builder Dashboard.