Začínáme - Digital Twin Visual

Vítejte! Tento komplexní průvodce vám pomůže rychle začít pracovat s vizuální aplikací Digital Twin pro Power BI, která obsahuje pokročilou navigaci, interaktivní legendu, proporcionální šířku okrajů, vylepšené popisky nástrojů, křížové filtrování a možnost procházení.

📋 Komplexní přehled funkcí

🔍 Vylepšená navigace ✨

Plynulé přibližování a posouvání s plynulými animacemi
Profesionální ovládání navigace na obrazovce
Minimapa v reálném čase s indikátorem průhledu
Inteligentní zpětná vazba kurzoru (grabování/chytání)
Přesnost podobná CADu pro velké diagramy

🎨 Interaktivní systém legend ✨

Dynamická legenda ze skutečných barev uzlů
Kliknutím na položky legendy zvýrazníte uzly
Pracuje s jakýmkoli kategoriálním polem
Integrace křížového filtrování
Zobrazení počtu uzlů pro jednotlivé kategorie

📊 Proporcionální šířka hrany ✨

Tloušťka hrany se mění s intenzitou proudění
Normalizační algoritmus pro jednotlivé uzly
Okamžitá identifikace úzkého místa
Přepínání zapnutí/vypnutí pomocí panelu formátování
Kontextová vizualizace toku

💬 Vylepšené popisky nástrojů ✨

Flexibilní "Klíč: Popisky uzlů "Value
Inteligentní systém zpětného tipu na okraji
Podpora více polí s názvy polí
Automatické generování štítků
Zpětně kompatibilní design

🔄 Pokročilé křížové filtrování

Obousměrné filtrování pomocí tabulek
Zvýraznění jednotlivých uzlů/hran
Filtrování kategorií na základě legendy
Podpora více výběrů
Vylepšený datový model s opatřeními

🎯 Integrace s Power BI

Kontextové nabídky kompatibilní s aplikací AppSource
Bohaté možnosti vrtání
Organizované ovládací prvky podokna formátu
Vylepšené ovládání okrajů pomocí podskupin
Profesionální řízení výběru

📊 Rozšířené nastavení a požadavky na data

⚠️ Důležité: Pro optimální výkon musí být všechna data v jedné tabulce s použitím struktury UNION a správným zpracováním NULL.

Vylepšená struktura datového modelu

- Vylepšená struktura dat se všemi novými funkcemi ✨

VYBRAT 

    NodeId, 

    "Stav: Stav: Running\nType: Teplota: 85°C\nÚčinnost: 92%' jako NodeTooltip,

    'Running' jako LegendColor, - Pro interaktivní legendu ✨

    NULL jako EdgeId, NULL jako SourceId, NULL jako TargetId, NULL jako EdgeTooltip,

    Efektivita jako NodeValue, - Pro křížové filtrování

    NULL jako EdgeValue

FROM NodesTable

UNION ALL

VYBRAT 

    NULL jako NodeId, NULL jako NodeTooltip, NULL jako LegendColor,

    EdgeId, SourceId, TargetId,

    "Typ: Typ: MaterialFlow\nIntensity: Tlak: 2,5 baru' jako EdgeTooltip, - Chytré popisky nástrojů ✨

    NULL jako NodeValue,

    FlowIntensity jako EdgeValue - Cross-filtering + proporcionální šířka ✨

FROM EdgesTable

Odkaz na rozšířené datové role

Pole	Typ	Stav	Popis	Příklad
Obsah SVG	Opatření	✅ Vyžadováno	Značka SVG obsahující diagram digitálního dvojčete	...
NodeId	Kategorie	✅ Vyžadováno	Jedinečný identifikátor každého uzlu	M1001, B1201, T1101
Nápověda k uzlu	Kategorie	✨ Vylepšené	"Klíč: Víceřádkový formát nápovědy	Stav: Spuštěno\Typ: Výkon: 92%
Barva legendy (volitelná)	Kategorie	✨ Novinka!	Kategoriální pole pro interaktivní generování legendy	Spuštění, Údržba, Offline
Hodnota uzlu	Opatření	🔄 Vylepšené	Obchodní metriky pro křížové filtrování uzlů	85.4, 92.1, 79.8
EdgeId	Kategorie	❌ Volitelné	Jedinečný identifikátor každé hrany	E1001, E1002
SourceId	Kategorie	❌ Volitelné	Zdrojový uzel pro hrany	M1001
TargetId	Kategorie	❌ Volitelné	Cílový uzel pro hrany	M1002
Nápověda k okrajům (volitelné)	Kategorie	✨ Novinka!	Nápověda k více polím s inteligentním systémem zpětného výběru	Podpora více polí
Hodnota hrany	Opatření	🔄 Vylepšené	Intenzita proudění pro křížovou filtraci + proporcionální šířka	85.0, 150.5, 89.1

