Contatto
  Contatto

Per iniziare - Digital Twin Visual

Benvenuti! Questa guida completa vi aiuterà a iniziare rapidamente a utilizzare la visualizzazione Digital Twin per Power BI, con navigazione avanzata, legenda interattiva, larghezza proporzionale dei bordi, tooltip migliorati, filtraggio incrociato e funzionalità di drill-through.
 
Navigazione rapida:
Panoramica | Impostazione dei dati | Configurazione di base | Caratteristiche avanzate | Risoluzione dei problemi
 

📋 Panoramica completa delle funzioni

🔍 Navigazione migliorata ✨

  • Zoom e panoramica fluidi con animazioni fluide
  • Controlli di navigazione professionali su schermo
  • Minimappa in tempo reale con indicatore viewport
  • Feedback intelligente del cursore (afferrare/graffiare)
  • Precisione simile a quella del CAD per diagrammi di grandi dimensioni

🎨 Sistema di legende interattive ✨

  • Legenda dinamica dai colori effettivi dei nodi
  • Fare clic sugli elementi della legenda per evidenziare i nodi
  • Funziona con qualsiasi campo categorico
  • Integrazione del filtraggio incrociato
  • Visualizzazione del conteggio dei nodi per categoria

📊 Larghezza del bordo proporzionale ✨

  • Lo spessore del bordo varia con l'intensità del flusso
  • Algoritmo di normalizzazione per nodo
  • Identificazione immediata del collo di bottiglia
  • Attivare/disattivare tramite il riquadro del formato
  • Visualizzazione contestuale del flusso

💬 Tooltip migliorati ✨

  • Tooltips flessibili per i nodi "Chiave: Valore" dei nodi
  • Sistema di fallback per i bordi intelligenti
  • Supporto di più campi con nomi di campo
  • Generazione automatica di etichette
  • Design retrocompatibile

🔄 Filtraggio incrociato avanzato

  • Filtraggio bidirezionale con tabelle
  • Evidenziazione dei singoli nodi/bordi
  • Filtraggio delle categorie basato su legende
  • Supporto per la multiselezione
  • Modello di dati migliorato con misure

🎯 Integrazione di Power BI

  • Menu contestuali conformi ad AppSource
  • Ricche funzionalità di drill-through
  • Controlli del riquadro di formato organizzati
  • Controlli dei bordi migliorati con i sottogruppi
  • Gestione professionale della selezione

📊 Impostazione e requisiti dei dati avanzati

⚠️ Importante: Per ottenere prestazioni ottimali, tutti i dati devono essere contenuti in un'unica tabella che utilizza una struttura UNION con una corretta gestione dei NULL.

Struttura del modello di dati migliorata

- Struttura dei dati migliorata con tutte le nuove funzioni ✨
SELEZIONARE
    NodeId,
    Stato: Running\nType: Machine´nTemperature: 85°C'nEfficiency: 92%' come NodeTooltip,
    'Running' come LegendColor, - Per la legenda interattiva ✨
    NULL come EdgeId, NULL come SourceId, NULL come TargetId, NULL come EdgeTooltip,
    Efficienza come NodeValue, - Per il filtraggio incrociato
    NULL come EdgeValue
DALLA TABELLA NODI
UNIONE TUTTI
SELEZIONARE
    NULL come NodeId, NULL come NodeTooltip, NULL come LegendColor,
    EdgeId, SourceId, TargetId,
    Tipo: MaterialFlow´nIntensità: High'nPressure: 2.5 bar' come EdgeTooltip, - Tooltip intelligenti ✨
    NULL come NodeValue,
    FlowIntensity come EdgeValue - Filtraggio incrociato + ampiezza proporzionale ✨
DA TABELLA BORDI

Riferimento ai ruoli dei dati migliorati

