[spotfire advance] 4.1. spotfire의 HTML 활용 - page 이동버튼 만들기, 버튼 모습 바꾸기

안녕하세요 꾸미니 입니다.

spotfire 어려웡... 그냥 아무 생각없이 따라할 수 있게 해줘이잉~

특수상황에서 그대로 따라하면 되는 무념무상 또는 적당히 응용해서 사용하면 되는 자료입니다!

​

---------------------------------------------------------

page 이동하는 버튼 만들기​

1. 오른쪽 패널 visualization types - text area

2. text area 우클릭 - edit text area - insert action control 아이콘 클릭

3. actions - pages and visualizations - 이동을 원하는 page 클릭

​

설명 : text area에서는 시각화 차트 이외의 다양한 기능을 수행하는 기능들의 바탕이 되는 보드(board) 역할을 합니다. text area 를 만들고 그 위에 page 이동 action 버튼을 만들었습니다. page 이동 외에 다른 기능을 붙이면 다른 기능을 하는 버튼을 만들 수 있습니다.

---------------------------------------------------------

​

​

---------------------------------------------------------

버튼 모습 바꾸기​

1. text area 우클릭 - edit HTML

2. 아래 코드 복붙

<STYLE>

.sfc-action-button{

color :#ffffff !important;

font-size : 14px !important;

padding : 3px !important;

border : 1px solid #ffffff !important;

background :#747a7e !important;

}

.sfc-action-button:hover{

color :#000000 !important;

background :#748bfb !important;

}

</STYLE>

3. save 아이콘 클릭

​

설명 : 만들어진 버튼의 스타일(모습)을 바꾸는 작업입니다. edit text area는 매우 좁은 범위의 스타일만을 제공하기 때문에 HTML을 이용해 스타일을 상세히 넣을 수 있습니다. HTML을 사용하신 분들은 아시겠지만, .sfc-action-button은 일반 상태에서의 버튼의 모습을 정의하는 곳이고, .sfc-action-button:hover는 마우스를 버튼 위에 올려 놓았을 떄의 모습을 정의하는 곳입니다. 색상과 간격을 다르게 하고 싶다면, 코드 내에서 색 코드를 검색해서 바꾸거나 px 사이즈를 변경하여 간격을 변경할 수 있습니다.

---------------------------------------------------------