동적 대시보드 프론트엔드 개발 명세

소개글

"동적 대시보드 프론트엔드 개발 명세"에 대한 내용입니다.

목차

1. 개요
2. 업데이트 요약
3. 구현: 스타일시트 동적 로딩
4. 구현: 오브젝트 필터
5. 구현: 키프레임 설명자를 이용한 회전 효과
6. 구현: 프리셋을 이용한 조건에 따른 효과 변화
7. 구현: 브라우저에서 표시되는 벡터 객체의 축좌표 계산
8. 구현: 다중 패널 지원
9. 적용: 컴파일 및 설치 방법

본문내용

1. 개요
본 문서는 의 대시보드에서 를 다루기 위해 개발된 플러그인의 추가 개발에 Grafana SVG 고려된 기술적 내용을 담았다.

2. 업데이트 요약
- : 'something' . 오브젝트 필터 적용 객체 클래스에 이 적용된 객체만 리스트로 보냄
- : 'Reverse' . 역방향 회전 적용 패널 옵션에서 각 객체 항목의 체크박스 선택
- 다중 패널 지원 다중 패널을 추가해도 정상적으로 동작하도록 개선 : .
- SVG : , . 개발 문서 작성 객체 축좌표 계산 애니메이션 키프레임 설명자 등의 내용이 담김

3. 구현 스타일시트 동적 로딩 :
CSS3 (CSS) 에서 지원하는 스펙 사항을 플러그인에서 활용하기 위해 스타일시트를 동적으로 요청할 필요성이 있다 를 이용하는 아래 구문으로 의 동적 로드가 가능하다

CSS ( 1 를 동적으로 로드해야 할 시에는 브라우저에 캐시로 남지 않도록 만료 기간을 회성으로 하기 위해 랜덤 값 생성 함수를 같이 이용하여야 한다 아래와 같은 랜덤 함수를 사용하면 된다 랜덤 함수는 플러그인에서 상당히 많은 부분에 중요한 역할을 한다

참고 자료

없음