CampoTipoStatoDescrizioneEsempio
Contenuto SVGMisuraRichiestomarkup SVG contenente il diagramma del gemello digitale...
NodeIdCategoriaRichiestoIdentificatore univoco per ogni nodoM1001, B1201, T1101
Tooltip del nodoCategoria✨ Potenziato"Chiave: Valore" formato tooltip multilineaStato: In corso di esecuzione Tipo: MacchinaEfficienza: 92%
Colore della legenda (opzionale)Categoria✨ Nuovo!Campo categorico per la generazione interattiva di legendeEsecuzione, manutenzione, offline
Valore del nodoMisura🔄 PotenziatoMetriche di business per i nodi di cross-filtering85.4, 92.1, 79.8
ID BordoCategoria❌ OpzionaleIdentificatore univoco per ogni bordoE1001, E1002
ID sorgenteCategoria❌ OpzionaleNodo sorgente per i bordiM1001
ID obiettivoCategoria❌ OpzionaleNodo di destinazione per i bordiM1002
Tooltip del bordo (opzionale)Categoria✨ Nuovo!Tooltip su più campi con sistema di fallback intelligenteCampi multipli supportati
Valore del bordoMisura🔄 PotenziatoIntensità del flusso per il filtraggio incrociato + larghezza proporzionale85.0, 150.5, 89.1

⚙️ Guida completa alla configurazione

Passo 1: Preparare il contenuto SVG

  1. Creare una misura SVG: Assicurarsi che l'SVG contenga un markup valido con un codice univoco id attributi
  2. ID della partita: I valori NodeId devono corrispondere all'elemento SVG id attributi esattamente
  3. Struttura pulita: Utilizzare un dimensionamento coerente ed evitare trasformazioni complesse
  4. Colori neutri: Utilizzate colori SVG neutri; lasciate che sia la vista a controllare la colorazione.
  5. Design pronto per i bordi: Progettate i percorsi dei bordi in modo che funzionino bene con il ridimensionamento della larghezza proporzionale.
Contenuto SVG =
"
  <rect id=’M1001′ x=’100′ y=’100′ width=’80’ height=’50’ fill=’#cccccc’/>
  <rect id=’M1002′ x=’220′ y=’100′ width=’80’ height=’50’ fill=’#cccccc’/>
  <line id=’E1001′ x1=’180′ y1=’125′ x2=’220′ y2=’125′ stroke=’#999999’/>
  <circle id=’T1101′ cx=’260′ cy=’460′ r=’30’ fill=’#aaaaaa’/>
"

Step 2: Download Visual and Insert License

📽️ In this video, you’ll learn how to download the Digital Twin visual from AppSource and activate your license.

  1. Download Visual: Download the Digital Twin visual from MS AppSource
  2. Aggiungi visuale: Inserire il visual Digital Twin nel report
  3. Insert License: Paste your license key into the License section under Format your visual

Step 3: Import Your Data

📽️ This video shows how to prepare your SVG layout and structure your data table.

  1. Prepare Data: Create a single data table combining nodes and edges (see above)
  2. Import Data: Import the SVG (e.g. as .txt) and data table (e.g. as csv.) into Power BI field

Step 4: Connect Data to the Visual

📽️ In this video, you’ll connect your data to the visual and enable navigation and interactivity with other visuals.

  1. Apply Basic Data: Drag SVG content, node ID, and edge ID fields in the respective Visualizations pane
  2. Add Enhanced Data: Add measures to legend and tooltip fields to enrich the visual
  3. Implement Cross-Filtering: Include NodeValue and EdgeValue measures to ensure filtering works across visuals
  4. Visual Navigation: Test the visual navigation features using zoom controls, mini-map or mouse-over

Step 5: Customize Your Nodes

📽️ This video covers how to apply conditional formatting to highlight node insights.

  1. Simple Node Coloring: Select your preferred color for each node in the Nodes section under Format your visual
  2. Or Apply Conditional-Formatting: Set up individual rules to color your nodes by clicking the formula icon

Step 6: Customize Your Edges

📽️ In this video, learn how to customize flows and connections clearly and dynamically.

  1. (De-)select Gradient: Toggle gradient on/off for edge coloring
  2. Customize Format: Adjust opacity, line width, or layer order
  3. Simple Edge Coloring: Select your preferred color for each edge in the Edges section under Format your visual
  4. Or Apply Conditional-Formatting: Set up individual rules to color your edges by clicking the formula icon

