Noțiuni introductive - Digital Twin Visual

Bine ați venit! Acest ghid cuprinzător vă va ajuta să vă familiarizați rapid cu vizualizarea Digital Twin pentru Power BI, cu navigare avansată, legendă interactivă, lățime proporțională a marginilor, indicatoare îmbunătățite, filtrare încrucișată și capabilități de detaliere.

📋 Prezentare cuprinzătoare a caracteristicilor

🔍 Navigație îmbunătățită ✨

Zoom și panoramare fluide cu animații fluide
Comenzi profesionale de navigare pe ecran
Minimapă în timp real cu indicator viewport
Feedback inteligent al cursorului (apucare/apucare)
Precizie asemănătoare CAD pentru diagrame mari

🎨 Sistem de legende interactive ✨

Legenda dinamică din culorile reale ale nodurilor
Faceți clic pe elementele din legendă pentru a evidenția nodurile
Funcționează cu orice câmp categorial
Integrarea filtrării încrucișate
Afișarea numărului de noduri pe categorie

📊 Lățime proporțională a marginii ✨

Grosimea marginilor variază în funcție de intensitatea fluxului
Algoritm de normalizare pe nod
Identificarea instantanee a blocajelor
Activare/dezactivare prin intermediul panoului de format
Vizualizarea contextuală a fluxului

💬 Tooltips îmbunătățite ✨

Nod flexibil "Cheie: Tooltips-uri pentru noduri "Valoare
Sistem inteligent de revenire la tooltipurile de margine
Suport pentru mai multe câmpuri cu nume de câmp
Generarea automată a etichetelor
Design compatibil cu trecutul

🔄 Filtrare încrucișată avansată

Filtrare bidirecțională cu tabele
Evidențierea individuală a nodurilor/liniarelor
Filtrarea categoriilor pe bază de legendă
Suport pentru mai multe selecții
Model de date îmbunătățit cu măsuri

🎯 Integrarea Power BI

Meniuri contextuale compatibile cu AppSource
Capacități bogate de detaliere
Controale organizate ale panoului de formate
Controale îmbunătățite ale marginilor cu subgrupuri
Managementul selecției profesionale

📊 Configurarea și cerințele privind datele îmbunătățite

⚠️ Important: Pentru o performanță optimă, toate datele trebuie să se afle într-un singur tabel care utilizează o structură UNION cu gestionarea corespunzătoare a NULL.

Structura îmbunătățită a modelului de date

- Structură de date îmbunătățită cu toate caracteristicile noi ✨

SELECT 

    NodeId, 

    'Stare: Running\nType: Mașină\nTemperatură: 85°C\nEficiență: 92%' as NodeTooltip,

    'Running' as LegendColor, - Pentru legenda interactivă ✨

    NULL ca EdgeId, NULL ca SourceId, NULL ca TargetId, NULL ca EdgeTooltip,

    Eficiență ca NodeValue, - Pentru filtrare încrucișată

    NULL ca EdgeValue

FROM NodesTable

UNION ALL

SELECT 

    NULL ca NodeId, NULL ca NodeTooltip, NULL ca LegendColor,

    EdgeId, SourceId, TargetId,

    'Tip: MaterialFlow\nIntensity: High\nPressure: 2.5 bar' as EdgeTooltip, - Tooltips inteligente ✨

    NULL ca NodeValue,

    FlowIntensity as EdgeValue - Filtrare încrucișată + lățime proporțională ✨

FROM EdgesTable

Referință privind rolurile de date îmbunătățite

Câmp	Tip	Statut	Descriere	Exemplu
Conținut SVG	Măsură	✅ Necesar	Marcaj SVG care conține diagrama digitală a geamănului	...
NodeId	Categorie	✅ Necesar	Identificator unic pentru fiecare nod	M1001, B1201, T1101
Node Tooltip	Categorie	✨ Îmbunătățit	"Cheie: Format tooltip cu mai multe linii "Valoare	Stare: Funcționare Tip: Mașină\nEficiență: 92%
Culoarea legendei (opțional)	Categorie	✨ Nou!	Câmp categorial pentru generarea interactivă de legende	Funcționare, Întreținere, Offline
Valoarea nodului	Măsură	🔄 Îmbunătățit	Metrici de afaceri pentru nodurile de filtrare încrucișată	85.4, 92.1, 79.8
EdgeId	Categorie	❌ Opțional	Identificator unic pentru fiecare margine	E1001, E1002
SourceId	Categorie	❌ Opțional	Nod sursă pentru margini	M1001
TargetId	Categorie	❌ Opțional	Nod țintă pentru margini	M1002
Tooltip margine (opțional)	Categorie	✨ Nou!	Tooltip pentru mai multe câmpuri cu sistem inteligent de rezervă	Câmpuri multiple acceptate
Valoare margine	Măsură	🔄 Îmbunătățit	Intensitatea debitului pentru filtrarea încrucișată + lățimea proporțională	85.0, 150.5, 89.1