⚙️ Komplexní průvodce konfigurací

Krok 1: Příprava obsahu SVG

Vytvoření opatření SVG: Ujistěte se, že vaše SVG obsahuje platné značky s jedinečnými id atributy
ID zápasů: Hodnoty NodeId musí odpovídat prvku SVG id atributy přesně
Čistá struktura: Používejte konzistentní velikost a vyhněte se složitým transformacím
Neutrální barvy: Použijte neutrální barvy SVG; nechte vizuální kontrolu nad barevností
Design připravený na hrany: Navrhování okrajových cest tak, aby dobře fungovaly s proporcionálním měřítkem šířky

Obsah 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’/>

"

Krok 2: Konfigurace aplikace Basic Visual

Přidat vizuální: Vložení vizuálu digitálního dvojčete do zprávy
Obsah mapy SVG: Přetáhněte měřítko SVG do pole "Obsah SVG".
Mapa NodeId: Přetáhněte identifikátor uzlu do pole "NodeId".
Testování základní funkčnosti: Ověřte, zda jsou uzly klikací a zda funguje hover.

Krok 3: Povolení rozšířených funkcí ✨

🎨 Nastavení interaktivní legendy

Přidání pole Legenda: Přetáhněte kategorické pole na "Barva legendy (volitelné)".
Automatické generování: Legenda automaticky načítá aktuální barvy uzlů
Test interakce: Kliknutím na položky legendy zvýrazníte uzly
Ověřit zobrazení: Počet kontrolních uzlů se zobrazí pro každou kategorii

💬 Vylepšené nastavení popisků nástrojů

Ouška uzlů: Použijte "Klíč: Klíč2: Hodnota2" v poli Node Tooltip
Ukazatele nástrojů na okrajích: Přetáhněte více polí do "Edge Tooltip (volitelné)"
Obsah testu: Najetím na uzly/hrany ověříte bohaté popisky nástrojů
Ověřte štítky: Zajistit, aby se názvy polí zobrazovaly jako popisky nástrojů

📊 Nastavení proporcionální šířky hrany

Přidat data toku: Mapování hodnot propustnosti/intenzity do pole Edge Value
Přidání okrajových polí: Zahrnout EdgeId, SourceId, TargetId pro vizualizaci
Povolení funkce: Podokno Formát > Hrany > Obecné > Přepnout "Proporcionální šířka"
Testovací škálování: Ověření stupnic tloušťky hran s hodnotami dat

🔍 Pokročilé nastavení navigace

Povolení ovládacích prvků: Podokno Formát > Navigace > Povolit ovládací prvky zvětšení
Povolení minimální mapy: Přepínání minimapy pro navigaci ve velkých diagramech
Testovací navigace: Přiblížení kolečkem myši, posouvání kliknutím a tažením
Ověřit zpětnou vazbu: Kontrola změn kurzoru během operací posunu

🔄 Pokročilé nastavení křížového filtrování

Přidat pole měření: Zahrnout opatření NodeValue a EdgeValue
Vytvořit tabulky: Přidání vizualizace tabulky se stejnými daty pro filtrování
Filtrování testovací tabulky: Kliknutím na řádky tabulky zvýrazníte prvky
Filtrování testovací legendy: Klikněte na položky legendy pro filtrování kategorií
Testování vizuálního filtrování: Kliknutím na uzly/hrany můžete filtrovat další vizuální prvky.

✅ Konfigurace dokončena: Nyní byste měli mít plně interaktivní digitální dvojče s pokročilou navigací, interaktivní legendou, proporcionální šířkou okrajů, vylepšenými tipy a rozsáhlými možnostmi křížového filtrování.

🎯 Průvodce používáním pokročilých funkcí

🔍 Vylepšená navigace a zoom ✨

Interakce s myší a dotykem

Kolečko myši: Posouvání pro zvětšení/zmenšení s plynulými animacemi
Kliknutí a přetažení: Posouvání s vizuální zpětnou vazbou kurzoru (uchopení/chytání)
Ovládání navigace: Použití tlačítek +, - a tlačítka Domů na obrazovce
Obnovení zobrazení: Kliknutím na tlačítko domů se plynule vrátíte do původního zobrazení.
Navigace na minimální mapě: Kliknutím na minimapu můžete přejít do různých oblastí
Sledování na obrazovce: Sledování obdélníku viewportu v reálném čase na minimapě

🎨 Interaktivní systém legend ✨

Nastavení a používání legendy

