Available only to users with `backoffice` permission and with sensors configured in advance.
--- ### Configuration To configure data sources and charts, open the **Backoffice**, access the edit page of an object class, and select the **Data Sources** tab. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-03/2-tab-object-class.png) #### Add a Data Source To create a new data source, click the **Add data source** button. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-01/3-button-add-data-sources.png) Select the data source **type** and enter an **identifying name** (e.g. *Type Thermometer, Name Thermometer 1*). [](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/4-sensor-selection.png) #### Add a ChartThe option to add charts becomes available only after **at least one data source** has been added.
To create a new chart, click the **Add chart** button. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-01/5-button-add-data-sources.png) Enter an **identifying name** and select the **chart type** (*Line, Counter, Bar, Scatter, 3D Scatter, Heatmap).*  At this point, you can configure different sections: - **Data** (required) - **Customization** (optional) - **Style** (optional) 💡 **Tip:** Assign clear and descriptive names to data sources and charts (e.g. “Thermometer Floor 1”) to make them easier to manage. --- ### Configure the Chart #### Data Section The **Data** section defines which data is displayed in the chart and which **Data Source** it is retrieved from. The first field to complete is **Data compression**, which allows you to choose how the available data is handled before it is displayed in the chart. You can select one of the following methods: - **Aggregation over time:** Groups the collected data into time intervals and shows a summarized value for each period. This is useful when there is a large amount of data and a more compact view of the trend is needed. - **Downsampling:** Reduces the number of displayed data points by keeping only part of the available values. This is useful to make the chart lighter when the amount of data is high. After choosing the compression method, configure the **Main data source**. In this section, select the **Data Source** that feeds the chart from those previously created. Once the Data Source has been selected, specify which values must be used for the chart axes. The available axes change depending on the selected chart type. [](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/Qid6-section-data.png) You can add multiple data series, and therefore multiple Data Sources, by clicking **Add series**. For **Counter** charts, click **Add value** instead. For the **3D Scatter** chart, the **Color range** is also available. This field allows you to select a numeric parameter to use for coloring the chart points according to their value. The system applies a color scale that helps visually distinguish lower, intermediate, or higher values within the data distribution. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-05/8-color-range.png) For the **Heatmap** chart, the **Color range** is also available. It defines the numeric parameter used to generate the color intensity of the map. The color therefore represents the variation of the selected value across the different areas or positions of the chart. For the **Heatmap**, you can also enable **Parametric navigation**. This option allows you to select an additional parameter to use as a data navigation level. In this way, you can browse the Heatmap by layers, displaying different data layers according to the value of the selected parameter. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-05/9-parametric-navigation.png) #### Customization SectionThe option to customize the chart becomes available only after the **Data** section has been completed.
The **Customization** section allows you to define how the chart is presented in the object detail panel. From here, you can edit texts, thresholds, axis scaling, and the values shown when the chart is opened. **[](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/7-customization.png)** **Labels** In this section, you can configure the texts displayed in the chart. You can enter a **title**, a **subtitle**, and the axis labels, for example **X Axis** and **Y Axis**. To make the chart clearer, you can also include the unit of measurement in the axis labels. **Thresholds** Thresholds allow you to highlight reference values or critical values within the chart. For each threshold, you can configure: - **Name**, to identify the threshold in the chart. - **Axis**, to indicate which axis the threshold applies to. - **Trigger value**, to define the reference value to highlight. This configuration is useful, for example, to indicate that a maximum temperature, a minimum level, or any other monitored value has been exceeded. **Axes** In this section, you can define how the scale of the values shown in the chart is calculated. You can choose from: - **Auto-scale**, where the system automatically adapts the scale based on the values shown in the chart. - **Fixed scale**, which allows you to manually set a minimum and maximum range. This is useful when you want to compare different charts while keeping the same reference scale. - **Relative scale**, which applies a percentage margin based on the values shown in the chart. This is useful when you want to keep a dynamic scale while adding extra visual space above and below the displayed values. **Default values** This section allows you to configure the initial values shown when the object detail panel is opened. You can define: - **Aggregation interval**, to establish how the data is grouped in the initial view. - **Time period**, to indicate the time range displayed when the chart is opened. 💡 **Tip:** Use **Thresholds** if you want to automatically highlight anomalous values in the chart. #### Style SectionAvailable only when **a single data series** is configured in the **Data** section.
This section allows you to create one or more **conditional styles**, that is, rules that change the appearance of the chart when specific conditions are met. [](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/m9m8-style.png) For each conditional style, you must enter a **name**, useful for recognizing the configured rule. In the conditions section, you can define when the style must be applied. Each condition is composed of: - **Reference parameter**, which is the value to check. - **Criterion**, which is the rule to verify, for example greater than, less than, or equal to. - **Type**, which is the way the comparison value is specified. - **Value**, which is the value that activates the condition. You can add multiple conditions by clicking **Add condition**. In the **Style** section, you can choose the **color** to apply to the chart when the defined conditions are met. The **Reset** button restores the style to the default value. You can configure multiple styles, by clicking **Add contidional style**, so that different colors are applied based on different thresholds or states. --- ### Links - *[Manage object in the project](https://wiki.eaglearca.com/books/funzionalita-dellapp/page/gestire-gli-oggetti-nel-progetto "Gestire gli oggetti nel progetto")* --- #### [](https://wiki.eaglearca.com/uploads/images/gallery/2026-05/ita.png) **Italiano** Una **Data Source** è una fonte dati associabile a una classe oggetto, che permette di raccogliere e visualizzare informazioni organizzate nel tempo. Questa funzione consente di collegare agli oggetti dati provenienti da sensori o altre fonti configurate, così da consultarli tramite grafici nel dettaglio dell’oggetto. Ad esempio, puoi associare a un sensore ambientale una Data Source che registra temperatura, umidità o altri valori monitorati. Le **Data Source** e i **grafici** vengono configurati durante la *[creazione o la modifica di una classe oggetto](https://wiki.eaglearca.com/books/backoffice/page/create-and-manage-object-classes "Create and manage Object Classes")*, all’interno di una sezione dedicata.Disponibile solo per utenti con permesso `backoffice` e con sensori configurati in precedenza.
### Configurazione Per configurare data source e grafici, apri il **Backoffice**, accedi alla pagina di modifica di una classe oggetto e seleziona la tab **Rappresentazione di dati**. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-03/2-tab-object-class.png) #### Aggiungere Data Source Per creare una nuova data source clicca sul bottone **Aggiungi sorgente dati**. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-01/3-button-add-data-sources.png) Seleziona il **tipo** di data source e imposta un **nome identificativo** (Es: Type *Thermometer*, Name *Termometro 1*). [](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/4-sensor-selection.png) #### Aggiungere GraficoLa possibilità di aggiungere grafici diventa disponibile solo se è stata aggiunta **almeno una data source**.
Per creare un nuovo grafico clicca sul bottone **Aggiungi grafico**. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-01/5-button-add-data-sources.png) Imposta il **nome identificativo** e seleziona il **tipo di grafico** (*Line, Counter, Bar, Scatter, 3D Scatter, Heatmap*).  A questo punto puoi configurare diverse sezioni: - **Dati** (obbligatoria) - **Personalizzazione** (facoltativa) - **Stile** (facoltativa) 💡 **Suggerimento:** Assegna nomi chiari e descrittivi a data source e grafici (es. "Termometro Piano 1") per facilitarne la gestione. --- ### Configurare il Grafico Sezione Dati La sezione **Dati** definisce quali dati vengono visualizzati nel grafico e da quale **Data Source** vengono recuperati. Il primo campo da compilare è la **Compressione dati**, che permette di scegliere come gestire i dati disponibili prima della visualizzazione nel grafico. Puoi selezionare uno dei seguenti metodi: - **Aggregazione per periodo:** Raggruppa i dati raccolti in intervalli di tempo e mostra un valore sintetico per ogni periodo. È utile quando sono presenti molti dati e serve una lettura più compatta dell’andamento. - **Sottocampionamento:** Riduce il numero di dati visualizzati mantenendo solo una parte dei valori disponibili. È utile per alleggerire la visualizzazione del grafico quando la quantità di dati è elevata. Dopo aver scelto il metodo di compressione, configura la **Sorgente dati principale**. In questa sezione è necessario selezionare la **Data Source** che alimenta il grafico tra quelle create in precedenza. Una volta selezionata la Data Source, specifica quali valori devono essere utilizzati negli assi del grafico. Gli assi disponibili cambiano in base alla tipologia di grafico selezionata. [](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/Qid6-section-data.png) È possibile aggiungere più serie di dati, e quindi più Data Source, cliccando **Aggiungi serie**. Per i grafici di tipo **Counter**, clicca invece **Aggiungi valore**. Nel caso del grafico **3D Scatter**, è disponibile anche il **Campo colore**. Questo campo permette di selezionare un parametro numerico da usare per colorare i punti del grafico in base al loro valore. Il sistema applica una scala colore che aiuta a distinguere visivamente valori più bassi, intermedi o più alti all’interno della distribuzione dei dati. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-05/8-color-range.png) Nel caso del grafico **Heatmap**, è disponibile il **Campo colore**, che definisce il parametro numerico usato per generare l’intensità cromatica della mappa. Il colore rappresenta quindi la variazione del valore selezionato nelle diverse aree o posizioni del grafico. Per la **Heatmap** puoi inoltre abilitare la **Navigazione parametrica**. Questa opzione consente di selezionare un ulteriore parametro da usare come livello di navigazione dei dati. In questo modo è possibile consultare la Heatmap per strati, visualizzando layer diversi in base al valore del parametro scelto. [](https://wiki.eaglearca.com/uploads/images/gallery/2026-05/9-parametric-navigation.png) #### Sezione PersonalizzazioneLa possibilità di personalizzare il grafico diventa disponibile solo se è stata completata la sezione **Dati**.
La sezione **Personalizzazione** permette di definire come il grafico viene presentato nel dettaglio dell’oggetto. Da qui puoi modificare testi, soglie, scala degli assi e valori mostrati all’apertura del grafico. **[](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/7-customization.png)** **Etichette** In questa sezione puoi configurare i testi visualizzati nel grafico. Puoi inserire un **titolo**, un **sottotitolo** e le etichette degli assi, ad esempio **Asse X** e **Asse Y**. Per rendere il grafico più chiaro, nelle etichette degli assi puoi indicare anche l’unità di misura del valore rappresentato. **Soglie** Le soglie permettono di evidenziare valori di riferimento o valori critici all’interno del grafico. Per ogni soglia puoi configurare: - **Nome**, per identificare la soglia nel grafico. - **Asse**, per indicare a quale asse applicare la soglia. - **Valore di attivazione**, per definire il valore di riferimento da evidenziare. Questa configurazione è utile, ad esempio, per segnalare il superamento di una temperatura massima, di un livello minimo o di qualsiasi altro valore da tenere sotto controllo. **Assi** In questa sezione puoi definire come viene calcolata la scala dei valori mostrati nel grafico. Puoi scegliere tra: - **Scala automatica**, con cui il sistema adatta automaticamente la scala in base ai valori presenti nel grafico. - **Scala fissa**, che permette di impostare manualmente un intervallo minimo e massimo. È utile quando vuoi confrontare grafici diversi mantenendo sempre la stessa scala di riferimento. - **Scala relativa**, che applica un margine percentuale rispetto ai valori presenti nel grafico. È utile quando vuoi mantenere una scala dinamica, ma con uno spazio visivo aggiuntivo sopra e sotto i valori rappresentati. **Valori predefiniti** Questa sezione permette di configurare i valori iniziali mostrati quando si apre il dettaglio dell’oggetto. Puoi definire: - **Intervallo di aggregazione**, per stabilire come i dati vengono raggruppati nella vista iniziale. - **Periodo temporale**, per indicare l’intervallo di tempo visualizzato all’apertura del grafico. 💡 **Suggerimento**: Usa le Soglie se vuoi evidenziare automaticamente valori anomali sul grafico. #### Sezione StileDisponibile solo se è configurato **una sola serie di dati** nella sezione **Dati**.
Questa sezione permette di creare uno o più **stili condizionali**, cioè regole che modificano l’aspetto del grafico quando si verificano determinate condizioni. [](https://wiki.eaglearca.com/uploads/images/gallery/2025-12/m9m8-style.png) Per ogni stile condizionale è necessario inserire un **nome**, utile per riconoscere la regola configurata. Nella sezione delle condizioni puoi definire quando lo stile deve essere applicato. Ogni condizione è composta da: - **Parametro di riferimento**, cioè il valore da controllare. - **Criterio**, cioè la regola da verificare, ad esempio maggiore di, minore di o uguale a. - **Tipo**, cioè la modalità con cui viene indicato il valore di confronto. - **Valore**, cioè il valore che attiva la condizione. Puoi aggiungere più condizioni cliccando su **Aggiungi condizione**. Nella sezione **Stile** puoi scegliere il **colore** da applicare al grafico quando le condizioni definite sono soddisfatte. Il bottone **Reset** ripristina lo stile al valore predefinito. È possibile configurare più stili, cliccando su **Aggiungi stile condizionale**, così da applicare colori diversi in base a soglie o stati differenti. --- ### Collegamenti - *[Gestire gli oggetti nel progetto](https://wiki.eaglearca.com/books/funzionalita-dellapp/page/gestire-gli-oggetti-nel-progetto "Gestire gli oggetti nel progetto")* --- ***Last update:** 08 May 2026*