⚙️ Ghid cuprinzător de configurare

Pasul 1: Pregătiți conținutul SVG

Creați măsura SVG: Asigurați-vă că SVG-ul dvs. conține marcaje valide cu id atribute
ID-uri de potrivire: Valorile NodeId trebuie să corespundă elementului SVG id atribute exacte
Structură curată: Utilizați dimensiuni coerente și evitați transformările complexe
Culori neutre: Utilizați culori neutre SVG; lăsați controlul vizual asupra coloritului
Design pregătit pentru margini: Proiectați traseele marginilor pentru a funcționa bine cu scalarea lățimii proporționale

Conținut 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’/>

"

Pasul 2: Configurați Basic Visual

Adăugați vizual: Introduceți imaginea Digital Twin în raportul dvs.
Maparea conținutului SVG: Trageți măsura SVG în câmpul "Conținut SVG"
Hartă NodeId: Trageți identificatorul nodului dvs. în câmpul "NodeId"
Testați funcționalitatea de bază: Verificați dacă pe noduri se poate face clic și dacă hover-ul funcționează

Pasul 3: Activarea funcțiilor îmbunătățite ✨

🎨 Configurarea legendei interactive

Adăugați câmp de legendă: Glisați câmpul categoric la "Legend Color (optional)"
Generație automată: Legenda citește automat culorile reale ale nodurilor
Interacțiune de testare: Faceți clic pe elementele din legendă pentru a evidenția nodurile
Verificarea afișajului: Verificarea numărului de noduri apare pentru fiecare categorie

💬 Configurarea îmbunătățită a sfaturilor de instrumente

Node Tooltips: Utilizați "Key: Value\nKey2: Value2" în câmpul Node Tooltip
Tooltips pentru margini: Trageți mai multe câmpuri în "Tooltip margine (opțional)"
Conținutul testului: Treceți cursorul peste noduri / muchii pentru a verifica tooltips-uri bogate
Verificarea etichetelor: Asigurați-vă că numele câmpurilor apar ca etichete de tip tooltip

📊 Configurarea lățimii marginilor proporționale

Adăugați date privind fluxul: Maparea valorilor debitului/intensității la câmpul Edge Value
Adăugați câmpuri de margine: Includeți EdgeId, SourceId, TargetId pentru vizualizare
Activează funcția: Panoul Format > Margini > General > Comutați "Lățime proporțională"
Scalarea testelor: Verificarea scării grosimii marginilor cu valorile datelor

🔍 Configurare navigație avansată

Activați controalele: Panoul Format > Navigație > Activați controalele de zoom
Activați Minimap: Comutați minimapa pentru navigarea pe diagrame mari
Test de navigație: Zoom cu roata mouse-ului, click-drag pan
Verificați feedback-ul: Verificați modificările cursorului în timpul operațiunilor de panoramare

🔄 Configurare avansată a filtrării încrucișate

Adăugați câmpuri de măsurare: Includeți măsurile NodeValue și EdgeValue
Creați tabele: Adăugați tabele vizuale cu aceleași date pentru filtrare
Filtrarea mesei de testare: Faceți clic pe rândurile tabelului pentru a evidenția elementele
Testați filtrarea legendei: Faceți clic pe elementele de legendă pentru filtrarea pe categorii
Testați filtrarea vizuală: Faceți clic pe noduri/ muchii pentru a filtra alte imagini

✅ Configurație completă: Acum ar trebui să aveți un geamăn digital complet interactiv, cu navigare avansată, legendă interactivă, lățime proporțională a marginilor, sfaturi îmbunătățite privind instrumentele și capacități complete de filtrare încrucișată.

🎯 Ghid de utilizare a funcțiilor avansate

🔍 Navigare și zoom îmbunătățite ✨

Interacțiuni Mouse & Touch

Roata mouse-ului: Derulați pentru a mări / micșora cu animații fluide
Faceți clic și trageți: Panoramarea cu feedback vizual al cursorului (prindere/prindere)
Comenzi de navigație: Utilizați butoanele +, - și Acasă de pe ecran
Resetați vizualizarea: Faceți clic pe butonul Acasă pentru a reveni fără probleme la vizualizarea inițială
Navigație Minimap: Faceți clic pe minimapă pentru a sări la diferite zone
Urmărire Viewport: Urmăriți dreptunghiul de vizualizare în timp real în minimap

