dwker/lightweight-charts-python
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

implement drawing methods, fix horizontal line bug, continue refactor

Browse Source
This commit is contained in:
louisnw
2024-04-14 16:29:15 +01:00
parent 3ead45f858
commit 3fdd19e3ce
33 changed files with 732 additions and 365 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/general/global-params.ts
View File

@ -1,4 +1,8 @@
import { Box } from "../box/box";
import { HorizontalLine } from "../horizontal-line/horizontal-line";
import { RayLine } from "../horizontal-line/ray-line";
import { TrendLine } from "../trend-line/trend-line";
import { VerticalLine } from "../vertical-line/vertical-line";
import { Table } from "./table";
export interface GlobalParams extends Window {
@ -10,7 +14,13 @@ export interface GlobalParams extends Window {
cursor: string;
Handler: any;
Table: typeof Table;
HorizontalLine: typeof HorizontalLine;
TrendLine: typeof TrendLine;
Box: typeof Box;
RayLine: typeof RayLine;
VerticalLine: typeof VerticalLine;
}
interface paneStyle {
@ -48,7 +58,12 @@ export function globalParamInit() {
}
window.cursor = 'default';
window.Table = Table;
window.HorizontalLine = HorizontalLine;
window.TrendLine = TrendLine;
window.Box = Box;
window.RayLine = RayLine;
window.VerticalLine = VerticalLine;
}

52
src/general/handler.ts
View File

@ -52,8 +52,14 @@ export class Handler {
public _seriesList: ISeriesApi<SeriesType>[] = [];
constructor(chartId: string, innerWidth: number, innerHeight: number, position: string, autoSize: boolean) {
// TODO make some subcharts in the vite dev window and mess with the CSS to see if you can not need the position param. also see if you can remove resizing each time the window resizes?
constructor(
chartId: string,
innerWidth: number,
innerHeight: number,
position: string,
autoSize: boolean
) {
this.reSize = this.reSize.bind(this)
this.id = chartId
@ -224,8 +230,15 @@ export class Handler {
return param.seriesData.get(series) || null;
}
const setChildRange = (timeRange: LogicalRange | null) => { if(timeRange) childChart.chart.timeScale().setVisibleLogicalRange(timeRange); }
const setParentRange = (timeRange: LogicalRange | null) => { if(timeRange) parentChart.chart.timeScale().setVisibleLogicalRange(timeRange); }
const childTimeScale = childChart.chart.timeScale();
const parentTimeScale = parentChart.chart.timeScale();
const setChildRange = (timeRange: LogicalRange | null) => {
if(timeRange) childTimeScale.setVisibleLogicalRange(timeRange);
}
const setParentRange = (timeRange: LogicalRange | null) => {
if(timeRange) parentTimeScale.setVisibleLogicalRange(timeRange);
}
const setParentCrosshair = (param: MouseEventParams) => {
crosshairHandler(parentChart, getPoint(childChart.series, param))
@ -235,7 +248,14 @@ export class Handler {
}
let selected = parentChart
function addMouseOverListener(thisChart: Handler, otherChart: Handler, thisCrosshair: MouseEventHandler<Time>, otherCrosshair: MouseEventHandler<Time>, thisRange: LogicalRangeChangeEventHandler, otherRange: LogicalRangeChangeEventHandler) {
function addMouseOverListener(
thisChart: Handler,
otherChart: Handler,
thisCrosshair: MouseEventHandler<Time>,
otherCrosshair: MouseEventHandler<Time>,
thisRange: LogicalRangeChangeEventHandler,
otherRange: LogicalRangeChangeEventHandler)
{
thisChart.wrapper.addEventListener('mouseover', () => {
if (selected === thisChart) return
selected = thisChart
@ -246,10 +266,28 @@ export class Handler {
thisChart.chart.timeScale().subscribeVisibleLogicalRangeChange(otherRange)
})
}
addMouseOverListener(parentChart, childChart, setParentCrosshair, setChildCrosshair, setParentRange, setChildRange)
addMouseOverListener(childChart, parentChart, setChildCrosshair, setParentCrosshair, setChildRange, setParentRange)
addMouseOverListener(
parentChart,
childChart,
setParentCrosshair,
setChildCrosshair,
setParentRange,
setChildRange
)
addMouseOverListener(
childChart,
parentChart,
setChildCrosshair,
setParentCrosshair,
setChildRange,
setParentRange
)
parentChart.chart.subscribeCrosshairMove(setChildCrosshair)
const parentRange = parentTimeScale.getVisibleLogicalRange()
if (parentRange) childTimeScale.setVisibleLogicalRange(parentRange)
if (crosshairOnly) return;
parentChart.chart.timeScale().subscribeVisibleLogicalRangeChange(setChildRange)
}

42
src/general/toolbox.ts
View File

@ -7,9 +7,9 @@ import { GlobalParams } from "./global-params";
import { StylePicker } from "../context-menu/style-picker";
import { ColorPicker } from "../context-menu/color-picker";
import { IChartApi, ISeriesApi, SeriesType } from "lightweight-charts";
import { TwoPointDrawing } from "../drawing/two-point-drawing";
import { HorizontalLine } from "../horizontal-line/horizontal-line";
import { RayLine } from "../horizontal-line/ray-line";
import { VerticalLine } from "../vertical-line/vertical-line";
interface Icon {
@ -67,6 +67,7 @@ export class ToolBox {
this.buttons.push(this._makeToolBoxElement(HorizontalLine, 'KeyH', ToolBox.HORZ_SVG));
this.buttons.push(this._makeToolBoxElement(RayLine, 'KeyR', ToolBox.RAY_SVG));
this.buttons.push(this._makeToolBoxElement(Box, 'KeyB', ToolBox.BOX_SVG));
this.buttons.push(this._makeToolBoxElement(VerticalLine, 'KeyV', ToolBox.RAY_SVG));
for (const button of this.buttons) {
div.appendChild(button);
}
@ -122,7 +123,7 @@ export class ToolBox {
this._drawingTool?.beginDrawing(this.activeIcon.type);
}
removeActiveAndSave() {
removeActiveAndSave = () => {
window.setCursor('default');
if (this.activeIcon) this.activeIcon.div.classList.remove('active-toolbox-button')
this.activeIcon = null
@ -168,39 +169,36 @@ export class ToolBox {
this._drawingTool.clearDrawings();
}
saveDrawings() {
saveDrawings = () => {
const drawingMeta = []
for (const d of this._drawingTool.drawings) {
if (d instanceof TwoPointDrawing) {
drawingMeta.push({
type: d._type,
p1: d._p1,
p2: d._p2,
color: d._options.lineColor,
style: d._options.lineStyle, // TODO should push all options, just dont have showcircles/ non public stuff as actual options
// would also fix the instanceOf in loadDrawings
})
}
// TODO else if d instanceof Drawing
drawingMeta.push({
points: d.points,
options: d._options
});
}
const string = JSON.stringify(drawingMeta);
window.callbackFunction(`save_drawings${this._handlerID}_~_${string}`)
}
loadDrawings(drawings: any[]) { // TODO any?
loadDrawings(drawings: any[]) { // TODO any
drawings.forEach((d) => {
const options = {
lineColor: d.color,
lineStyle: d.style,
}
switch (d.type) {
case "Box":
this._drawingTool.addNewDrawing(new Box(d.p1, d.p2, options));
this._drawingTool.addNewDrawing(new Box(d.points[0], d.points[1], d.options));
break;
case "TrendLine":
this._drawingTool.addNewDrawing(new TrendLine(d.p1, d.p2, options));
this._drawingTool.addNewDrawing(new TrendLine(d.points[0], d.points[1], d.options));
break;
case "HorizontalLine":
this._drawingTool.addNewDrawing(new HorizontalLine(d.points[0], d.options));
break;
case "RayLine":
this._drawingTool.addNewDrawing(new RayLine(d.points[0], d.options));
break;
case "VerticalLine":
this._drawingTool.addNewDrawing(new VerticalLine(d.points[0], d.options));
break;
// TODO case HorizontalLine
}
})
}