시작하기 - 디지털 트윈 시각화

환영합니다! 이 포괄적인 가이드는 고급 탐색, 대화형 범례, 비례 가장자리 너비, 향상된 도구 설명, 교차 필터링 및 드릴스루 기능을 갖춘 Power BI용 디지털 트윈 비주얼을 빠르게 시작하는 데 도움이 됩니다.

📋 포괄적인 기능 개요

🔍 향상된 탐색 기능 ✨

부드러운 애니메이션으로 유연한 줌 및 이동
전문적인 화면 내비게이션 컨트롤
뷰포트 표시기가 있는 실시간 미니맵
스마트 커서 피드백(잡기/잡기)
대형 다이어그램을 위한 CAD와 같은 정밀도

🎨 인터랙티브 레전드 시스템 ✨

실제 노드 색상의 동적 범례
범례 항목을 클릭하여 노드를 강조 표시합니다.
모든 범주형 필드에서 작동
교차 필터링 통합
카테고리별 노드 수 표시

📊 비례 가장자리 너비 ✨

흐름 강도에 따른 가장자리 두께 스케일
노드별 정규화 알고리즘
즉각적인 병목 현상 식별
포맷 창을 통해 켜기/끄기 토글
컨텍스트 흐름 시각화

💬 향상된 도구 설명 ✨

유연한 "키: 값" 노드 툴팁
스마트 엣지 툴팁 폴백 시스템
필드 이름으로 다중 필드 지원
자동 라벨 생성
이전 버전과 호환되는 디자인

🔄 고급 교차 필터링

테이블을 사용한 양방향 필터링
개별 노드/엣지 강조 표시
범례 기반 카테고리 필터링
다중 선택 지원
측정값으로 향상된 데이터 모델

🎯 Power BI 통합

앱소스 호환 컨텍스트 메뉴
풍부한 드릴스루 기능
체계적인 서식 창 컨트롤
하위 그룹을 통한 향상된 엣지 제어
전문가 선택 관리

📊 향상된 데이터 설정 및 요구 사항

⚠️ 중요: 최적의 성능을 위해 모든 데이터는 적절한 NULL 처리가 포함된 UNION 구조를 사용하여 단일 테이블에 있어야 합니다.

향상된 데이터 모델 구조

- 모든 새로운 기능으로 향상된 데이터 구조 ✨

선택 

    NodeId, 

    'Status: Running\nType: 기계\n온도: 85°C\n효율: 92%'를 노드툴팁으로 사용합니다,

    '달리기'를 LegendColor로, - 대화형 범례의 경우 ✨

    NULL은 EdgeId, NULL은 SourceId, NULL은 TargetId, NULL은 EdgeTooltip입니다,

    노드 값으로서의 효율성, - 교차 필터링의 경우

    NULL을 EdgeValue로

FROM 노드 테이블

모두 통합

선택 

    NodeId는 NULL, NodeTooltip은 NULL, LegendColor는 NULL입니다,

    에지아이디, 소스아이디, 타겟아이디,

    'Type: MaterialFlow\nIntensity: High\nPressure: 2.5 bar'를 EdgeTooltip으로, - 스마트 툴팁 ✨

    NULL을 노드 값으로 설정합니다,

    FlowIntensity를 EdgeValue로 - 교차 필터링 + 비례 폭 ✨

에지 테이블에서

향상된 데이터 역할 참조

필드	유형	상태	설명	예
SVG 콘텐츠	측정	✅ 필수	디지털 트윈 다이어그램이 포함된 SVG 마크업	...
NodeId	카테고리	✅ 필수	각 노드에 대한 고유 식별자	M1001, B1201, T1101
노드 툴팁	카테고리	✨ 강화됨	"Key: 값" 여러 줄 도구 설명 형식	상태: 실행 중\n유형: 기계\n효율: 92%
범례 색상(선택 사항)	카테고리	✨ 신규!	대화형 범례 생성을 위한 범주 필드	실행, 유지보수, 오프라인
노드 값	측정	🔄 향상된	교차 필터링 노드에 대한 비즈니스 지표	85.4, 92.1, 79.8
EdgeId	카테고리	❌ 선택 사항	각 엣지에 대한 고유 식별자	E1001, E1002
SourceId	카테고리	❌ 선택 사항	에지용 소스 노드	M1001
TargetId	카테고리	❌ 선택 사항	에지 대상 노드	M1002
엣지 툴팁(선택 사항)	카테고리	✨ 신규!	스마트 폴백 시스템을 갖춘 다중 필드 도구 설명	여러 필드 지원
에지 값	측정	🔄 향상된	교차 필터링을 위한 흐름 강도 + 비례 폭	85.0, 150.5, 89.1