🎨 Sistem de legende interactive ✨

Configurarea și utilizarea legendei

Configurare: Glisați orice câmp categoric la "Legendă culoare (opțional)"
Citirea culorilor: Legenda citește automat culorile reale din nodurile redate
Faceți clic pentru a filtra: Faceți clic pe elementele din legendă pentru a evidenția nodurile corespunzătoare
Feedback vizual: Categoriile selectate sunt evidențiate, celelalte sunt atenuate
Cross-Visual: Clicurile pe legendă declanșează filtrarea în alte elemente vizuale
Resetare: Faceți clic din nou pe același element de legendă pentru a șterge evidențierea

💡 Sfat profesional: Perfect pentru monitorizarea stării, filtrarea categoriilor și pentru a înțelege dintr-o privire ce reprezintă culorile nodurilor.

📊 Lățime proporțională a marginii ✨

Vizualizare bazată pe flux

Cartografierea datelor: Maparea intensității fluxului/debitului la câmpul Edge Value
Activează funcția: Panoul Format > Margini > General > "Lățime proporțională"
Scalare vizuală: Grosimea marginilor se scalează automat cu valorile datelor
Scalarea contextuală: Normalizarea pe nod arată importanța relativă
Bottleneck ID: Identificați instantaneu conexiunile cu debit mare
Raza vizuală: 1px grosime minimă până la 8px grosime maximă

💡 Valoarea de afaceri: Utilizați pentru tablouri de bord operaționale pentru a identifica imediat blocajele și conexiunile cu randament ridicat în geamănul dvs. digital.

💬 Sistem Tooltip îmbunătățit ✨

Configurare flexibilă a Tooltip-ului

Node Tooltips: Utilizați "Key: Value\nKey2: Value2" în câmpul Node Tooltip
Suport pentru mai multe linii: Utilizați \n pentru întreruperile de linie în conținutul tooltip
Tooltips pentru margini: Trageți mai multe câmpuri în "Tooltip margine (opțional)"
Smart Fallback: Informații de bază automate atunci când nu sunt specificate câmpuri personalizate
Etichete de câmp: Numele câmpurilor devin automat etichete de tip tooltip
Conținut bogat: Sprijin pentru contextul operațional și parametrii de afaceri

🔄 Filtrare încrucișată avansată

Sistem de filtrare cu trei căi

Tabel ↔ vizual: Faceți clic pe rândurile tabelului pentru a evidenția nodurile/ordurile
Legendă ↔ vizual: Faceți clic pe elementele din legendă pentru a evidenția categoriile
Vizual ↔ Alte elemente vizuale: Faceți clic pe noduri/ muchii pentru a filtra graficele/tabele
Selecție multiplă: Țineți apăsat Ctrl și faceți clic pe mai multe elemente
Selecție clară: Faceți clic pe spațiul gol pentru a reseta toate selecțiile
Feedback vizual: Elementele evidențiate au opacitate totală, altele sunt atenuate

⚡ Controale avansate ale marginilor

Panoul Format organizat

📁 Secțiunea margini:

🎨 Culori de margine (subgrup): Culori individuale ale marginilor și controale ale gradientului
⚙️ General (subgrup): Opacitate, ordine de redare și lățime proporțională

Comenzi disponibile:

Activați Gradientul marginilor: Tranziții de culoare netede între noduri
Lățime proporțională: Scalarea grosimii pe baza fluxului
Opacitate margine: Controlul transparenței (0-100%)
Afișați marginile în prim-plan: Controlul stratificării

🎯 Configurare prin găurire

Creați pagini Drill-Through: Configurați pagini de detalii dedicate
Adăugați câmpuri de filtrare: Includerea NodeId/EdgeId în filtrele drill-through
Test de navigație: Faceți clic dreapta pe noduri/ muchii pentru a vedea opțiunile de detaliere
Meniu spațiu gol: Faceți clic dreapta pe zonele goale pentru meniul Power BI standard
Verificarea contextului: Asigurați-vă că contextul filtrat este transmis corect

🔧 Ghid cuprinzător de depanare

❌ Probleme de navigare îmbunătățită ✨

Verificați panoul Format > Setări de navigare pentru controalele zoom și vizibilitatea minimap
Verificați spațiul vizual suficient pentru comenzile de navigație și minimap
Testați feedback-ul cursorului în timpul operațiunilor de panoramare (ar trebui să arate apucare/apucare)
Asigurați-vă că dreptunghiul de vizualizare minimap se actualizează corect în timpul zoom-ului/pan-ului
Testați pe diferite dimensiuni ale ecranului pentru un comportament receptiv

