Krpano 뷰어를 HTML 페이지에 삽입하려면 핵심 'krpano.js' 스크립트 파일(파일 이름은 다를 수 있음)을 포함해야 하며
embedpano() 함수를 호출해야 한다. embedpano 함수는 브라우저 지원을 감지해서 사용할 krpano 뷰어(krpano HTML5 또는 krpano Flash 뷰어)를 결정한다. Krpano Flash 뷰어를 사용하는 경우, 내장 스크립트는 Flashplayer 및 각종 브라우저 결정사항과 해결 방법(예: 지원되지 않는 시스템에서 Flash 내부의 마우스 휠 사용 활성화)도 적용되며, 이것은 krpano 뷰어를 임베딩 하는 것을 쉽고 간단하게 해줍니다 - 단 하나의 스크립트와 단 한 줄의 임베딩 코드면 충분합니다.
krpano 스크립트 파일은 HTML 문서(embedpano() 사용 전에) 어느 곳이든 한 번은 작성돼 있어야 합니다:
<script src="krpano.js"></script>
몇가지 세부 사항 및 참고사항:
'krpano.js' 파일 이름은 다르게 지어질 수 있습니다 - 예를 들면 MAKE PANO 또는 MAKE VTOUR 배치파일을 사용하면 각 타입에 맞게 'pano.js' 또는 'tour.js'로 생성됩니다..
파일은 두가지 파트를 포합하고 있습니다- krpano 임베딩 스크립트와 krpano HTML5 뷰어입니다.
krpano Flash 뷰어는 외부에 파일로 분리되어 있습니다(예 'krpano.swf' 파일).
파일은 늘 동일합니다, 어떠한 파노라마나 투어에 관한 정보도 포함하지 않습니다,이것은 여러개의 파노라마 / 투어 또는 프로젝트에 공유할 수 있다는 것을 의미합니다.
예를 들어 나중에 업데이트를 쉽게 하려면 krpano 뷰어와 플러그인 파일을 글로벌 폴더로 통일하고 다른 모든 프로젝트 파일은 링크로 연결하면 됩니다. 이렇게 하면 나중에 글로벌 krpano 폴더의 파일들만 업데이트하면 모든 프로젝트를 업데이트 할 수 있습니다.
embedpano() 함수는 인수로 자바스크립트 객체를 필요로 합니다.
이 객체는 한쌍의 파라미터이름:값을 사용하여 모든 파라미터(임의 순서로)를 전달하는 데에 사용된다.
거의 모든 파라미터(target 파라미터 제외)는 선택 사항이다 - 정의되지 않은 경우에는 기본값이 사용된다.
auto - 기본 설정 - krpano HTML5 뷰어를 자동으로 사용.
이 설정은, 가능하다면 krpano HTML5 뷰어를 기본으로 사용 합니다(1.19 버전 이후 부터, 이전 버전은 Flash 뷰어가 기본이었음)!
HTML5가 가능하지 않다면 Flash 뷰어로 대체해서 사용됩니다.
prefer - 가능한 경우 krpano HTML5 뷰어를 우선적으로 사용하고 그렇지 않은 경우에 Flash 뷰어 사용(1.19 버전부터 auto와 동일).
fallback - 가능한 경우 krpano Flash 뷰어를 우선적으로 사용.
Flash를 사용하지 못할 경우에만 krpano HTML5 뷰어로 대체해서 사용.
only - krpano HTML5 뷰어만 사용 - krpano Flash 뷰어는 사용하지 않습니다.
이 설정은, 가능한 경우 krpano HTML5 뷰어를 사용합니다.
시스템/브라우저가 HTML5를 지원하지 않는 경우 오류 메세지가 나타납니다.
always - 시스템과 브라우저가 필요한 기능을 지원하는지 여부에 관계없이 항상 krpano HTML5 뷰어를 사용합니다! 주의 - 이 설정은 내부적인 테스트에만 사용하고 절대로 인터넷용으로 사용하지 마십시오!
never - krpano HTML5 뷰어는 사용하지 않고 krpano Flash 뷰어만 사용하게 합니다.
부가적 확장 설정 (렌더링 방법을 제어하기 위함):
+webgl - WebGL을 사용할 수 있을 경우에만 krpano HTML5 뷰어를 사용합니다
주의 - 일부 기능은 WebGL을 사용할 수 있을 때만 가능합니다 - 예. 파노라믹-비디오-지원t,
WebVR-지원, 스테레오-렌더링,
구형 또는 원기둥형 이미지, 왜곡해서 보여줌 (어안, 소행성), ...
+css3d - WebGL 방식의 렌더링 대신에 CSS3D 방식의 렌더링을 우선적으로 사용합니다 (기본적으로 WebGL 사용 가능할 경우 준비됩니다).
css3d설정은 내부적인 테스트에만 사용하고 절대로 인터넷용으로 사용하지 마십시오!
사용 예제:
prefer+webgl - WebGL이 가능한 경우 krpano HTML5 뷰어를 사용하고 그렇지 않은 경우에는 Flash 뷰어를 사용.
only+webgl - WebGL이 가능한 경우 krpano HTML5 뷰어를 사용하고 그렇지 않은 경우에는 에러 메세지를 보여줍니다.
prefer - 가능한 경우에 krpano Flash 뷰어를 우선으로 사용합니다.
krpano HTML5 뷰어는 단지 Flashplayer가 없고 시스템/브라우저가 HTML5에 호환될 경우에만 사용됩니다.
이 설정은 html5=fallback과 연결됩니다.
fallback - 가능한 경우에 krpano HTML5 뷰어를 우선으로 사용합니다. krpano Flash 뷰어는 단지 HTML5를 사용할 수 없을 경우에만 대체해서 사용됩니다.
이 설정은 html5=prefer와 연결됩니다.
only - 오로지 Flash 뷰어만 사용합니다 - krpano HTML5 뷰어는 사용하지 않습니다.
이 설정은, 가능한 경우 krpano Flash 뷰어를 사용합니다.
Flashplayer가 없는 경우에는 에러 메세지가 나타납니다.
이 설정은 html5=never와 연결됩니다.
never - krpano Flash 뷰어는 사용하지 않고 krpano HTML5 뷰어만 사용하게 합니다.
이 설정은 html5=only와 연결됩니다.
window - Flashplayer 기본, 시스템 지원과 성능간의 절충.
주의 - 이 모드에서 일부 시스템과 브라우저의 html 요소는 Flashplayer와 겹쳐질 수 없습니다!
자세한 내용은 wmode 링크를 참고하십시오..
opaque - 모든 다른 html 요소를 Flashplayer와 겹칠 수 있습니다 (이 설정은 시스템과 브라우저에 따라서 다소 느려지거나 렌더링 속도를 다운시킬 수 있습니다).
opaque-flash - opaque와 같지만 Flashplayer에만 해당합니다 (HTML5 뷰어는 제외합니다 - HTML5 에 관한 내용은 아래를 참고하세요).
transparent - Flashplayer 배경을 투명하게 만들어서 html 요소가 배경에 깔려 보여지게 해주며 부가적으로 다른 html 요소가 Flashplayer와 겹칠 수 있게 해줍니다
(이 설정은 시스템과 브라우저에 따라서 다소 느려지거나 렌더링 속도를 다운시킬 수 있습니다).
transparent-flash - transparent와 같지만 Flashplayer에만 해당합니다 (HTML5 뷰어는 제외합니다 - HTML5 에 관한 내용은 아래를 참고하세요).
direct - 가장 좋은 성능, 하드웨어 가속 프리젠테이션, 많은 시스템과 브라우져에서 html 요소와 겹치게 할 수 없습니다 (이 설정은 통상적으로 가장 빠른 모드지만 호환성이 떨어지거나 오래된 시스템과 브라우저에서는 속도를 저하시키는 요인이 될 수 있습니다).
krpano는 wmode=direct를 기본으로 하지만, Chrome 브라우저는 예외 - wmode=window를 기본으로 사용(보다 나은 성능과 윈도우 크기를 변경하는 동안 나타나는 블랙 화면 현상을 없애기 위함).
HTML5 참고: wmode 설정은 통상 Flashplayer에 관한 설정입니다,
그러나 wmode=opaque와 wmode=transparent는 krpano HTML5 뷰어에도 유효하며 뷰어 배경을 투명하게 만들어 줍니다. html 요소와 겹치게 배열하는 것 역시 HTML5 뷰어에서 가능합니다.
embedpano({target:"krpanoDIV", onready:krpanoReady});
function krpanoReady(krpano)
{
krpano.call("trace(krpano is ready...)");
}
Flashplayer 참고: 이 함수는 Flashplayer의 외부 인터페이스를 필요로 합니다! 이것은
오프라인/로컬에서 콜-백이 실행되려면 Flashplayer의 보안설정이 조정된 경우에만 가능하다는 것을 의미합니다. 자세한 내용은 링크를 참고하십시오- 로컬 / 오프라인 사용.