⚙️ 종합 구성 가이드

1단계: SVG 콘텐츠 준비

SVG 측정값을 만듭니다: SVG에 고유한 마크업이 포함된 유효한 마크업이 포함되어 있는지 확인합니다. id 속성
ID를 일치시킵니다: NodeId 값은 SVG 요소와 일치해야 합니다. id 속성을 정확하게
깨끗한 구조: 일관된 크기 조정을 사용하고 복잡한 변환을 피하세요.
중성 색상: 무채색 SVG 색상을 사용하여 시각적으로 색상을 제어합니다.
엣지 레디 디자인: 너비 비례 배율과 잘 작동하도록 가장자리 경로 디자인하기

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

"

2단계: 비주얼 다운로드 및 라이선스 삽입

📽️ 이 동영상에서는 AppSource에서 디지털 트윈 비주얼을 다운로드하고 라이선스를 활성화하는 방법을 알아봅니다.

비주얼 다운로드: MS 앱소스에서 디지털 트윈 비주얼을 다운로드하세요.
비주얼 추가: 보고서에 디지털 트윈 비주얼 삽입
라이선스를 삽입합니다: 라이선스 키를 라이선스 섹션 아래 비주얼 형식 지정

3단계: 데이터 가져오기

📽️ 이 동영상은 SVG 레이아웃을 준비하고 데이터 테이블을 구성하는 방법을 보여줍니다.

데이터 준비: 노드와 에지를 결합한 단일 데이터 테이블 만들기(위 참조)
데이터 가져오기: SVG(예: .txt 형식) 및 데이터 테이블(예: csv 형식)을 Power BI 필드로 가져옵니다.

4단계: 비주얼에 데이터 연결

📽️ 이 동영상에서는 데이터를 비주얼에 연결하고 탐색 및 다른 비주얼과의 상호 작용을 활성화하는 방법을 알아봅니다.

기본 데이터를 적용합니다: 각 시각화 창에서 SVG 콘텐츠, 노드 ID 및 에지 ID 필드를 드래그합니다.
향상된 데이터 추가: 범례 및 도구 설명 필드에 측정값을 추가하여 시각적 효과를 강화합니다.
교차 필터링을 구현합니다: 시각적 요소 전반에서 필터링이 작동하도록 NodeValue 및 EdgeValue 측정값을 포함하세요.
시각적 탐색: 줌 컨트롤, 미니 맵 또는 마우스 오버를 사용하여 시각적 탐색 기능을 테스트합니다.

5단계: 노드 사용자 지정

📽️ 이 동영상에서는 조건부 서식을 적용하여 노드 인사이트를 강조하는 방법에 대해 설명합니다.

간단한 노드 색칠: 에서 각 노드에 대해 선호하는 색상을 선택합니다. 노드 섹션 아래 비주얼 형식 지정
또는 조건부 서식을 적용합니다: 수식 아이콘을 클릭하여 노드에 색상을 지정하는 개별 규칙을 설정합니다.

6단계: 엣지 사용자 지정

📽️ 이 동영상에서는 흐름과 연결을 명확하고 동적으로 사용자 지정하는 방법에 대해 알아보세요.

그라디언트를 (선택 취소)합니다: 가장자리 색상을 위한 그라데이션 켜기/끄기 토글
형식 사용자 지정: 불투명도, 선 너비 또는 레이어 순서 조정하기
간단한 가장자리 색칠: 에서 각 가장자리에 대해 원하는 색상을 선택합니다. 엣지 섹션 아래 비주얼 형식 지정
또는 조건부 서식을 적용합니다: 수식 아이콘을 클릭하여 가장자리에 색상을 지정하는 개별 규칙을 설정합니다.