Step 7: Create Advanced Tooltip

📽️ This video explains how to display extra context via mouse-over, with either simple or advanced. tooltips

  1. Apply Basic Tooltip: Drag fields into the Tooltip section to apply a basic tooltip
  2. Or Create Advanced Tooltip: Create a custom tooltip page with charts, KPIs, and more
  3. Connect to Visual: Add nodeID or edgeID to the Tooltip field

Step 8: Develop Drillthrough Option

📽️ In this video, learn how to create deep-dive analysis pages for nodes or edges.

  1. Create Detail Page: Create a report page and design customized visuals for detailed insights
  2. Connect to Visual: Add nodeID or edgeID to the Drillthrough field
  3. Test Drillthrough: Right-click a node or edge → Drillthrough to view details

Step 9: Apply Advanced Conditional Formatting

📽️ In this video, you’ll learn how to apply rule-based formatting using combined measures for clearer, priority-based node and edge coloring.

  1. Create Combined Measure: Create a combined measure as a column to reflect multiple conditions (e.g., node status and type)
  2. Formattazione condizionale: Set up conditional formatting rules based on the new combined measure
  3. Insert Legend: Insert the same field as a legend to improve clarity and filtering

🎯 Guida all'uso delle funzioni avanzate

🔍 Navigazione e zoom migliorati ✨

Interazioni con il mouse e il tatto

  • Rotella del mouse: Scorrere per ingrandire/ridurre con animazioni fluide
  • Fare clic e trascinare: Panoramica con feedback visivo del cursore (afferrare/graffiare)
  • Controlli di navigazione: Utilizzare i pulsanti +, - e home sullo schermo
  • Vista di ripristino: Fare clic sul pulsante Home per tornare agevolmente alla vista originale.
  • Navigazione su minimappa: Fare clic sulla minimappa per saltare a diverse aree
  • Tracciamento della finestra di visualizzazione: Guardate il rettangolo della viewport in tempo reale nella minimappa

🎨 Sistema di legende interattive ✨

Impostazione e utilizzo della legenda

  1. Impostazione: Trascinare qualsiasi campo categorico in "Colore della legenda (opzionale)".
  2. Lettura dei colori: La legenda legge automaticamente i colori effettivi dai nodi renderizzati
  3. Fare clic su Filtro: Fare clic sulle voci della legenda per evidenziare i nodi corrispondenti
  4. Feedback visivo: Categorie selezionate evidenziate, altre oscurate
  5. Visuale incrociata: I clic sulla legenda attivano il filtraggio in altre immagini
  6. Azzeramento: Fare nuovamente clic sullo stesso elemento della legenda per cancellare l'evidenziazione
💡 Un consiglio da professionista: Perfetto per monitorare lo stato, filtrare le categorie e capire a colpo d'occhio cosa rappresentano i colori dei nodi.

📊 Larghezza del bordo proporzionale ✨

Visualizzazione basata sul flusso

  1. Mappatura dei dati: Mappare l'intensità del flusso/il flusso in entrata nel campo Valore del bordo
  2. Abilitazione della funzione: Riquadro Formato > Bordi > Generale > "Larghezza proporzionale".
  3. Scala visiva: Lo spessore dei bordi scala automaticamente con i valori dei dati
  4. Scala contestuale: La normalizzazione per nodo mostra l'importanza relativa
  5. ID collo di bottiglia: Identificare immediatamente le connessioni ad alto flusso
  6. Campo visivo: Spessore da 1px minimo a 8px massimo
💡 Valore aziendale: Utilizzabile per i dashboard operativi per individuare immediatamente i colli di bottiglia e le connessioni ad alto rendimento nel vostro gemello digitale.

💬 Sistema Tooltip migliorato ✨

