gantt-canvas-chart 1.0.1-alpha.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +2 -1
- package/dist/index.css +1 -1
- package/dist/index.es.js +3 -2
- package/dist/index.umd.js +2 -1
- package/dist/main.d.ts +148 -4
- package/package.json +4 -3
- package/dist/core/dateUtils.d.ts +0 -14
- package/dist/core/ganttChart.d.ts +0 -71
- package/dist/core/types.d.ts +0 -63
- package/dist/core/utils.d.ts +0 -6
package/dist/index.cjs.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* gantt-canvas-chart v1.0.1
|
|
2
|
+
* gantt-canvas-chart v1.0.1
|
|
3
3
|
* (c) 2025-present chandq
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
@@ -810,3 +810,4 @@ class GanttChart {
|
|
|
810
810
|
}
|
|
811
811
|
exports.DateUtils = DateUtils;
|
|
812
812
|
exports.GanttChart = GanttChart;
|
|
813
|
+
exports.firstValidValue = firstValidValue;
|
package/dist/index.css
CHANGED
package/dist/index.es.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* gantt-canvas-chart v1.0.1
|
|
2
|
+
* gantt-canvas-chart v1.0.1
|
|
3
3
|
* (c) 2025-present chandq
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
@@ -808,5 +808,6 @@ class GanttChart {
|
|
|
808
808
|
}
|
|
809
809
|
export {
|
|
810
810
|
DateUtils,
|
|
811
|
-
GanttChart
|
|
811
|
+
GanttChart,
|
|
812
|
+
firstValidValue
|
|
812
813
|
};
|
package/dist/index.umd.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* gantt-canvas-chart v1.0.1
|
|
2
|
+
* gantt-canvas-chart v1.0.1
|
|
3
3
|
* (c) 2025-present chandq
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
@@ -812,5 +812,6 @@
|
|
|
812
812
|
}
|
|
813
813
|
exports2.DateUtils = DateUtils;
|
|
814
814
|
exports2.GanttChart = GanttChart;
|
|
815
|
+
exports2.firstValidValue = firstValidValue;
|
|
815
816
|
Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
|
|
816
817
|
}));
|
package/dist/main.d.ts
CHANGED
|
@@ -1,4 +1,148 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
export declare class DateUtils {
|
|
2
|
+
static readonly ONE_DAY_MS: number;
|
|
3
|
+
static format(date: Date, format?: string): string;
|
|
4
|
+
static addDays(date: Date, days: number): Date;
|
|
5
|
+
static addMonths(date: Date, months: number): Date;
|
|
6
|
+
static addYears(date: Date, years: number): Date;
|
|
7
|
+
static diffDays(date1: Date, date2: Date): number;
|
|
8
|
+
static diffDaysInclusive(date1: Date, date2: Date): number;
|
|
9
|
+
static getDaysInMonth(year: number, month: number): number;
|
|
10
|
+
static getWeekNumber(d: Date): number;
|
|
11
|
+
static getStartOfWeek(d: Date): Date;
|
|
12
|
+
static getStartOfMonth(d: Date): Date;
|
|
13
|
+
static getStartOfYear(d: Date): Date;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* 获取第一个有效值
|
|
18
|
+
* @param args 有效值可选项
|
|
19
|
+
* @returns
|
|
20
|
+
*/
|
|
21
|
+
export declare function firstValidValue(...args: any[]): any;
|
|
22
|
+
|
|
23
|
+
export declare class GanttChart {
|
|
24
|
+
private rootContainer;
|
|
25
|
+
private container;
|
|
26
|
+
private data;
|
|
27
|
+
private config;
|
|
28
|
+
private headerCanvas;
|
|
29
|
+
private mainCanvas;
|
|
30
|
+
private scrollDummy;
|
|
31
|
+
private tooltip;
|
|
32
|
+
private headerCtx;
|
|
33
|
+
private mainCtx;
|
|
34
|
+
private timelineStart;
|
|
35
|
+
private timelineEnd;
|
|
36
|
+
private pixelsPerDay;
|
|
37
|
+
private scrollLeft;
|
|
38
|
+
private scrollTop;
|
|
39
|
+
private visibleDateRange;
|
|
40
|
+
private today;
|
|
41
|
+
private devicePixelRatio;
|
|
42
|
+
private viewportWidth;
|
|
43
|
+
private viewportHeight;
|
|
44
|
+
private totalWidth;
|
|
45
|
+
private totalHeight;
|
|
46
|
+
private resizeObserver;
|
|
47
|
+
private taskPositions;
|
|
48
|
+
private taskMap;
|
|
49
|
+
private boundHandleMouseMove;
|
|
50
|
+
private boundHandleMouseLeave;
|
|
51
|
+
private boundHandleScroll;
|
|
52
|
+
constructor(rootContainer: HTMLElement, data: GanttData, config?: GanttConfig);
|
|
53
|
+
private init;
|
|
54
|
+
private buildTaskMap;
|
|
55
|
+
private setupEvents;
|
|
56
|
+
updateConfig(newConfig: GanttConfig): void;
|
|
57
|
+
setData(newData: GanttData): void;
|
|
58
|
+
destroy(): void;
|
|
59
|
+
private calculateFullTimeline;
|
|
60
|
+
private updatePixelsPerDay;
|
|
61
|
+
private dateToX;
|
|
62
|
+
private xToDate;
|
|
63
|
+
private handleResize;
|
|
64
|
+
private handleScroll;
|
|
65
|
+
setScrollTop(scrollTop: number): void;
|
|
66
|
+
private updateVirtualRanges;
|
|
67
|
+
private updateDimensions;
|
|
68
|
+
private setupCanvas;
|
|
69
|
+
private calculateAllTaskPositions;
|
|
70
|
+
private getIterationStartDate;
|
|
71
|
+
render(): void;
|
|
72
|
+
private renderHeader;
|
|
73
|
+
private renderMain;
|
|
74
|
+
private drawArrow;
|
|
75
|
+
private drawAllDependencies;
|
|
76
|
+
private drawAllTasks;
|
|
77
|
+
private drawGrid;
|
|
78
|
+
private drawToday;
|
|
79
|
+
private drawTask;
|
|
80
|
+
private getTaskStyles;
|
|
81
|
+
private handleMouseMove;
|
|
82
|
+
private getTaskTooltipHtml;
|
|
83
|
+
private handleMouseLeave;
|
|
84
|
+
/**
|
|
85
|
+
* 计算任务宽度占的百分比(方便绘制精确到具体时间的每日任务)
|
|
86
|
+
* @param diffMilliseconds 距离目标日期时间的差异毫秒数
|
|
87
|
+
* @param pixelsPerDay 每日的像素数
|
|
88
|
+
* @returns
|
|
89
|
+
*/
|
|
90
|
+
static getTaskWidthPercent(diffMilliseconds: number, pixelsPerDay: number): number;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
declare interface GanttConfig {
|
|
94
|
+
viewMode?: 'Day' | 'Week' | 'Month' | 'Year';
|
|
95
|
+
planBorderColor?: string;
|
|
96
|
+
actualBgColor?: string;
|
|
97
|
+
rowHeight?: number;
|
|
98
|
+
headerHeight?: number;
|
|
99
|
+
showPlan?: boolean;
|
|
100
|
+
showActual?: boolean;
|
|
101
|
+
showRowLines?: boolean;
|
|
102
|
+
showColLines?: boolean;
|
|
103
|
+
showLeftRemark?: boolean;
|
|
104
|
+
showRightRemark?: boolean;
|
|
105
|
+
showCenterRemark?: boolean;
|
|
106
|
+
showTooltip?: boolean;
|
|
107
|
+
tooltipColor?: 'black' | 'white';
|
|
108
|
+
todayColor?: string;
|
|
109
|
+
offsetTop?: number;
|
|
110
|
+
offsetLeft?: number;
|
|
111
|
+
viewFactors?: {
|
|
112
|
+
Day: number;
|
|
113
|
+
Week: number;
|
|
114
|
+
Month: number;
|
|
115
|
+
Year: number;
|
|
116
|
+
};
|
|
117
|
+
tooltipFormat?: null | ((task: Row, date: Date, config: GanttConfig) => string);
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
declare type GanttData = Row[];
|
|
121
|
+
|
|
122
|
+
declare interface Row {
|
|
123
|
+
id: string;
|
|
124
|
+
name: string;
|
|
125
|
+
tasks: Task[];
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
declare interface Task {
|
|
129
|
+
id: string;
|
|
130
|
+
name: string;
|
|
131
|
+
type?: 'task' | 'leave';
|
|
132
|
+
planStart?: string;
|
|
133
|
+
planEnd?: string;
|
|
134
|
+
actualStart?: string;
|
|
135
|
+
actualEnd?: string;
|
|
136
|
+
dependencies?: string[];
|
|
137
|
+
leftRemark?: string;
|
|
138
|
+
rightRemark?: string;
|
|
139
|
+
centerRemark?: string;
|
|
140
|
+
styleClass?: string;
|
|
141
|
+
planBorderColor?: string;
|
|
142
|
+
actualBgColor?: string;
|
|
143
|
+
_data?: any;
|
|
144
|
+
planOffsetPercent?: [number, number];
|
|
145
|
+
actualOffsetPercent?: [number, number];
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
export { }
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "gantt-canvas-chart",
|
|
3
|
-
"version": "1.0.1
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"description": "High performance Gantt chart component based on Canvas, can be applied to any framework",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.es.js",
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
"jsdelivr": "dist/index.umd.js",
|
|
11
11
|
"exports": {
|
|
12
12
|
".": {
|
|
13
|
+
"types": "./dist/types/main.d.ts",
|
|
13
14
|
"import": "./dist/index.es.js",
|
|
14
15
|
"require": "./dist/index.umd.cjs"
|
|
15
16
|
},
|
|
@@ -38,9 +39,9 @@
|
|
|
38
39
|
},
|
|
39
40
|
"devDependencies": {
|
|
40
41
|
"@types/node": "^24.10.1",
|
|
41
|
-
"typescript": "
|
|
42
|
+
"typescript": "~5.8.0",
|
|
42
43
|
"vite": "^7.2.2",
|
|
43
44
|
"vite-plugin-banner": "^0.8.1",
|
|
44
|
-
"vite-plugin-dts": "^
|
|
45
|
+
"vite-plugin-dts": "^4.5.4"
|
|
45
46
|
}
|
|
46
47
|
}
|
package/dist/core/dateUtils.d.ts
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
export declare class DateUtils {
|
|
2
|
-
static readonly ONE_DAY_MS: number;
|
|
3
|
-
static format(date: Date, format?: string): string;
|
|
4
|
-
static addDays(date: Date, days: number): Date;
|
|
5
|
-
static addMonths(date: Date, months: number): Date;
|
|
6
|
-
static addYears(date: Date, years: number): Date;
|
|
7
|
-
static diffDays(date1: Date, date2: Date): number;
|
|
8
|
-
static diffDaysInclusive(date1: Date, date2: Date): number;
|
|
9
|
-
static getDaysInMonth(year: number, month: number): number;
|
|
10
|
-
static getWeekNumber(d: Date): number;
|
|
11
|
-
static getStartOfWeek(d: Date): Date;
|
|
12
|
-
static getStartOfMonth(d: Date): Date;
|
|
13
|
-
static getStartOfYear(d: Date): Date;
|
|
14
|
-
}
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
import { GanttData, GanttConfig } from './types';
|
|
2
|
-
|
|
3
|
-
export declare class GanttChart {
|
|
4
|
-
private rootContainer;
|
|
5
|
-
private container;
|
|
6
|
-
private data;
|
|
7
|
-
private config;
|
|
8
|
-
private headerCanvas;
|
|
9
|
-
private mainCanvas;
|
|
10
|
-
private scrollDummy;
|
|
11
|
-
private tooltip;
|
|
12
|
-
private headerCtx;
|
|
13
|
-
private mainCtx;
|
|
14
|
-
private timelineStart;
|
|
15
|
-
private timelineEnd;
|
|
16
|
-
private pixelsPerDay;
|
|
17
|
-
private scrollLeft;
|
|
18
|
-
private scrollTop;
|
|
19
|
-
private visibleDateRange;
|
|
20
|
-
private today;
|
|
21
|
-
private devicePixelRatio;
|
|
22
|
-
private viewportWidth;
|
|
23
|
-
private viewportHeight;
|
|
24
|
-
private totalWidth;
|
|
25
|
-
private totalHeight;
|
|
26
|
-
private resizeObserver;
|
|
27
|
-
private taskPositions;
|
|
28
|
-
private taskMap;
|
|
29
|
-
private boundHandleMouseMove;
|
|
30
|
-
private boundHandleMouseLeave;
|
|
31
|
-
private boundHandleScroll;
|
|
32
|
-
constructor(rootContainer: HTMLElement, data: GanttData, config?: GanttConfig);
|
|
33
|
-
private init;
|
|
34
|
-
private buildTaskMap;
|
|
35
|
-
private setupEvents;
|
|
36
|
-
updateConfig(newConfig: GanttConfig): void;
|
|
37
|
-
setData(newData: GanttData): void;
|
|
38
|
-
destroy(): void;
|
|
39
|
-
private calculateFullTimeline;
|
|
40
|
-
private updatePixelsPerDay;
|
|
41
|
-
private dateToX;
|
|
42
|
-
private xToDate;
|
|
43
|
-
private handleResize;
|
|
44
|
-
private handleScroll;
|
|
45
|
-
setScrollTop(scrollTop: number): void;
|
|
46
|
-
private updateVirtualRanges;
|
|
47
|
-
private updateDimensions;
|
|
48
|
-
private setupCanvas;
|
|
49
|
-
private calculateAllTaskPositions;
|
|
50
|
-
private getIterationStartDate;
|
|
51
|
-
render(): void;
|
|
52
|
-
private renderHeader;
|
|
53
|
-
private renderMain;
|
|
54
|
-
private drawArrow;
|
|
55
|
-
private drawAllDependencies;
|
|
56
|
-
private drawAllTasks;
|
|
57
|
-
private drawGrid;
|
|
58
|
-
private drawToday;
|
|
59
|
-
private drawTask;
|
|
60
|
-
private getTaskStyles;
|
|
61
|
-
private handleMouseMove;
|
|
62
|
-
private getTaskTooltipHtml;
|
|
63
|
-
private handleMouseLeave;
|
|
64
|
-
/**
|
|
65
|
-
* 计算任务宽度占的百分比(方便绘制精确到具体时间的每日任务)
|
|
66
|
-
* @param diffMilliseconds 距离目标日期时间的差异毫秒数
|
|
67
|
-
* @param pixelsPerDay 每日的像素数
|
|
68
|
-
* @returns
|
|
69
|
-
*/
|
|
70
|
-
static getTaskWidthPercent(diffMilliseconds: number, pixelsPerDay: number): number;
|
|
71
|
-
}
|
package/dist/core/types.d.ts
DELETED
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
export interface Task {
|
|
2
|
-
id: string;
|
|
3
|
-
name: string;
|
|
4
|
-
type?: 'task' | 'leave';
|
|
5
|
-
planStart?: string;
|
|
6
|
-
planEnd?: string;
|
|
7
|
-
actualStart?: string;
|
|
8
|
-
actualEnd?: string;
|
|
9
|
-
dependencies?: string[];
|
|
10
|
-
leftRemark?: string;
|
|
11
|
-
rightRemark?: string;
|
|
12
|
-
centerRemark?: string;
|
|
13
|
-
styleClass?: string;
|
|
14
|
-
planBorderColor?: string;
|
|
15
|
-
actualBgColor?: string;
|
|
16
|
-
_data?: any;
|
|
17
|
-
planOffsetPercent?: [number, number];
|
|
18
|
-
actualOffsetPercent?: [number, number];
|
|
19
|
-
}
|
|
20
|
-
export interface Row {
|
|
21
|
-
id: string;
|
|
22
|
-
name: string;
|
|
23
|
-
tasks: Task[];
|
|
24
|
-
}
|
|
25
|
-
export type GanttData = Row[];
|
|
26
|
-
export interface GanttConfig {
|
|
27
|
-
viewMode?: 'Day' | 'Week' | 'Month' | 'Year';
|
|
28
|
-
planBorderColor?: string;
|
|
29
|
-
actualBgColor?: string;
|
|
30
|
-
rowHeight?: number;
|
|
31
|
-
headerHeight?: number;
|
|
32
|
-
showPlan?: boolean;
|
|
33
|
-
showActual?: boolean;
|
|
34
|
-
showRowLines?: boolean;
|
|
35
|
-
showColLines?: boolean;
|
|
36
|
-
showLeftRemark?: boolean;
|
|
37
|
-
showRightRemark?: boolean;
|
|
38
|
-
showCenterRemark?: boolean;
|
|
39
|
-
showTooltip?: boolean;
|
|
40
|
-
tooltipColor?: 'black' | 'white';
|
|
41
|
-
todayColor?: string;
|
|
42
|
-
offsetTop?: number;
|
|
43
|
-
offsetLeft?: number;
|
|
44
|
-
viewFactors?: {
|
|
45
|
-
Day: number;
|
|
46
|
-
Week: number;
|
|
47
|
-
Month: number;
|
|
48
|
-
Year: number;
|
|
49
|
-
};
|
|
50
|
-
tooltipFormat?: null | ((task: Row, date: Date, config: GanttConfig) => string);
|
|
51
|
-
}
|
|
52
|
-
export interface TaskPosition {
|
|
53
|
-
x_plan_start: number;
|
|
54
|
-
x_plan_end: number;
|
|
55
|
-
x_actual_start: number | null;
|
|
56
|
-
x_actual_end: number | null;
|
|
57
|
-
y: number;
|
|
58
|
-
row: number;
|
|
59
|
-
}
|
|
60
|
-
export interface VisibleDateRange {
|
|
61
|
-
start: Date;
|
|
62
|
-
end: Date;
|
|
63
|
-
}
|