chart-0714
Version:
Professional trading chart library with advanced customization for trading journal apps
282 lines (281 loc) • 8.25 kB
TypeScript
import { ViewportState, ChartPoint, ICoordinateSystem } from '../types';
import { DataManager } from './DataManager';
export interface Point {
x: number;
y: number;
}
export interface Range {
start: number;
end: number;
}
export interface PriceRange {
min: number;
max: number;
}
export declare class UnifiedCoordinateSystem implements ICoordinateSystem {
private canvasWidth;
private canvasHeight;
private pixelRatio;
private _rangeLogged;
private _yAxisWidth;
private pixelOffset;
private candleWidth;
private readonly MIN_CANDLE_WIDTH;
private readonly MAX_CANDLE_WIDTH;
private minPrice;
private maxPrice;
private priceMarginTop;
private priceMarginBottom;
private rightMarginCandles;
private panelPriceRanges;
private currentPanelId;
private panelHeights;
private panelYOffsets;
private totalCandles;
private dataTimeRange;
private velocity;
private readonly FRICTION;
private autoScale;
private logScale;
private fixedPriceRange;
private dataManager;
constructor(width: number, height: number, pixelRatio?: number, yAxisWidth?: number);
/**
* Canvas 크기 업데이트
* @param width 전체 컨테이너 너빔 (Canvas 픽셀)
* @param height 전체 컨테이너 높이 (Canvas 픽셀)
*/
resize(width: number, height: number): void;
/**
* Y축 너비 설정
*/
setYAxisWidth(width: number): void;
/**
* Y축 너비 반환
*/
getYAxisWidth(): number;
/**
* 총 캔들 수 반환
*/
getTotalCandles(): number;
/**
* 현재 픽셀 오프셋 반환
*/
getPixelOffset(): number;
/**
* 현재 패널 ID 반환
*/
getCurrentPanel(): string;
/**
* 실제 차트 영역 너비 반환
*/
getChartAreaWidth(): number;
/**
* 패널별 높이 설정
* @param panelId 패널 ID
* @param height 패널 높이 (Canvas 픽셀 단위)
*/
setPanelHeight(panelId: string, height: number): void;
/**
* 패널별 Y 오프셋 설정
* @param panelId 패널 ID
* @param yOffset Y 오프셋 (Canvas 픽셀 단위)
*/
setPanelYOffset(panelId: string, yOffset: number): void;
/**
* 패널의 실제 높이 가져오기
* @param panelId 패널 ID
* @returns 패널 높이 (Canvas 픽셀 단위)
*/
private getPanelHeight;
/**
* DataManager 설정 (타임스탬프 변환용)
*/
setDataManager(dataManager: DataManager): void;
/**
* DataManager 가져오기
*/
getDataManager(): DataManager | null;
/**
* 데이터 정보 설정
*/
setDataInfo(totalCandles: number, timeRange: [number, number]): void;
/**
* CSS 픽셀을 Canvas 픽셀로 변환
*/
cssToCanvas(cssX: number, cssY: number): Point;
/**
* Canvas 픽셀을 CSS 픽셀로 변환
*/
canvasToCSS(canvasX: number, canvasY: number): Point;
/**
* Chart 좌표를 Canvas 픽셀로 변환
* @param indexOrTime - 캔들 인덱스 또는 타임스탬프
* @param price - 가격
* @param panelId - 패널 ID (optional, Y축 변환용)
*/
chartToCanvas(indexOrTime: number, price: number, panelId?: string): Point;
/**
* Canvas 픽셀을 Chart 좌표로 변환
* @param canvasX Canvas X 좌표
* @param canvasY Canvas Y 좌표
* @param panelId 패널 ID (optional, Y축 변환용)
*/
canvasToChart(canvasX: number, canvasY: number, panelId?: string): ChartPoint;
/**
* CSS 픽셀을 Chart 좌표로 변환 (편의 메서드)
*/
cssToChart(cssX: number, cssY: number, panelId?: string): ChartPoint;
/**
* Chart 좌표를 CSS 픽셀로 변환 (편의 메서드)
*/
chartToCSS(index: number, price: number, panelId?: string): Point;
/**
* 타임스탬프를 캔들 인덱스로 변환 (캔들 없는 영역도 허용)
*/
private timeToIndex;
/**
* 캔들 인덱스를 Canvas X 좌표로 변환 (캔들 중앙)
*/
indexToCanvasX(index: number): number;
/**
* Canvas X 좌표를 캔들 인덱스로 변환
*/
canvasXToIndex(canvasX: number): number;
canvasXToCandleIndex(x: number): number;
/**
* 가격을 Canvas Y 좌표로 변환
* @param price 가격
* @param panelId 패널 ID (optional, 기본값은 현재 패널)
*/
priceToCanvasY(price: number, panelId?: string): number;
/**
* Canvas Y 좌표를 가격으로 변환
* @param canvasY Canvas Y 좌표
* @param panelId 패널 ID (optional, 기본값은 현재 패널)
*/
canvasYToPrice(canvasY: number, panelId?: string): number;
/**
* Canvas 좌표를 WebGL NDC로 변환
*/
canvasToNDC(canvasX: number, canvasY: number): Point;
/**
* 패닝
*/
pan(deltaX: number): void;
/**
* 줌 (마우스/터치 위치 중심)
*/
zoom(factor: number, centerX: number): void;
/**
* 관성 업데이트
*/
updateInertia(): boolean;
/**
* 컨텐츠에 맞춰 조정
*/
fitContent(): void;
/**
* 가격 범위 설정
* @param minPrice 최소 가격
* @param maxPrice 최대 가격
* @param panelId 패널 ID (optional, 기본값은 현재 패널)
*/
setPriceRange(minPrice: number, maxPrice: number, panelId?: string): void;
/**
* 가격 여백 설정
* @param top 위쪽 여백 비율
* @param bottom 아래쪽 여백 비율
* @param panelId 패널 ID (optional, 기본값은 현재 패널)
*/
setPriceMargin(top: number, bottom: number, panelId?: string): void;
/**
* 고정 가격 범위 설정
*/
setFixedPriceRange(range: [number, number] | null): void;
/**
* 오토 스케일 설정
*/
setAutoScale(enabled: boolean): void;
/**
* 로그 스케일 설정
*/
setLogScale(enabled: boolean): void;
/**
* 오른쪽 여백 설정 (캔들 개수로 지정)
* @param candles 오른쪽 여백에 표시할 빈 캔들 개수
*/
setRightMargin(candles: number): void;
/**
* 보이는 캔들 범위 계산
*/
getVisibleRange(): Range;
getCanvasWidth(): number;
getCanvasHeight(): number;
getPixelRatio(): number;
getCandleWidth(): number;
/**
* 가격 범위 가져오기
* @param panelId 패널 ID (optional, 기본값은 현재 패널)
*/
getPriceRange(panelId?: string): [number, number];
isAutoScale(): boolean;
isLogScale(): boolean;
/**
* 레거시 ViewportState 호환성
*/
getState(): ViewportState;
/**
* 레거시 메서드 (Viewport 호환성)
*/
getWidth(): number;
getHeight(): number;
xToTime(x: number): number;
indexToTime(index: number): number;
timeToX(time: number): number;
yToPrice(y: number): number;
priceToY(price: number): number;
getViewport(): ViewportState;
candleIndexToPixelX(index: number): number;
pixelXToCandleIndex(x: number): number;
priceToPixelY(price: number, panelId?: string): number;
pixelYToPrice(y: number, panelId?: string): number;
/**
* 가격 스케일 정보 가져오기
* @param panelId 패널 ID (optional, 기본값은 현재 패널)
*/
getPriceScale(panelId?: string): {
min: number;
max: number;
range: number;
};
/**
* 현재 패널 설정
* @param panelId 패널 ID
*/
setCurrentPanel(panelId: string): void;
/**
* 시간을 Canvas X 좌표로 변환
*/
timeToCanvasX(time: number): number;
/**
* 시간을 픽셀 X 좌표로 변환 (Canvas X와 동일)
*/
timeToPixelX(time: number): number;
/**
* 최신 데이터로 스크롤
*/
scrollToEnd(): void;
/**
* 특정 시간으로 스크롤
*/
scrollToTime(targetTime: number): void;
/**
* 보이는 캔들 수 설정
*/
setVisibleCandles(count: number): void;
/**
* 시간 범위 설정 (차트 표시용)
*/
setTimeRange(startTime: number, endTime: number): void;
}