Configurazione flessibile dei suggerimenti

  • Tooltip dei nodi: Utilizzare il formato "Chiave: Valore\nKey2: Valore2" nel campo Tooltip del nodo.
  • Supporto multilinea: Utilizzare ´n per le interruzioni di riga nel contenuto del tooltip
  • Bordi con punte di strumenti: Trascinare più campi in "Tooltip bordo (opzionale)".
  • Fallback intelligente: Informazioni di base automatiche quando non sono stati specificati campi personalizzati
  • Etichette di campo: I nomi dei campi diventano automaticamente etichette per i suggerimenti
  • Contenuto ricco: Supporto per il contesto operativo e le metriche aziendali

🔄 Filtraggio incrociato avanzato

Sistema di filtraggio a tre vie

  1. Tabella ↔ Visuale: Fare clic sulle righe della tabella per evidenziare i nodi/le spighe.
  2. Legenda ↔ Visivo: Fare clic sulle voci della legenda per evidenziare le categorie
  3. Visivo ↔ Altre immagini: Fare clic su nodi/spigoli per filtrare grafici/tabelle
  4. Selezione multipla: Tenere premuto Ctrl e fare clic su più elementi
  5. Selezione libera: Fare clic sullo spazio vuoto per azzerare tutte le selezioni
  6. Feedback visivo: Elementi evidenziati a piena opacità, altri attenuati

Controlli avanzati del bordo

Riquadro Formato organizzato

📁 Sezione Bordi:
  • 🎨 Colori dei bordi (sottogruppo): Colori dei bordi e controlli di sfumatura individuali
  • ⚙️ Generale (sottogruppo): Opacità, ordine di rendering e larghezza proporzionale
Controlli disponibili:
  1. Abilita la sfumatura dei bordi: Transizioni di colore uniformi tra i nodi
  2. Larghezza proporzionale: Scala dello spessore basata sul flusso
  3. Opacità dei bordi: Controllo della trasparenza (0-100%)
  4. Mostra bordi in primo piano: Controllo della stratificazione

🎯 Impostazione del foro passante

  1. Creare pagine di approfondimento: Impostare pagine di dettaglio dedicate
  2. Aggiungere campi di filtro: Includere NodeId/EdgeId nei filtri di drill-through
  3. Test di navigazione: Fare clic con il tasto destro del mouse su nodi/spigoli per visualizzare le opzioni di drill-through.
  4. Menu Spazio vuoto: Fare clic con il tasto destro del mouse sulle aree vuote per il menu standard di Power BI
  5. Verificare il contesto: Assicurarsi che il contesto filtrato venga passato correttamente

🔧 Guida completa alla risoluzione dei problemi

❌ Problemi di navigazione migliorati ✨

  • Controllare il riquadro Formato > Impostazioni di navigazione per i controlli dello zoom e la visibilità della minimappa.
  • Verificare lo spazio visivo sufficiente per i comandi di navigazione e la minimappa.
  • Test del feedback del cursore durante le operazioni di pan (dovrebbe mostrare la presa/la cattura)
  • Assicurarsi che il rettangolo della minimappa si aggiorni correttamente durante lo zoom e la panoramica.
  • Test su schermi di diverse dimensioni per verificare il comportamento reattivo

❌ Problemi di legenda interattivi ✨

  • Verificare che il campo categorico sia trascinato su "Colore della legenda (opzionale)".
  • Controllare che i nodi abbiano i colori reali (non tutti i grigi predefiniti).
  • Assicurarsi che i dati categorici contengano valori significativi e puliti.
  • Test della funzionalità di clic della legenda per il comportamento di evidenziazione
  • Verificare che il posizionamento della legenda non ostacoli il contenuto visivo principale.

❌ Problemi di larghezza proporzionale dei bordi ✨

  • Attivare la levetta "Larghezza proporzionale" nel riquadro Formato > Bordi > Generale
  • Assicurarsi che il campo Valore bordo contenga dati numerici sul flusso.
  • Verificare che EdgeId, SourceId, TargetId siano mappati correttamente.
  • Verificare che i dati del bordo presentino una variazione significativa dei valori.
  • Verificare che la scalatura dello spessore sia visivamente appropriata