7단계: 고급 툴팁 만들기

📽️ 이 동영상에서는 마우스 오버를 통해 추가 컨텍스트를 표시하는 방법을 간단한 또는 고급 도구 설명과 함께 설명합니다.

기본 툴팁을 적용합니다: 필드를 도구 설명 섹션으로 드래그하여 기본 도구 설명을 적용합니다.
또는 고급 툴팁을 만듭니다: 차트, KPI 등이 포함된 사용자 지정 도구 설명 페이지 만들기
비주얼에 연결합니다: 툴팁 필드에 nodeID 또는 edgeID를 추가합니다.

8단계: 드릴스루 옵션 개발

📽️ 이 동영상에서는 노드 또는 엣지에 대한 심층 분석 페이지를 만드는 방법을 알아보세요.

상세 페이지 만들기: 보고서 페이지를 만들고 사용자 지정 시각 자료를 디자인하여 자세한 인사이트를 확인하세요.
비주얼에 연결합니다: 드릴스루 필드에 nodeID 또는 edgeID를 추가합니다.
드릴스루를 테스트합니다: 노드 또는 엣지를 마우스 오른쪽 버튼으로 클릭 → 드릴스루를 통해 세부 정보 보기

9단계: 고급 조건부 서식 적용

📽️ 이 동영상에서는 보다 명확한 우선순위 기반의 노드 및 가장자리 색상을 위해 결합된 측정값을 사용하여 규칙 기반 서식을 적용하는 방법을 알아봅니다.

결합된 측정값을 만듭니다: 여러 조건(예: 노드 상태 및 유형)을 반영하기 위해 결합된 측정값을 열로 만듭니다.
조건부 서식: 새 결합된 측정값을 기반으로 조건부 서식 지정 규칙을 설정합니다.
범례를 삽입합니다: 범례와 동일한 필드를 삽입하여 명확성 및 필터링을 개선합니다.

🎯 고급 기능 사용 가이드

🔍 향상된 탐색 및 줌 ✨

마우스 및 터치 상호작용

마우스 휠: 부드러운 애니메이션으로 스크롤하여 확대/축소하기
클릭하고 드래그합니다: 시각적 커서 피드백(잡기/잡기)으로 이동하기
내비게이션 컨트롤: 화면의 +, - 및 홈 버튼 사용
보기 재설정: 홈 버튼을 클릭하면 원래 보기로 원활하게 돌아갑니다.
미니맵 탐색: 미니맵을 클릭하여 다른 영역으로 이동
뷰포트 추적: 미니맵에서 실시간 뷰포트 사각형 보기

🎨 인터랙티브 레전드 시스템 ✨

범례 설정 및 사용법

설정: 범주형 필드를 "범례 색상(선택 사항)"으로 드래그합니다.
색상 읽기: 범례는 렌더링된 노드에서 실제 색상을 자동으로 읽습니다.
필터링하려면 클릭합니다: 범례 항목을 클릭하여 해당 노드를 강조 표시합니다.
시각적 피드백: 선택한 카테고리는 강조 표시되고 다른 카테고리는 흐리게 표시됨
크로스 비주얼: 범례 클릭으로 다른 시각적 요소에서 필터링 트리거하기
초기화: 같은 범례 항목을 다시 클릭하여 강조 표시를 지우려면 다음과 같이 하세요.

💡 프로 팁: 상태 모니터링, 카테고리 필터링, 노드 색상을 한눈에 파악하는 데 적합합니다.

📊 비례 가장자리 너비 ✨

흐름 기반 시각화

데이터 매핑: 흐름 강도/처리량을 엣지 값 필드에 매핑합니다.
기능 사용: 포맷 패널 > 가장자리 > 일반 > "비례 너비"
시각적 스케일링: 데이터 값에 따라 가장자리 두께가 자동으로 조정됩니다.
컨텍스트 스케일링: 노드별 정규화는 상대적 중요성을 보여줍니다.
병목 현상 ID: 흐름이 많은 연결을 즉시 식별
시각적 범위: 최소 1픽셀에서 최대 8픽셀 두께