❌ Probleme interactive de legendă ✨

Verificați dacă câmpul categoric este tras la "Legend Color (optional)"
Verificați dacă nodurile au culori reale (nu toate gri implicit)
Asigurați-vă că datele categoriale conțin valori semnificative și curate
Testați funcționalitatea de clic pe legendă pentru evidențierea comportamentului
Verificați dacă poziționarea legendei nu obstrucționează conținutul vizual principal

❌ Probleme legate de lățimea proporțională a marginilor ✨

Activați comutatorul "Lățime proporțională" în panoul Format > Margini > General
Asigurați-vă că câmpul Edge Value conține date numerice privind debitul
Verificați dacă EdgeId, SourceId, TargetId sunt mapate corect
Verificați dacă datele de pe margine prezintă o variație semnificativă a valorilor
Testați dacă scalarea grosimii este adecvată din punct de vedere vizual

❌ Probleme îmbunătățite cu Tooltip ✨

Utilizați "Key: Value\nKey2: Value2" pentru câmpul Node Tooltip
Pentru Edge Tooltip, trageți câmpurile la secțiunea "Edge Tooltip (opțional)"
Testarea unei soluții de rezervă inteligente atunci când nu sunt specificate câmpuri Edge Tooltip
Verificați dacă numele câmpurilor apar ca etichete în afișarea tooltip
Asigurați-vă că conținutul pe mai multe linii este afișat cu pauzele de linie corespunzătoare

❌ Filtrarea încrucișată nu funcționează

Adăugați câmpuri de măsurare a valorii nodului și/sau a valorii muchiei
Asigurați-vă că valorile măsurilor sunt completate (nu NULL/vide)
Testați ambele direcții: tabel → vizual și vizual → tabel
Testați independent filtrarea bazată pe legendă
Verificați dacă selecția declanșează evidențierea (modificarea opacitate)
Testare cu selecție simplă unică în primul rând

❌ Vizualul nu se afișează

Verificați dacă măsurarea conținutului SVG returnează marcaje SVG valide
Verificați dacă câmpul NodeId este mapat și conține date
Asigurați-vă că ID-urile elementelor SVG corespund exact valorilor NodeId
Validarea sintaxei SVG utilizând un validator SVG online

❌ Nodurile nu sunt interactive

Confirmați că rolul de date NodeId este completat
Verificați dacă elementele SVG au atribute id corespunzătoare
Verificați dacă elementele nu sunt ascunse de alte elemente SVG
Testați efectele hover pentru a confirma detectarea elementelor

❌ Marginile nu se văd

Maparea rolurilor de date EdgeId, SourceId și TargetId
Asigurați-vă că valorile SourceId/TargetId corespund valorilor NodeId existente
Verificați setarea opacității marginilor (poate fi setată prea jos)
Verificarea ordinii de redare a marginilor (prim-plan vs fundal)
Testați mai întâi cu culori de margine cu contrast ridicat

🎉 Cele mai bune practici avansate

Modelare îmbunătățită a datelor ✨

Alegeți câmpuri categorice semnificative pentru legenda interactivă
Structură tooltips folosind formatul "Key: Valoare" format
Utilizați măsurători de flux pentru lățimea proporțională a marginilor
Asigurați gestionarea corectă a NULL în structura UNION
Testați cu volume de date realiste

Performanță și navigație ✨

Utilizați minimap pentru navigarea pe diagrame mari
Optimizarea complexității SVG pentru zoom/pan fără probleme
Testați lățimea proporțională cu date de debit realiste
Monitorizați utilizarea memoriei cu funcții îmbunătățite
Utilizați câmpurile de măsurare în mod strategic pentru filtrarea încrucișată

Experiența utilizatorului ✨

Utilizați clicurile din legendă pentru filtrarea pe bază de categorie
Combinați filtrarea tabelului cu filtrarea legendei
Concepeți conținut semnificativ pentru tooltip
Standardizați nivelurile de zoom și modelele de navigare
Testați toate fluxurile de interacțiune de la un capăt la altul

Integrare avansată ✨

Utilizați lățimea proporțională pentru monitorizarea operațională
Combinați filtrarea legendelor cu analiza seriilor de timp
Conectați datele de flux cu analiza predictivă
Creați tablouri de bord multimodale complete
Integrarea cu imagini geografice utilizând filtrarea partajată

🚀 Sunteți gata să începeți? Acest vizual cuprinzător transformă diagramele statice în tablouri de bord digitale interactive cu navigare profesională, vizualizare inteligentă a fluxurilor, filtrare pe bază de categorii și informații contextuale bogate!