Nastavení: Přetáhněte libovolné kategorické pole do pole "Barva legendy (volitelné)".
Čtení barev: Legenda automaticky načítá skutečné barvy z vykreslených uzlů
Klikněte na tlačítko Filtrovat: Kliknutím na položky legendy zvýrazníte odpovídající uzly
Vizuální zpětná vazba: Vybrané kategorie jsou zvýrazněné, ostatní jsou ztlumené
Cross-Visual: Kliknutí na legendu spustí filtrování v jiných vizuálech
Obnovení: Kliknutím na stejnou položku legendy znovu zrušíte zvýraznění

💡 Tip pro profesionály: Je ideální pro sledování stavu, filtrování kategorií a přehledné zobrazení barev uzlů.

📊 Proporcionální šířka hrany ✨

Vizualizace založená na toku

Mapování dat: Mapování intenzity/průtoku na pole Edge Value
Povolení funkce: Podokno Formát > Hrany > Obecné > "Proporcionální šířka"
Vizuální škálování: Tloušťka hran se automaticky škáluje podle hodnot dat
Kontextové škálování: Normalizace na uzel ukazuje relativní důležitost
ID úzkého místa: Okamžitá identifikace připojení s vysokým průtokem
Zorný úhel: minimální tloušťka 1px až maximální tloušťka 8px

💡 Business Value: Použijte je pro provozní řídicí panely, abyste okamžitě zjistili úzká místa a vysoce propustná spojení ve svém digitálním dvojčeti.

💬 Vylepšený systém nápověd ✨

Flexibilní konfigurace nápovědy k nástrojům

Ouška uzlů: Použijte "Klíč: Klíč2: Hodnota2" v poli Node Tooltip
Podpora více linek: Použití \n pro zalomení řádku v obsahu nápovědy k nástroji
Ukazatele nástrojů na okrajích: Přetáhněte více polí do "Edge Tooltip (volitelné)"
Chytrá záloha: Automatické základní informace, pokud nejsou zadána žádná vlastní pole
Štítky polí: Názvy polí se automaticky stanou popisky nástrojů
Bohatý obsah: Podpora provozních souvislostí a obchodních ukazatelů

🔄 Pokročilé křížové filtrování

Třícestný filtrační systém

Tabulka ↔ Vizuální: Kliknutím na řádky tabulky zvýrazníte uzly/hrany.
Legenda ↔ Vizuální: Kliknutím na položky legendy zvýrazníte kategorie
Vizuální ↔ Další vizuální efekty: Kliknutím na uzly/hrany můžete filtrovat grafy/tabulky
Výběr z více možností: Podržte klávesu Ctrl a klikněte na více prvků
Jasný výběr: Kliknutím na prázdné místo obnovíte všechny výběry
Vizuální zpětná vazba: Zvýrazněné prvky plně kryté, ostatní ztlumené

⚡ Pokročilé ovládání hran

Podokno uspořádaného formátu

📁 Hrany Sekce:

🎨 Barvy hran (podskupina): Individuální barvy okrajů a ovládání gradientu
⚙️ Obecné (podskupina): Neprůhlednost, pořadí vykreslování a proporcionální šířka

Dostupné ovládací prvky:

Povolit gradient okrajů: Plynulé barevné přechody mezi uzly
Proporcionální šířka: Měřítko tloušťky na základě průtoku
Neprůhlednost okrajů: Ovládání průhlednosti (0-100%)
Zobrazit okraje v popředí: Ovládání vrstvení

🎯 Nastavení průvlaku

Vytvoření průchozích stránek: Nastavení vyhrazených stránek s podrobnostmi
Přidání polí filtru: Zahrnutí NodeId/EdgeId do filtrů pro procházení
Testovací navigace: Kliknutím pravým tlačítkem myši na uzly/hrany se zobrazí možnosti průchodu.
Prázdné místo Menu: Kliknutí pravým tlačítkem myši na prázdné oblasti pro standardní nabídku Power BI
Ověřit kontext: Zajištění správného předání filtrovaného kontextu

🔧 Komplexní průvodce řešením problémů

❌ Vylepšené problémy s navigací ✨

Zkontrolujte podokno Formát > Nastavení navigace pro ovládací prvky zoomu a viditelnost minimapy.
Ověřte dostatečný vizuální prostor pro navigační ovládací prvky a minimapu.
Testování zpětné vazby kurzoru během operací panorámování (mělo by se zobrazit uchopení/chytání)
Zajištění správné aktualizace obdélníku zobrazení minimapy při přiblížení/posunutí
Otestujte na různých velikostech obrazovky, zda se chová responzivně