💡 비즈니스 가치: 운영 대시보드에 사용하여 디지털 트윈에서 병목 현상과 처리량이 많은 연결을 즉시 파악하세요.

향상된 툴팁 시스템 ✨

유연한 툴팁 구성

노드 툴팁: "Key: 노드 도구 설명 필드에 "키: 값\n키2: 값2" 형식 사용
다중 회선 지원: 도구 설명 콘텐츠의 줄 바꿈에는 \n을 사용합니다.
엣지 툴팁: 여러 필드를 "가장자리 도구 설명(선택 사항)"으로 드래그합니다.
스마트 폴백: 지정한 사용자 지정 필드가 없는 경우 자동 기본 정보
필드 레이블: 필드 이름이 자동으로 도구 설명 레이블이 됩니다.
풍부한 콘텐츠: 운영 컨텍스트 및 비즈니스 메트릭 지원

🔄 고급 교차 필터링

3방향 필터링 시스템

표 ↔ 시각적: 표 행을 클릭하여 노드/엣지를 강조 표시합니다.
범례 ↔ 시각적: 범례 항목을 클릭하여 카테고리 강조 표시
시각적 ↔ 기타 시각적: 노드/엣지를 클릭하여 차트/표 필터링하기
다중 선택: Ctrl 키를 누른 상태에서 여러 요소를 클릭합니다.
선택 지우기: 빈 공간을 클릭하여 모든 선택 항목을 초기화합니다.
시각적 피드백: 강조 표시된 요소는 전체 불투명도, 다른 요소는 흐리게 표시

⚡ 고급 엣지 컨트롤

정리된 포맷 창

📁 가장자리 섹션:

🎨 가장자리 색상(하위 그룹): 개별 가장자리 색상 및 그라데이션 제어
⚙️ 일반(하위 그룹): 불투명도, 렌더링 순서 및 비례 너비

사용 가능한 컨트롤:

가장자리 그라데이션을 활성화합니다: 노드 간 부드러운 색상 전환
비례 너비: 흐름 기반 두께 스케일링
가장자리 불투명도: 투명도 제어(0-100%)
전경에 가장자리 표시: 레이어링 제어

🎯 드릴스루 설정

드릴스루 페이지 만들기: 전용 상세 페이지 설정
필터 필드 추가: 드릴스루 필터에 노드아이디/엣지아이디 포함하기
탐색을 테스트합니다: 드릴스루 옵션을 보려면 노드/엣지를 마우스 오른쪽 버튼으로 클릭하세요.
빈 공간 메뉴: 표준 Power BI 메뉴의 빈 영역을 마우스 오른쪽 단추로 클릭합니다.
컨텍스트 확인: 필터링된 컨텍스트가 올바르게 전달되었는지 확인

🔧 종합적인 문제 해결 가이드

❌ 향상된 탐색 문제 ✨

확대/축소 컨트롤 및 미니맵 표시 여부에 대한 서식 창 > 탐색 설정을 확인합니다.
탐색 컨트롤 및 미니맵을 위한 충분한 시각적 공간 확인
이동 작업 중 커서 피드백 테스트(잡기/잡기가 표시되어야 함)
확대/축소/이동 중에 미니맵 뷰포트 사각형이 올바르게 업데이트되는지 확인합니다.
다양한 화면 크기에서 반응형 동작 테스트

❌ 대화형 범례 문제 ✨

범주형 필드를 "범례 색상(선택 사항)"으로 드래그하여 확인합니다.
노드에 실제 색상이 있는지 확인(모든 기본 회색이 아닌)
범주형 데이터에 의미 있고 깨끗한 값이 포함되어 있는지 확인합니다.
강조 표시 동작에 대한 범례 클릭 기능 테스트
범례 위치가 주요 시각적 콘텐츠를 가리지 않는지 확인합니다.

❌ 비례 가장자리 너비 문제 ✨

