실제 시연 가능 · 아래에서 스크립트를 직접 다운로드하여 테스트할 수 있습니다
1
프로젝트 핵심 요약
🎯 개발 목적
평택항 선박 흘수 제약 관제 시 매번 브라우저를 열어 조석 정보를 확인하는 불편함 제거
⚙️ 주요 기능
고조·저조 시간 및 조위 상시 표출 · 드래그 위치 조정 · JSON 위치 자동 저장/복원
🛠️ 기술 스택
PowerShell · Microsoft WebView2 · HTML5/CSS3/JS · Win32 API
✅ 기대 효과
조석 확인 대기 시간 → 0초 (상시 표출) · 교대 시 위치 재설정 작업 완전 제거
2
도입 전 / 후 비교
⚠️ Before · 기존 방식
- 매번 브라우저 열기 → 국립해양조사원 사이트 접속
- 평택항 검색 → 복잡한 조석 그래프 확인
- 기상 악화·긴박한 상황에서 브라우저 로딩 대기 발생
- 시선 분산으로 관제 집중도 저하
평균 1분 이상 대기 + 시선 분산
✅ After · 자동화 후
- 작업표시줄 위 슬림 바에 항상 조석 정보 표출
- 고조·저조 시간 및 조위를 즉시 확인
- 드래그로 원하는 위치에 배치 · 재부팅 후에도 위치 유지
- 다크 모드 UI로 야간 관제 시 눈부심 방지
🌊 조석 확인 시간 → 0초 (상시 표출)
3
실제 시연 · 다운로드 및 사용법
1
사전 준비: Microsoft Edge WebView2 Runtime이 설치되어 있어야 합니다. (WebView2 Runtime 다운로드 ↗)
DLL 파일을
DLL 파일을
C:\webview2\ 폴더에 배치하세요.
2
스크립트 실행: 다운로드한
조석표 위젯.ps1을 우클릭 → "PowerShell에서 실행"
3
위치 배치: 실행된 슬림 바를 마우스로 잡고 작업표시줄 바로 위에 드래그하여 배치
4
상시 활용: 평택항 실시간 고조·저조 수위와 시간 정보가 화면에 상시 표출됩니다. 위치는 자동 저장됩니다.
📟 위젯 UI 미리보기 (실제 렌더링과 유사)
일출
05:18
저조
02:34
42cm
고조
08:51
821cm
저조
15:12
38cm
고조
21:28
835cm
일몰
19:52
0초
조석 정보 확인 대기
상시
실시간 자동 갱신
공개 API
국립해양조사원
+
소스코드 전문 공개
실제 구동되는 스크립트 소스코드 원본입니다.
조석표 위젯.ps1
Add-Type -AssemblyName System.Windows.Forms
Add-Type -AssemblyName System.Drawing
Add-Type -Path "C:\webview2\Microsoft.Web.WebView2.WinForms.dll"
$ConfigPath = "$env:LOCALAPPDATA\TideWidget_pos.json"
try {
Add-Type -TypeDefinition @"
using System;
using System.Runtime.InteropServices;
public class Win32 {
[DllImport("user32.dll")]
public static extern bool ReleaseCapture();
[DllImport("user32.dll")]
public static extern int SendMessage(IntPtr hWnd, int Msg, int wParam, int lParam);
}
"@
} catch { }
$HtmlContent = @"
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
html, body {
margin: 0; padding: 0; overflow: hidden;
width: 895px; height: 81px;
display: flex; background: #2b3b4d;
user-select: none;
}
#drag-overlay {
position: absolute; top: 0; left: 0;
width: 100%; height: 100%;
z-index: 9999; cursor: move;
}
/* ... 조석 데이터 표시 스타일 */
</style>
</head>
<body>
<div id="drag-overlay"></div>
<div id="tide-container">
<!-- 국립해양조사원 API 데이터 자동 렌더링 -->
</div>
</body>
</html>
"@
# GitHub에서 전체 소스코드 확인 가능