❌ Interaktivní problémy s legendou ✨

Ověřte, zda je kategorické pole přetaženo na "Barva legendy (volitelné)".
Zkontrolujte, zda mají uzly skutečné barvy (ne všechny výchozí šedé).
Zajistěte, aby kategorická data obsahovala smysluplné a čisté hodnoty.
Testování funkčnosti kliknutí na legendu pro zvýraznění chování
Ověřte, zda umístění legendy nepřekáží hlavnímu vizuálnímu obsahu.

❌ Proporcionální problémy s šířkou okraje ✨

Povolení přepínače "Proporcionální šířka" v podokně Formát > Hrany > Obecné
Zajistěte, aby pole Edge Value obsahovalo číselné údaje o toku.
Zkontrolujte, zda jsou správně namapovány EdgeId, SourceId a TargetId.
Ověřte, zda data na okraji mají smysluplnou variabilitu hodnot.
Test, zda je tloušťkové měřítko vizuálně vhodné

❌ Vylepšené problémy s tipy nástrojů ✨

Použijte "Klíč: Klíč2: Hodnota2" pro pole Node Tooltip
Pro okrajový nápis přetáhněte pole do části "Okrajový nápis (volitelný)".
Testování inteligentního zpětného přístupu, když nejsou zadána žádná pole Edge Tooltip
Zkontrolujte, zda se názvy polí zobrazují jako popisky v zobrazení nápovědy k nástrojům.
Zajistěte, aby se víceřádkový obsah zobrazoval se správným zalomením řádků.

❌ Nefunguje křížové filtrování

Přidání polí měření Hodnota uzlu a/nebo Hodnota okraje
Zkontrolujte, zda jsou hodnoty měření vyplněny (ne NULL/prázdné).
Testujte oba směry: tabulka → vizuální a vizuální → tabulka
Nezávislé testování filtrování na základě legendy
Ověřte, zda výběr vyvolá zvýraznění (změny krytí).
Nejprve otestujte jednoduchým výběrem

❌ Vizuální nezobrazení

Zkontrolujte, zda měření obsahu SVG vrací platné značky SVG
Ověřte, zda je pole NodeId namapováno a obsahuje data
Zajištění přesné shody ID prvků SVG s hodnotami NodeId
Ověření syntaxe SVG pomocí online validátoru SVG

❌ Uzly nejsou interaktivní

Potvrzení, že datová role NodeId je vyplněna
Kontrola, zda mají prvky SVG odpovídající atributy id
Ověřte, zda prvky nejsou skryty jinými prvky SVG.
Testování efektů při najetí myší pro potvrzení detekce prvků

❌ Okraje nejsou vidět

Mapování datových rolí EdgeId, SourceId a TargetId
Zkontrolujte, zda hodnoty SourceId/TargetId odpovídají stávajícím hodnotám NodeId.
Zkontrolujte nastavení krytí okrajů (může být nastaveno příliš nízko).
Ověření pořadí vykreslování okrajů (popředí vs. pozadí)
Nejprve otestujte vysoce kontrastní barvy okrajů

🎉 Pokročilé osvědčené postupy

Rozšířené modelování dat ✨

Výběr smysluplných kategoriálních polí pro interaktivní legendu
Strukturovat popisky nástrojů pomocí "Klíč: Hodnota"
Použití metrik toku pro proporcionální šířku hrany
Zajištění správného zpracování NULL ve struktuře UNION
Testování s reálnými objemy dat

Výkon a navigace ✨

Využití minimapy pro navigaci po rozsáhlých diagramech
Optimalizace složitosti SVG pro plynulé zvětšování/posunování
Test proporcionální šířky s reálnými údaji o průtoku
Sledování využití paměti pomocí rozšířených funkcí
Strategické použití polí měření pro křížové filtrování

Zkušenosti uživatelů ✨

Použití kliknutí na legendu pro filtrování podle kategorií
Kombinace filtrování tabulky s filtrováním legendy
Navrhování smysluplného obsahu nápovědy
Standardizace úrovní přiblížení a navigačních vzorů
Testování všech pracovních postupů interakce end-to-end

Pokročilá integrace ✨

Použití proporcionální šířky pro provozní monitorování
Kombinace filtrování legend s analýzou časových řad
Propojení dat o průtoku s prediktivní analýzou
Vytváření komplexních multimodálních řídicích panelů
Integrace s geografickými vizualizacemi pomocí sdíleného filtrování

🚀 Jste připraveni začít? Tento komplexní vizuál mění statické diagramy na interaktivní digitální dvojčata s profesionální navigací, inteligentní vizualizací toků, filtrováním podle kategorií a bohatými kontextovými informacemi!