포맷 패널 > 가장자리 > 일반에서 "비례 너비" 토글을 활성화합니다.
에지 값 필드에 숫자 흐름 데이터가 포함되어 있는지 확인합니다.
에지아이디, 소스아이디, 타겟아이디가 제대로 매핑되었는지 확인합니다.
엣지 데이터에 의미 있는 값의 변동이 있는지 확인
두께 스케일링이 시각적으로 적절한지 테스트

❌ 툴팁 문제 개선 ✨

노드 도구 설명 필드에 "Key: 값\n키2: 값2" 형식을 노드 도구 설명 필드에 사용합니다.
가장자리 툴팁의 경우 필드를 '가장자리 툴팁(선택 사항)' 섹션으로 드래그합니다.
에지 툴팁 필드가 지정되지 않은 경우 스마트 폴백 테스트
도구 설명 표시에서 필드 이름이 레이블로 표시되는지 확인합니다.
여러 줄의 콘텐츠가 적절한 줄 바꿈으로 표시되도록 합니다.

❌ 교차 필터링이 작동하지 않음

노드 값 및/또는 에지 값 측정값 필드 추가
측정값이 채워져 있는지 확인합니다(NULL/비어 있지 않음).
양방향 테스트: 표 → 시각적 및 시각적 → 표
범례 기반 필터링을 독립적으로 테스트
선택 트리거 하이라이트(불투명도 변경) 확인
먼저 간단한 단일 선택으로 테스트

시각적 미표시 ❌ 표시되지 않음

SVG 콘텐츠 측정값이 유효한 SVG 마크업을 반환하는지 확인합니다.
NodeId 필드가 매핑되어 있고 데이터가 포함되어 있는지 확인합니다.
SVG 요소 ID가 NodeId 값과 정확히 일치하는지 확인합니다.
온라인 SVG 유효성 검사기를 사용하여 SVG 구문 유효성 검사하기

❌ 대화형 노드가 아닌 노드

NodeId 데이터 역할이 채워졌는지 확인
SVG 요소에 일치하는 ID 속성이 있는지 확인합니다.
요소가 다른 SVG 요소에 의해 숨겨지지 않았는지 확인합니다.
요소 감지 확인을 위한 호버 효과 테스트

❌ 가장자리가 표시되지 않음

EdgeId, SourceId 및 TargetId 데이터 역할 매핑하기
소스아이디/타겟아이디 값이 기존 노드아이디 값과 일치하는지 확인합니다.
가장자리 불투명도 설정 확인(너무 낮게 설정되었을 수 있음)
엣지 렌더링 순서 확인(전경 대 배경)
먼저 고대비 가장자리 색상으로 테스트

🎉 고급 모범 사례

향상된 데이터 모델링 ✨

대화형 범례에 의미 있는 범주형 필드를 선택합니다.
"키: 값" 형식 사용
비례 에지 너비에 흐름 메트릭 사용
UNION 구조에서 적절한 NULL 처리 보장
실제 데이터 볼륨으로 테스트

성능 및 탐색 ✨

대형 다이어그램 탐색을 위한 미니맵 활용
부드러운 줌/팬을 위한 SVG 복잡성 최적화
실제 흐름 데이터로 비례 폭 테스트하기
향상된 기능으로 메모리 사용량 모니터링
교차 필터링을 위해 전략적으로 측정값 필드 사용

사용자 경험 ✨

카테고리 기반 필터링에 범례 클릭 사용
테이블 필터링과 범례 필터링 결합하기
의미 있는 툴팁 콘텐츠 디자인
확대/축소 수준 및 탐색 패턴 표준화
모든 인터랙션 워크플로우를 엔드투엔드 테스트

고급 통합 ✨

운영 모니터링에 비례 폭 사용
범례 필터링과 시계열 분석의 결합
흐름 데이터를 예측 분석과 연결
포괄적인 멀티모달 대시보드 만들기
공유 필터링을 사용하여 지리적 시각 자료와 통합하기

🚀 시작할 준비가 되셨나요? 이 포괄적인 비주얼은 정적 다이어그램을 전문적인 탐색, 지능형 흐름 시각화, 카테고리 기반 필터링 및 풍부한 컨텍스트 정보를 갖춘 대화형 디지털 트윈 대시보드로 변환합니다!