[]
SpreadJS는 셀에 하이퍼링크를 추가하여 웹 페이지, 통합 문서 내의 범위, 또는 이메일로 연결할 수 있도록 지원합니다. setHyperlink 메서드를 사용하면 다음과 같은 유형의 하이퍼링크를 셀에 설정할 수 있습니다:
웹 페이지용 URL – 예: https://www.mescius.co.kr/
이메일 주소 – 예: sales-kor@mescius.com
현재 통합 문서 내의 참조 – 예: sjs://Sheet2!A1:B2
또한, 링크 형태의 문자열을 입력하고 allowAutoCreateHyperlink 속성을 true
로 설정하면 하이퍼링크가 자동 생성됩니다.
www
로 시작하면 URL로 간주됩니다.
이메일 형식이지만 mailto:
로 시작하지 않으면 URL로 간주됩니다.
sjs://
로 시작하면 통합 문서 참조로 간주됩니다.
Excel 파일에서의 하이퍼링크 가져오기 및 내보내기를 지원합니다.
HyperlinkTargetType 열거형을 통해 새 창/탭, 동일 프레임, 상위 프레임, 전체 창 등에서 링크 열기 설정이 가능합니다.
툴팁, 링크 색상, 방문한 링크 색상, 밑줄 표시 여부 등을 다양한 속성으로 정의할 수 있습니다.
줌 인, 날짜 선택기 열기 등 사용자 정의 명령을 하이퍼링크에 지정할 수 있습니다.
하이퍼링크는 수식 및 복사, 붙여넣기, 끌어서 채우기, 머리글, 오버플로우 등 다양한 작업을 지원합니다.
이미 하이퍼링크가 있는 셀에 새로운 하이퍼링크를 설정하면 기존 하이퍼링크는 덮어쓰기 됩니다.
하이퍼링크를 수정하려면 getHyperlink 로 객체를 가져온 후 값을 수정하고 setHyperlink로 다시 설정해야 합니다.
하이퍼링크를 제거하려면 setHyperlink을 null로 설정하면 됩니다.
하이퍼링크에 linkColor 또는 visitedLinkColor 가 정의되어 있고 셀 스타일에 foreColor
가 있다면 하이퍼링크 색상이 우선 적용됩니다.
하이퍼링크의 drawUnderline 속성이 스타일보다 우선합니다.
linkColor , visitedLinkColor 가 정의되지 않거나 drawUnderline 이 false
이면 셀 스타일이 사용됩니다.
하이퍼링크와 셀 타입이 동시에 존재할 경우 셀 타입(ButtonList 등)이 우선 적용됩니다.
하이퍼링크의 command 속성에 함수가 설정된 경우, fromJSON
또는 toJSON
사용 시 함수는 유실됩니다. 따라서 함수 대신 명령 문자열 사용을 권장합니다.
PDF로 내보낼 때 하이퍼링크는 표시되지만 클릭할 수 없습니다.
다음 코드는 스프레드시트의 셀에 다양한 유형의 하이퍼링크를 추가하는 예제입니다:
// 활성화 시트 가져오기
var activeSheet = spread.getSheet(0);
// 링크에 밑줄이 없고 툴팁이 있는 URL 하이퍼링크
activeSheet.setValue(0, 0, 'MESCIUS');
activeSheet.setHyperlink(0, 0, {
url: 'https://www.mescius.co.kr/spreadjs',
tooltip: "MESCIUS Website",
linkColor: '#0066cc',
visitedLinkColor: '#3399ff',
drawUnderline: false
});
// 시트 위치 하이퍼링크
activeSheet.setValue(1, 0, 'Sheet2!A1:B2');
activeSheet.setHyperlink(1, 0, { url: 'sjs://Sheet2!A1:B2', tooltip: "Link to Sheet2!A1:B2" }, GC.Spread.Sheets.SheetArea.viewport);
// 이메일 주소 하이퍼 링크
activeSheet.setValue(2, 0, 'Send email');
activeSheet.setHyperlink(2, 0, { url: 'sales-kor@mescius.com', tooltip: "sales-kor@mescius.com로 메일 보내기" });
// 이메일 주소 및 주제 하이퍼링크
activeSheet.setValue(3, 0, 'Send Email With Subject');
activeSheet.setHyperlink(3, 0, {
url: 'sales-kor@mescius.com?subject=라이선스구매',
tooltip: "주제와 함께 sales-kor@mescius.com로 메일 보내기"
});
// 사용자 정의 명령 하이퍼링크 - 시트 줌
activeSheet.setValue(4, 0, 'Zoom Sheet');
activeSheet.setHyperlink(4, 0, {
command: function (activeSheet) {
if (activeSheet.zoom() === 1) {
activeSheet.zoom(1.3);
} else {
activeSheet.zoom(1);
}
}
});
// 날짜 하이퍼링크 설정
activeSheet.setValue(5, 0, 'Set Date');
activeSheet.setHyperlink(5, 0, { command: 'openMonthPicker' });
// 수식 하이퍼링크
activeSheet.setValue(6, 1, "www.google.com")
activeSheet.setValue(6, 2, "Google")
activeSheet.setFormula(6, 0, "=HYPERLINK(B7, C7");