웹 | 파노라마(360도 사진) 간단하게 넣는법
페이지 정보
작성자 오규진 조회19,379회 댓글0건본문
JS기반인 Pannellum를 사용하여 파노라마 이미지를 간단하게 등록하는 방법입니다.
사용을 하기 위해서는 css와 js파일을 연결해야됩니다.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.css"/>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.js"></script>
위 두 줄을 추가해주시면 됩니다.
그리고 아래의 소스를 추가하면 됩니다.
------------<<<추가할 소스>>>----------------
div class="icon_360" id="pano_div"></div>
<script>
const pano_img = '이미지경로';
pannellum.viewer('pano_div', {
"type": "equirectangular",
"panorama": pano_img,
"autoLoad": true
});
</script>
---------------------------------------------------
좀 더 자세한 내용은
https://pannellum.org/documentation/reference/ 에서 참고하시면 됩니다.