❌ Problemi di Tooltip migliorati ✨

  • Utilizzare il formato "Chiave: Valore\nKey2: Valore2" per il campo Tooltip del nodo.
  • Per la Tooltip del bordo, trascinare i campi nella sezione "Tooltip del bordo (opzionale)".
  • Test del fallback intelligente quando non sono specificati campi Edge Tooltip
  • Controllare che i nomi dei campi appaiano come etichette nella visualizzazione dei suggerimenti.
  • Assicuratevi che i contenuti multilinea vengano visualizzati con le interruzioni di riga corrette.

Il filtraggio incrociato non funziona

  • Aggiungere i campi di misura Valore del nodo e/o Valore del bordo
  • Assicurarsi che i valori delle misure siano popolati (non NULL o vuoti).
  • Test in entrambe le direzioni: tabella → visiva e visiva → tabella
  • Test del filtraggio basato sulla legenda in modo indipendente
  • Verificare che la selezione attivi le evidenziazioni (modifica dell'opacità)
  • Test con una semplice selezione singola

Non viene visualizzata la vista

  • Verificare che la misura Contenuto SVG restituisca un markup SVG valido
  • Verificare che il campo NodeId sia mappato e contenga dati
  • Assicurarsi che gli ID degli elementi SVG corrispondano esattamente ai valori NodeId
  • Convalidare la sintassi SVG con un validatore SVG online

Nodi non interattivi

  • Confermare che il ruolo dei dati NodeId è popolato
  • Verificare che gli elementi SVG abbiano gli attributi id corrispondenti
  • Verificare che gli elementi non siano nascosti da altri elementi SVG
  • Test degli effetti hover per confermare il rilevamento degli elementi

❌ Bordi non visibili

  • Mappare i ruoli di dati EdgeId, SourceId e TargetId
  • Assicurarsi che i valori SourceId/TargetId corrispondano ai valori NodeId esistenti.
  • Controllare l'impostazione dell'opacità dei bordi (potrebbe essere impostata troppo bassa)
  • Verifica dell'ordine di rendering dei bordi (primo piano o sfondo)
  • Testate prima con i colori dei bordi ad alto contrasto

🎉 Migliori pratiche avanzate

Modellazione dei dati migliorata ✨

  • Scegliere campi categoriali significativi per la legenda interattiva
  • Struttura dei tooltip utilizzando il formato "Chiave: Valore".
  • Utilizzare le metriche di flusso per la larghezza proporzionale dei bordi
  • Assicurare la corretta gestione di NULL nella struttura UNION
  • Test con volumi di dati realistici

Prestazioni e navigazione ✨

  • Sfruttare la minimappa per la navigazione in diagrammi di grandi dimensioni
  • Ottimizzare la complessità di SVG per uno zoom/pan regolare
  • Test dell'ampiezza proporzionale con dati di flusso realistici
  • Monitoraggio dell'utilizzo della memoria con funzioni avanzate
  • Utilizzare i campi di misura in modo strategico per il filtraggio incrociato

Esperienza utente ✨

  • Utilizzare i clic della legenda per il filtraggio basato sulle categorie
  • Combinare il filtraggio delle tabelle con il filtraggio delle legende
  • Progettare contenuti significativi per i tooltip
  • Standardizzare i livelli di zoom e i modelli di navigazione
  • Testare tutti i flussi di lavoro di interazione end-to-end

Integrazione avanzata ✨

  • Utilizzare la larghezza proporzionale per il monitoraggio operativo
  • Combinare il filtraggio delle leggende con l'analisi delle serie temporali
  • Collegare i dati di flusso con l'analisi predittiva
  • Creare cruscotti multimodali completi
  • Integrazione con i visual geografici utilizzando il filtraggio condiviso
🚀 Siete pronti a iniziare? Questa soluzione completa trasforma i diagrammi statici in cruscotti digitali interattivi con una navigazione professionale, una visualizzazione intelligente dei flussi, un filtraggio basato sulle categorie e ricche informazioni contestuali!

© LeapLytics GmbH 2025 | Versione 1.0.0.5.
Gemello digitale visivo per Power BI