Refactoring/Enhancements/Fixes
Breaking Changes:
- Removed the `api` parameter; callbacks no longer need to be in a specific class.
- Topbar callbacks now take a chart as an argument (see updated callback examples)
- Removed the `topbar` parameter from chart declaration. The Topbar will be automatically created upon declaration of a topbar widget.
- Removed the `searchbox` parameter from charts. It will be created upon subscribing to it in `chart.events`.
- Removed `dynamic_loading`.
- Removed ‘volume_enabled’ parameter. Volume will be enabled if the volumn column is present in the dataframe.
- Widgets’ `func` parameter is now declared last.
- Switchers take a tuple of options rather than a variable number of arguments.
- `add_hotkey` renamed to `hotkey`
- Horizontal lines now take a `func` argument rather than `interactive`. This event will emit the Line object that was moved.
- Removed the `name` parameter from `line.set`. Line object names are now declared upon creation.
Enhancements:
- Added the `button` widget to the Topbar.
- Added the color picker to the drawing context menu.
- Charts now have a `candle_data` method, which returns the current data displayed on the chart as a DataFrame.
- Fixed callbacks are now located in the `chart.events` object:
- search (e.g `chart.events.search += on_search`)
- new_bar
- range_change
- Added volume to the legend
- Drawings can now be accessed through `chart.toolbox.drawings`
- added the `style` and `name` parameters to `create_line`
Bug Fixes:
- Fixed a bug causing new charts not to load after `exit` was called.
- Refactored rayline placement to ensure they do not move the visible range.
- Fixed a bug causing the visible range to shift when trendlines are moved past the final candlestick.
- Fixed a bug preventing trendlines and raylines on irregular timeframes.
- Fixed a bug causing the legend to prevent mouse input into the chart.
This commit is contained in:
@ -1,3 +1,4 @@
|
||||
import asyncio
|
||||
import json
|
||||
import os
|
||||
from datetime import timedelta, datetime
|
||||
@ -6,10 +7,8 @@ import pandas as pd
|
||||
from typing import Union, Literal, Dict, List
|
||||
|
||||
from lightweight_charts.table import Table
|
||||
from lightweight_charts.util import LINE_STYLE, MARKER_POSITION, MARKER_SHAPE, CROSSHAIR_MODE, _crosshair_mode, \
|
||||
_line_style, \
|
||||
MissingColumn, _js_bool, _price_scale_mode, PRICE_SCALE_MODE, _marker_position, _marker_shape, IDGen
|
||||
|
||||
from lightweight_charts.util import LINE_STYLE, MARKER_POSITION, MARKER_SHAPE, CROSSHAIR_MODE, crosshair_mode, \
|
||||
line_style, jbool, price_scale_mode, PRICE_SCALE_MODE, marker_position, marker_shape, IDGen, Events
|
||||
|
||||
JS = {}
|
||||
current_dir = os.path.dirname(os.path.abspath(__file__))
|
||||
@ -51,7 +50,9 @@ HTML = f"""
|
||||
|
||||
class SeriesCommon:
|
||||
def _set_interval(self, df: pd.DataFrame):
|
||||
common_interval = pd.to_datetime(df['time']).diff().value_counts()
|
||||
if not pd.api.types.is_datetime64_any_dtype(df['time']):
|
||||
df['time'] = pd.to_datetime(df['time'])
|
||||
common_interval = df['time'].diff().value_counts()
|
||||
try:
|
||||
self._interval = common_interval.index[0]
|
||||
except IndexError:
|
||||
@ -97,12 +98,14 @@ class SeriesCommon:
|
||||
return series
|
||||
|
||||
def _datetime_format(self, arg: Union[pd.Series, str]):
|
||||
arg = pd.to_datetime(arg)
|
||||
if not pd.api.types.is_datetime64_any_dtype(arg):
|
||||
arg = pd.to_datetime(arg)
|
||||
if self._interval < timedelta(days=1):
|
||||
if isinstance(arg, pd.Series):
|
||||
arg = arg.astype('int64') // 10 ** 9
|
||||
else:
|
||||
arg = self._interval.total_seconds() * (arg.timestamp() // self._interval.total_seconds())
|
||||
interval_seconds = self._interval.total_seconds()
|
||||
arg = interval_seconds * (arg.timestamp() // interval_seconds)
|
||||
else:
|
||||
arg = arg.dt.strftime('%Y-%m-%d') if isinstance(arg, pd.Series) else arg.strftime('%Y-%m-%d')
|
||||
|
||||
@ -127,9 +130,9 @@ class SeriesCommon:
|
||||
self.run_script(f"""
|
||||
{self.id}.markers.push({{
|
||||
time: {time if isinstance(time, float) else f"'{time}'"},
|
||||
position: '{_marker_position(position)}',
|
||||
position: '{marker_position(position)}',
|
||||
color: '{color}',
|
||||
shape: '{_marker_shape(shape)}',
|
||||
shape: '{marker_shape(shape)}',
|
||||
text: '{text}',
|
||||
id: '{marker_id}'
|
||||
}});
|
||||
@ -149,11 +152,11 @@ class SeriesCommon:
|
||||
}});''')
|
||||
|
||||
def horizontal_line(self, price: Union[float, int], color: str = 'rgb(122, 146, 202)', width: int = 2,
|
||||
style: LINE_STYLE = 'solid', text: str = '', axis_label_visible: bool = True, interactive: bool = False) -> 'HorizontalLine':
|
||||
style: LINE_STYLE = 'solid', text: str = '', axis_label_visible: bool = True, func: callable = None) -> 'HorizontalLine':
|
||||
"""
|
||||
Creates a horizontal line at the given price.\n
|
||||
Creates a horizontal line at the given price.
|
||||
"""
|
||||
return HorizontalLine(self, price, color, width, style, text, axis_label_visible, interactive)
|
||||
return HorizontalLine(self, price, color, width, style, text, axis_label_visible, func)
|
||||
|
||||
def remove_horizontal_line(self, price: Union[float, int] = None):
|
||||
"""
|
||||
@ -182,8 +185,8 @@ class SeriesCommon:
|
||||
def price_line(self, label_visible: bool = True, line_visible: bool = True, title: str = ''):
|
||||
self.run_script(f'''
|
||||
{self.id}.series.applyOptions({{
|
||||
lastValueVisible: {_js_bool(label_visible)},
|
||||
priceLineVisible: {_js_bool(line_visible)},
|
||||
lastValueVisible: {jbool(label_visible)},
|
||||
priceLineVisible: {jbool(line_visible)},
|
||||
title: '{title}',
|
||||
}})''')
|
||||
|
||||
@ -193,6 +196,7 @@ class SeriesCommon:
|
||||
:param precision: The number of decimal places.
|
||||
"""
|
||||
self.run_script(f'''
|
||||
{self.id}.precision = {precision}
|
||||
{self.id}.series.applyOptions({{
|
||||
priceFormat: {{precision: {precision}, minMove: {1 / (10 ** precision)}}}
|
||||
}})''')
|
||||
@ -203,18 +207,23 @@ class SeriesCommon:
|
||||
|
||||
def _toggle_data(self, arg):
|
||||
self.run_script(f'''
|
||||
{self.id}.series.applyOptions({{visible: {_js_bool(arg)}}})
|
||||
{f'{self.id}.volumeSeries.applyOptions({{visible: {_js_bool(arg)}}})' if hasattr(self, 'volume_enabled') and self.volume_enabled else ''}
|
||||
{self.id}.series.applyOptions({{visible: {jbool(arg)}}})
|
||||
{f'{self.id}.volumeSeries.applyOptions({{visible: {jbool(arg)}}})' if hasattr(self, 'loaded') else ''}
|
||||
''')
|
||||
|
||||
class HorizontalLine:
|
||||
def __init__(self, chart, price, color, width, style, text, axis_label_visible, interactive):
|
||||
def __init__(self, chart, price, color, width, style, text, axis_label_visible, func):
|
||||
self._chart = chart
|
||||
self.id = self._chart._rand.generate()
|
||||
self.price = price
|
||||
self._chart.run_script(f'''
|
||||
{self.id} = new HorizontalLine({self._chart.id}, '{self.id}', {price}, '{color}', {width}, {_line_style(style)}, {_js_bool(axis_label_visible)}, '{text}')
|
||||
{self.id} = new HorizontalLine({self._chart.id}, '{self.id}', {price}, '{color}', {width}, {line_style(style)}, {jbool(axis_label_visible)}, '{text}')
|
||||
''')
|
||||
if not interactive: return
|
||||
if not func: return
|
||||
def wrapper(p):
|
||||
self.price = p
|
||||
func(chart, self)
|
||||
chart._handlers[self.id] = wrapper
|
||||
self._chart.run_script(f'if ("toolBox" in {self._chart.id}) {self._chart.id}.toolBox.drawings.push({self.id})')
|
||||
|
||||
def update(self, price):
|
||||
@ -222,6 +231,7 @@ class HorizontalLine:
|
||||
Moves the horizontal line to the given price.
|
||||
"""
|
||||
self._chart.run_script(f'{self.id}.updatePrice({price})')
|
||||
self.price = price
|
||||
|
||||
def label(self, text: str):
|
||||
self._chart.run_script(f'{self.id}.updateLabel("{text}")')
|
||||
@ -235,9 +245,9 @@ class HorizontalLine:
|
||||
|
||||
|
||||
class Line(SeriesCommon):
|
||||
def __init__(self, chart, color, width, price_line, price_label, crosshair_marker=True):
|
||||
def __init__(self, chart, name, color, style, width, price_line, price_label, crosshair_marker=True):
|
||||
self.color = color
|
||||
self.name = ''
|
||||
self.name = name
|
||||
self._chart = chart
|
||||
self._rand = chart._rand
|
||||
self.id = self._rand.generate()
|
||||
@ -246,21 +256,23 @@ class Line(SeriesCommon):
|
||||
{self.id} = {{
|
||||
series: {self._chart.id}.chart.addLineSeries({{
|
||||
color: '{color}',
|
||||
lineStyle: {line_style(style)},
|
||||
lineWidth: {width},
|
||||
lastValueVisible: {_js_bool(price_label)},
|
||||
priceLineVisible: {_js_bool(price_line)},
|
||||
crosshairMarkerVisible: {_js_bool(crosshair_marker)},
|
||||
lastValueVisible: {jbool(price_label)},
|
||||
priceLineVisible: {jbool(price_line)},
|
||||
crosshairMarkerVisible: {jbool(crosshair_marker)},
|
||||
{"""autoscaleInfoProvider: () => ({
|
||||
priceRange: {
|
||||
minValue: 1_000_000_000,
|
||||
maxValue: 0,
|
||||
},
|
||||
}),""" if self._chart._scale_candles_only else ''}
|
||||
}}),
|
||||
},
|
||||
}),""" if self._chart._scale_candles_only else ''}
|
||||
}}),
|
||||
markers: [],
|
||||
horizontal_lines: [],
|
||||
name: '',
|
||||
name: '{name}',
|
||||
color: '{color}',
|
||||
precision: 2,
|
||||
}}
|
||||
{self._chart.id}.lines.push({self.id})
|
||||
if ('legend' in {self._chart.id}) {{
|
||||
@ -269,23 +281,22 @@ class Line(SeriesCommon):
|
||||
''')
|
||||
|
||||
|
||||
def set(self, data: pd.DataFrame, name=''):
|
||||
def set(self, data: pd.DataFrame):
|
||||
"""
|
||||
Sets the line data.\n
|
||||
:param data: If the name parameter is not used, the columns should be named: date/time, value.
|
||||
:param name: The column of the DataFrame to use as the line value. When used, the Line will be named after this column.
|
||||
"""
|
||||
if data.empty or data is None:
|
||||
self.run_script(f'{self.id}.series.setData([]); {self.id}.name = "{name}"')
|
||||
self.run_script(f'{self.id}.series.setData([])')
|
||||
return
|
||||
df = self._df_datetime_format(data, exclude_lowercase=name)
|
||||
if name:
|
||||
if name not in data:
|
||||
raise NameError(f'No column named "{name}".')
|
||||
self.name = name
|
||||
df = df.rename(columns={name: 'value'})
|
||||
df = self._df_datetime_format(data, exclude_lowercase=self.name)
|
||||
if self.name:
|
||||
if self.name not in data:
|
||||
raise NameError(f'No column named "{self.name}".')
|
||||
df = df.rename(columns={self.name: 'value'})
|
||||
self._last_bar = df.iloc[-1]
|
||||
self.run_script(f'{self.id}.series.setData({df.to_dict("records")}); {self.id}.name = "{name}"')
|
||||
self.run_script(f'{self.id}.series.setData({df.to_dict("records")})')
|
||||
|
||||
def update(self, series: pd.Series):
|
||||
"""
|
||||
@ -300,14 +311,14 @@ class Line(SeriesCommon):
|
||||
|
||||
def _set_trend(self, start_time, start_value, end_time, end_value, ray=False):
|
||||
def time_format(time_val):
|
||||
time_val = self._chart._datetime_format(time_val)
|
||||
time_val = pd.to_datetime(time_val)
|
||||
time_val = time_val.timestamp() if self._chart._interval < pd.Timedelta(days=1) else time_val.strftime('%Y-%m-%d')
|
||||
return f"'{time_val}'" if isinstance(time_val, str) else time_val
|
||||
self.run_script(f'''
|
||||
let logical
|
||||
if ({_js_bool(ray)}) logical = {self._chart.id}.chart.timeScale().getVisibleLogicalRange()
|
||||
{self._chart.id}.chart.timeScale().applyOptions({{shiftVisibleRangeOnNewBar: false}})
|
||||
{self.id}.series.setData(calculateTrendLine({time_format(start_time)}, {start_value}, {time_format(end_time)}, {end_value},
|
||||
{self._chart._interval.total_seconds()*1000}, {self._chart.id}, {_js_bool(ray)}))
|
||||
if (logical) {self._chart.id}.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
{self._chart._interval.total_seconds()*1000}, {self._chart.id}, {jbool(ray)}))
|
||||
{self._chart.id}.chart.timeScale().applyOptions({{shiftVisibleRangeOnNewBar: true}})
|
||||
''')
|
||||
|
||||
def delete(self):
|
||||
@ -323,17 +334,24 @@ class Line(SeriesCommon):
|
||||
|
||||
|
||||
class Widget:
|
||||
def __init__(self, topbar):
|
||||
def __init__(self, topbar, value, func=None):
|
||||
self._chart = topbar._chart
|
||||
self._method = None
|
||||
self.id = topbar._chart._rand.generate()
|
||||
self.value = value
|
||||
self._handler = func
|
||||
def wrapper(v):
|
||||
self.value = v
|
||||
func(topbar._chart)
|
||||
async def async_wrapper(v):
|
||||
self.value = v
|
||||
await func(topbar._chart)
|
||||
self._chart._handlers[self.id] = async_wrapper if asyncio.iscoroutinefunction(func) else wrapper
|
||||
|
||||
|
||||
class TextWidget(Widget):
|
||||
def __init__(self, topbar, initial_text):
|
||||
super().__init__(topbar)
|
||||
self.value = initial_text
|
||||
self.id = self._chart._rand.generate()
|
||||
self._chart.run_script(f'''{self.id} = makeTextBoxWidget({self._chart.id}, "{initial_text}")''')
|
||||
super().__init__(topbar, value=initial_text)
|
||||
self._chart.run_script(f'{self.id} = {topbar.id}.makeTextBoxWidget("{initial_text}")')
|
||||
|
||||
def set(self, string):
|
||||
self.value = string
|
||||
@ -341,42 +359,75 @@ class TextWidget(Widget):
|
||||
|
||||
|
||||
class SwitcherWidget(Widget):
|
||||
def __init__(self, topbar, method, *options, default):
|
||||
super().__init__(topbar)
|
||||
self.value = default
|
||||
self._method = str(method)
|
||||
def __init__(self, topbar, options, default, func):
|
||||
super().__init__(topbar, value=default, func=func)
|
||||
self._chart.run_script(f'''
|
||||
makeSwitcher({self._chart.id}, {list(options)}, '{default}', '{self._method}',
|
||||
'{topbar.active_background_color}', '{topbar.active_text_color}', '{topbar.text_color}', '{topbar.hover_color}')
|
||||
reSize({self._chart.id})
|
||||
{self.id} = {topbar.id}.makeSwitcher({list(options)}, '{default}', '{self.id}')
|
||||
reSize({self._chart.id})
|
||||
''')
|
||||
|
||||
|
||||
class ButtonWidget(Widget):
|
||||
def __init__(self, topbar, button, separator, func):
|
||||
super().__init__(topbar, value=button, func=func)
|
||||
self._chart.run_script(f'''
|
||||
{self.id} = {topbar.id}.makeButton('{button}', '{self.id}')
|
||||
{f'{topbar.id}.makeSeparator()' if separator else ''}
|
||||
reSize({self._chart.id})
|
||||
''')
|
||||
|
||||
def set(self, string):
|
||||
self.value = string
|
||||
self._chart.run_script(f'{self.id}.elem.innerText = "{string}"')
|
||||
|
||||
|
||||
class TopBar:
|
||||
def __init__(self, chart):
|
||||
self._chart = chart
|
||||
self.id = chart._rand.generate()
|
||||
self._widgets: Dict[str, Widget] = {}
|
||||
|
||||
self.click_bg_color = '#50565E'
|
||||
self.hover_bg_color = '#3c434c'
|
||||
self.active_bg_color = 'rgba(0, 122, 255, 0.7)'
|
||||
self.active_text_color = '#ececed'
|
||||
self.text_color = '#d8d9db'
|
||||
self._created = False
|
||||
|
||||
def _create(self):
|
||||
if self._created:
|
||||
return
|
||||
self._created = True
|
||||
if not self._chart._callbacks_enabled:
|
||||
self._chart._callbacks_enabled = True
|
||||
self._chart.run_script(JS['callback'])
|
||||
self._chart.run_script(f'''
|
||||
makeTopBar({self._chart.id})
|
||||
reSize({self._chart.id})
|
||||
{self.id} = new TopBar({self._chart.id}, '{self.hover_bg_color}', '{self.click_bg_color}',
|
||||
'{self.active_bg_color}', '{self.text_color}', '{self.active_text_color}')
|
||||
{self._chart.id}.topBar = {self.id}.topBar
|
||||
reSize({self._chart.id})
|
||||
''')
|
||||
self.active_background_color = 'rgba(0, 122, 255, 0.7)'
|
||||
self.active_text_color = 'rgb(240, 240, 240)'
|
||||
self.text_color = 'lightgrey'
|
||||
self.hover_color = 'rgb(60, 60, 60)'
|
||||
|
||||
def __getitem__(self, item): return self._widgets.get(item)
|
||||
def __getitem__(self, item):
|
||||
if widget := self._widgets.get(item):
|
||||
return widget
|
||||
raise KeyError(f'Topbar widget "{item}" not found.')
|
||||
|
||||
def switcher(self, name, method, *options, default=None):
|
||||
self._chart._methods[str(method)] = method
|
||||
self._widgets[name] = SwitcherWidget(self, method, *options, default=default if default else options[0])
|
||||
def get(self, widget_name): return self._widgets.get(widget_name)
|
||||
|
||||
def textbox(self, name, initial_text=''): self._widgets[name] = TextWidget(self, initial_text)
|
||||
def __setitem__(self, key, value): self._widgets[key] = value
|
||||
|
||||
def _widget_with_method(self, method_name):
|
||||
for widget in self._widgets.values():
|
||||
if widget._method == method_name:
|
||||
return widget
|
||||
def switcher(self, name, options: tuple, default: str = None, func: callable = None):
|
||||
self._create()
|
||||
self._widgets[name] = SwitcherWidget(self, options, default if default else options[0], func)
|
||||
|
||||
def textbox(self, name: str, initial_text: str = ''):
|
||||
self._create()
|
||||
self._widgets[name] = TextWidget(self, initial_text)
|
||||
|
||||
def button(self, name, button_text: str, separator: bool = True, func: callable = None):
|
||||
self._create()
|
||||
self._widgets[name] = ButtonWidget(self, button_text, separator, func)
|
||||
|
||||
|
||||
class ToolBox:
|
||||
@ -385,7 +436,8 @@ class ToolBox:
|
||||
self.id = chart.id
|
||||
self._return_q = chart._return_q
|
||||
self._save_under = None
|
||||
self._saved_drawings = {}
|
||||
self.drawings = {}
|
||||
chart._handlers[f'save_drawings{self.id}'] = self._save_drawings
|
||||
|
||||
def save_drawings_under(self, widget: Widget):
|
||||
"""
|
||||
@ -397,9 +449,9 @@ class ToolBox:
|
||||
"""
|
||||
Loads and displays the drawings on the chart stored under the tag given.
|
||||
"""
|
||||
if not self._saved_drawings.get(tag):
|
||||
if not self.drawings.get(tag):
|
||||
return
|
||||
self.run_script(f'if ("toolBox" in {self.id}) {self.id}.toolBox.loadDrawings({json.dumps(self._saved_drawings[tag])})')
|
||||
self.run_script(f'if ("toolBox" in {self.id}) {self.id}.toolBox.loadDrawings({json.dumps(self.drawings[tag])})')
|
||||
|
||||
def import_drawings(self, file_path):
|
||||
"""
|
||||
@ -407,47 +459,48 @@ class ToolBox:
|
||||
"""
|
||||
with open(file_path, 'r') as f:
|
||||
json_data = json.load(f)
|
||||
self._saved_drawings = json_data
|
||||
self.drawings = json_data
|
||||
|
||||
def export_drawings(self, file_path):
|
||||
"""
|
||||
Exports the current list of drawings to the given file path.
|
||||
"""
|
||||
with open(file_path, 'w+') as f:
|
||||
json.dump(self._saved_drawings, f, indent=4)
|
||||
json.dump(self.drawings, f, indent=4)
|
||||
|
||||
def _save_drawings(self, drawings):
|
||||
if not self._save_under:
|
||||
return
|
||||
self._saved_drawings[self._save_under.value] = json.loads(drawings)
|
||||
self.drawings[self._save_under.value] = json.loads(drawings)
|
||||
|
||||
|
||||
class LWC(SeriesCommon):
|
||||
def __init__(self, volume_enabled: bool = True, inner_width: float = 1.0, inner_height: float = 1.0, dynamic_loading: bool = False,
|
||||
scale_candles_only: bool = False, topbar: bool = False, searchbox: bool = False, toolbox: bool = False,
|
||||
_js_api_code: str = None, autosize=True, _run_script=None):
|
||||
self.volume_enabled = volume_enabled
|
||||
def __init__(self, inner_width: float = 1.0, inner_height: float = 1.0,
|
||||
scale_candles_only: bool = False, toolbox: bool = False, _js_api_code: str = None,
|
||||
autosize: bool = True, _run_script=None):
|
||||
self.loaded = False
|
||||
self._scripts = []
|
||||
self._final_scripts = []
|
||||
if _run_script:
|
||||
self.run_script = _run_script
|
||||
self.run_script(f'window.callbackFunction = {_js_api_code}') if _js_api_code else None
|
||||
self._scale_candles_only = scale_candles_only
|
||||
self._inner_width = inner_width
|
||||
self._inner_height = inner_height
|
||||
self._dynamic_loading = dynamic_loading
|
||||
if _run_script:
|
||||
self.run_script = _run_script
|
||||
self._rand = IDGen()
|
||||
self.id = self._rand.generate()
|
||||
self._position = 'left'
|
||||
self.loaded = False
|
||||
self._html = HTML
|
||||
self._scripts = []
|
||||
self._final_scripts = []
|
||||
self._script_func = None
|
||||
self.candle_data = pd.DataFrame()
|
||||
self._last_bar = None
|
||||
self._interval = None
|
||||
self._charts = {self.id: self}
|
||||
self._lines = []
|
||||
self.run_script(f'window.callbackFunction = {_js_api_code}') if _js_api_code else None
|
||||
self._methods = {}
|
||||
self.events: Events = Events(self)
|
||||
self._handlers = {}
|
||||
self._return_q = None
|
||||
self._callbacks_enabled = False
|
||||
self.topbar: TopBar = TopBar(self)
|
||||
|
||||
self._background_color = '#000000'
|
||||
self._volume_up_color = 'rgba(83,141,131,0.8)'
|
||||
@ -457,7 +510,7 @@ class LWC(SeriesCommon):
|
||||
self.polygon: PolygonAPI = PolygonAPI(self)
|
||||
|
||||
self.run_script(f'''
|
||||
{self.id} = makeChart({self._inner_width}, {self._inner_height}, autoSize={_js_bool(autosize)})
|
||||
{self.id} = makeChart({self._inner_width}, {self._inner_height}, autoSize={jbool(autosize)})
|
||||
{self.id}.id = '{self.id}'
|
||||
{self.id}.wrapper.style.float = "{self._position}"
|
||||
''')
|
||||
@ -465,12 +518,6 @@ class LWC(SeriesCommon):
|
||||
self.run_script(JS['toolbox'])
|
||||
self.run_script(f'{self.id}.toolBox = new ToolBox({self.id})')
|
||||
self.toolbox: ToolBox = ToolBox(self)
|
||||
if not topbar and not searchbox:
|
||||
return
|
||||
self.run_script(JS['callback'])
|
||||
self.run_script(f'makeSpinner({self.id})')
|
||||
self.topbar = TopBar(self) if topbar else None
|
||||
self.run_script(f'{self.id}.search = makeSearchBox({self.id})') if searchbox else None
|
||||
|
||||
def _on_js_load(self):
|
||||
if self.loaded:
|
||||
@ -479,7 +526,7 @@ class LWC(SeriesCommon):
|
||||
[self.run_script(script) for script in self._scripts]
|
||||
[self.run_script(script) for script in self._final_scripts]
|
||||
|
||||
def run_script(self, script, run_last=False):
|
||||
def run_script(self, script: str, run_last: bool = False):
|
||||
"""
|
||||
For advanced users; evaluates JavaScript within the Webview.
|
||||
"""
|
||||
@ -498,14 +545,13 @@ class LWC(SeriesCommon):
|
||||
if df.empty or df is None:
|
||||
self.run_script(f'{self.id}.series.setData([])')
|
||||
self.run_script(f'{self.id}.volumeSeries.setData([])')
|
||||
# self.run_script(f"if ('toolBox' in {self.id}) {self.id}.toolBox.{render_or_clear}()")
|
||||
self.candle_data = pd.DataFrame()
|
||||
return
|
||||
bars = self._df_datetime_format(df)
|
||||
self.candle_data = bars.copy()
|
||||
self._last_bar = bars.iloc[-1]
|
||||
if self.volume_enabled:
|
||||
if 'volume' not in bars:
|
||||
raise MissingColumn("Volume enabled, but 'volume' column was not found.")
|
||||
|
||||
if 'volume' in bars:
|
||||
volume = bars.drop(columns=['open', 'high', 'low', 'close']).rename(columns={'volume': 'value'})
|
||||
volume['color'] = self._volume_down_color
|
||||
volume.loc[bars['close'] > bars['open'], 'color'] = self._volume_up_color
|
||||
@ -513,89 +559,39 @@ class LWC(SeriesCommon):
|
||||
bars = bars.drop(columns=['volume'])
|
||||
|
||||
bars = bars.to_dict(orient='records')
|
||||
self.run_script(f'''
|
||||
{self.id}.candleData = {bars}
|
||||
{self.id}.shownData = ({self.id}.candleData.length >= 190) ? {self.id}.candleData.slice(-190) : {self.id}.candleData
|
||||
{self.id}.series.setData({self.id}.shownData);
|
||||
|
||||
var timer = null;
|
||||
{self.id}.chart.timeScale().subscribeVisibleLogicalRangeChange(() => {{
|
||||
if (timer !== null) {{
|
||||
return;
|
||||
}}
|
||||
timer = setTimeout(() => {{
|
||||
let chart = {self.id}
|
||||
let logicalRange = chart.chart.timeScale().getVisibleLogicalRange();
|
||||
if (logicalRange !== null) {{
|
||||
let barsInfo = chart.series.barsInLogicalRange(logicalRange);
|
||||
if (barsInfo === null || barsInfo.barsBefore === null || barsInfo.barsAfter === null) {{return}}
|
||||
if (barsInfo !== null && barsInfo.barsBefore < 20 || barsInfo.barsAfter < 20) {{
|
||||
let newBeginning = chart.candleData.indexOf(chart.shownData[0])+Math.round(barsInfo.barsBefore)-20
|
||||
let newEnd = chart.candleData.indexOf(chart.shownData[chart.shownData.length-2])-Math.round(barsInfo.barsAfter)+20
|
||||
if (newBeginning < 0) {{
|
||||
newBeginning = 0
|
||||
}}
|
||||
chart.shownData = chart.candleData.slice(newBeginning, newEnd)
|
||||
if (newEnd-17 <= chart.candleData.length-1) {{
|
||||
chart.shownData[chart.shownData.length - 1] = Object.assign({{}}, chart.shownData[chart.shownData.length - 1]);
|
||||
chart.shownData[chart.shownData.length - 1].open = chart.candleData[chart.candleData.length - 1].close;
|
||||
chart.shownData[chart.shownData.length - 1].high = chart.candleData[chart.candleData.length - 1].close;
|
||||
chart.shownData[chart.shownData.length - 1].low = chart.candleData[chart.candleData.length - 1].close;
|
||||
chart.shownData[chart.shownData.length - 1].close = chart.candleData[chart.candleData.length - 1].close;
|
||||
}}
|
||||
chart.series.setData(chart.shownData);
|
||||
}}
|
||||
}}
|
||||
timer = null;
|
||||
}}, 50);
|
||||
}});
|
||||
''') if self._dynamic_loading else self.run_script(f'{self.id}.candleData = {bars}; {self.id}.series.setData({self.id}.candleData)')
|
||||
self.run_script(f'{self.id}.candleData = {bars}; {self.id}.series.setData({self.id}.candleData)')
|
||||
self.run_script(f"if ('toolBox' in {self.id}) {self.id}.toolBox.{'clearDrawings' if not render_drawings else 'renderDrawings'}()")
|
||||
|
||||
# for line in self._lines:
|
||||
# if line.name in df.columns:
|
||||
# line.set()
|
||||
|
||||
def fit(self):
|
||||
"""
|
||||
Fits the maximum amount of the chart data within the viewport.
|
||||
"""
|
||||
self.run_script(f'{self.id}.chart.timeScale().fitContent()')
|
||||
|
||||
def update(self, series, from_tick=False):
|
||||
def update(self, series: pd.Series, _from_tick=False):
|
||||
"""
|
||||
Updates the data from a bar;
|
||||
if series['time'] is the same time as the last bar, the last bar will be overwritten.\n
|
||||
:param series: labels: date/time, open, high, low, close, volume (if volume enabled).
|
||||
"""
|
||||
series = self._series_datetime_format(series) if not from_tick else series
|
||||
series = self._series_datetime_format(series) if not _from_tick else series
|
||||
if series['time'] != self._last_bar['time']:
|
||||
self.candle_data.loc[self.candle_data.index[-1]] = self._last_bar
|
||||
self.candle_data = pd.concat([self.candle_data, series.to_frame().T], ignore_index=True)
|
||||
self.events.new_bar._emit(self)
|
||||
self._last_bar = series
|
||||
if self.volume_enabled:
|
||||
if 'volume' not in series:
|
||||
raise MissingColumn("Volume enabled, but 'volume' column was not found.")
|
||||
|
||||
if 'volume' in series:
|
||||
volume = series.drop(['open', 'high', 'low', 'close']).rename({'volume': 'value'})
|
||||
volume['color'] = self._volume_up_color if series['close'] > series['open'] else self._volume_down_color
|
||||
self.run_script(f'{self.id}.volumeSeries.update({volume.to_dict()})')
|
||||
series = series.drop(['volume'])
|
||||
bar = series.to_dict()
|
||||
self.run_script(f'''
|
||||
|
||||
let logicalRange = {self.id}.chart.timeScale().getVisibleLogicalRange();
|
||||
let barsInfo = {self.id}.series.barsInLogicalRange(logicalRange);
|
||||
|
||||
if ({self.id}.candleData[{self.id}.candleData.length-1].time === {bar['time']}) {{
|
||||
{self.id}.shownData[{self.id}.shownData.length-1] = {bar}
|
||||
{self.id}.candleData[{self.id}.candleData.length-1] = {bar}
|
||||
}}
|
||||
else {{
|
||||
if (barsInfo.barsAfter > 0) {{
|
||||
{self.id}.shownData[{self.id}.shownData.length-1] = {bar}
|
||||
}}
|
||||
else {{
|
||||
{self.id}.shownData.push({bar})
|
||||
}}
|
||||
|
||||
{self.id}.candleData.push({bar})
|
||||
}}
|
||||
{self.id}.series.update({self.id}.shownData[{self.id}.shownData.length-1])
|
||||
''') if self._dynamic_loading else self.run_script(f'''
|
||||
if (chartTimeToDate({self.id}.candleData[{self.id}.candleData.length-1].time).getTime() === chartTimeToDate({bar['time']}).getTime()) {{
|
||||
{self.id}.candleData[{self.id}.candleData.length-1] = {bar}
|
||||
}}
|
||||
@ -605,7 +601,7 @@ class LWC(SeriesCommon):
|
||||
{self.id}.series.update({bar})
|
||||
''')
|
||||
|
||||
def update_from_tick(self, series, cumulative_volume=False):
|
||||
def update_from_tick(self, series: pd.Series, cumulative_volume: bool = False):
|
||||
"""
|
||||
Updates the data from a tick.\n
|
||||
:param series: labels: date/time, price, volume (if volume enabled).
|
||||
@ -618,10 +614,8 @@ class LWC(SeriesCommon):
|
||||
bar['high'] = max(self._last_bar['high'], series['price'])
|
||||
bar['low'] = min(self._last_bar['low'], series['price'])
|
||||
bar['close'] = series['price']
|
||||
if self.volume_enabled:
|
||||
if 'volume' not in series:
|
||||
raise MissingColumn("Volume enabled, but 'volume' column was not found.")
|
||||
elif cumulative_volume:
|
||||
if 'volume' in series:
|
||||
if cumulative_volume:
|
||||
bar['volume'] += series['volume']
|
||||
else:
|
||||
bar['volume'] = series['volume']
|
||||
@ -629,15 +623,16 @@ class LWC(SeriesCommon):
|
||||
for key in ('open', 'high', 'low', 'close'):
|
||||
bar[key] = series['price']
|
||||
bar['time'] = series['time']
|
||||
bar['volume'] = 0
|
||||
self.update(bar, from_tick=True)
|
||||
if 'volume' in series:
|
||||
bar['volume'] = series['volume']
|
||||
self.update(bar, _from_tick=True)
|
||||
|
||||
def create_line(self, color: str = 'rgba(214, 237, 255, 0.6)', width: int = 2,
|
||||
def create_line(self, name: str = '', color: str = 'rgba(214, 237, 255, 0.6)', style: LINE_STYLE = 'solid', width: int = 2,
|
||||
price_line: bool = True, price_label: bool = True) -> Line:
|
||||
"""
|
||||
Creates and returns a Line object.)\n
|
||||
"""
|
||||
self._lines.append(Line(self, color, width, price_line, price_label))
|
||||
self._lines.append(Line(self, name, color, style, width, price_line, price_label))
|
||||
return self._lines[-1]
|
||||
|
||||
def lines(self) -> List[Line]:
|
||||
@ -647,12 +642,12 @@ class LWC(SeriesCommon):
|
||||
return self._lines.copy()
|
||||
|
||||
def trend_line(self, start_time, start_value, end_time, end_value, color: str = '#1E80F0', width: int = 2) -> Line:
|
||||
line = Line(self, color, width, price_line=False, price_label=False, crosshair_marker=False)
|
||||
line = Line(self, '', color, 'solid', width, price_line=False, price_label=False, crosshair_marker=False)
|
||||
line._set_trend(start_time, start_value, end_time, end_value, ray=False)
|
||||
return line
|
||||
|
||||
def ray_line(self, start_time, value, color: str = '#1E80F0', width: int = 2) -> Line:
|
||||
line = Line(self, color, width, price_line=False, price_label=False, crosshair_marker=False)
|
||||
line = Line(self, '', color, 'solid', width, price_line=False, price_label=False, crosshair_marker=False)
|
||||
line._set_trend(start_time, value, start_time, value, ray=True)
|
||||
return line
|
||||
|
||||
@ -661,13 +656,13 @@ class LWC(SeriesCommon):
|
||||
ticks_visible: bool = False, scale_margin_top: float = 0.2, scale_margin_bottom: float = 0.2):
|
||||
self.run_script(f'''
|
||||
{self.id}.series.priceScale().applyOptions({{
|
||||
mode: {_price_scale_mode(mode)},
|
||||
alignLabels: {_js_bool(align_labels)},
|
||||
borderVisible: {_js_bool(border_visible)},
|
||||
mode: {price_scale_mode(mode)},
|
||||
alignLabels: {jbool(align_labels)},
|
||||
borderVisible: {jbool(border_visible)},
|
||||
{f'borderColor: "{border_color}",' if border_color else ''}
|
||||
{f'textColor: "{text_color}",' if text_color else ''}
|
||||
entireTextOnly: {_js_bool(entire_text_only)},
|
||||
ticksVisible: {_js_bool(ticks_visible)},
|
||||
entireTextOnly: {jbool(entire_text_only)},
|
||||
ticksVisible: {jbool(ticks_visible)},
|
||||
scaleMargins: {{top: {scale_margin_top}, bottom: {scale_margin_bottom}}}
|
||||
}})''')
|
||||
|
||||
@ -682,10 +677,10 @@ class LWC(SeriesCommon):
|
||||
timeScale: {{
|
||||
rightOffset: {right_offset},
|
||||
minBarSpacing: {min_bar_spacing},
|
||||
visible: {_js_bool(visible)},
|
||||
timeVisible: {_js_bool(time_visible)},
|
||||
secondsVisible: {_js_bool(seconds_visible)},
|
||||
borderVisible: {_js_bool(border_visible)},
|
||||
visible: {jbool(visible)},
|
||||
timeVisible: {jbool(time_visible)},
|
||||
secondsVisible: {jbool(seconds_visible)},
|
||||
borderVisible: {jbool(border_visible)},
|
||||
{f'borderColor: "{border_color}",' if border_color else ''}
|
||||
}}
|
||||
}})''')
|
||||
@ -716,14 +711,14 @@ class LWC(SeriesCommon):
|
||||
{self.id}.chart.applyOptions({{
|
||||
grid: {{
|
||||
vertLines: {{
|
||||
visible: {_js_bool(vert_enabled)},
|
||||
visible: {jbool(vert_enabled)},
|
||||
color: "{color}",
|
||||
style: {_line_style(style)},
|
||||
style: {line_style(style)},
|
||||
}},
|
||||
horzLines: {{
|
||||
visible: {_js_bool(horz_enabled)},
|
||||
visible: {jbool(horz_enabled)},
|
||||
color: "{color}",
|
||||
style: {_line_style(style)},
|
||||
style: {line_style(style)},
|
||||
}},
|
||||
}}
|
||||
}})""")
|
||||
@ -732,18 +727,19 @@ class LWC(SeriesCommon):
|
||||
wick_enabled: bool = True, border_enabled: bool = True, border_up_color: str = '',
|
||||
border_down_color: str = '', wick_up_color: str = '', wick_down_color: str = ''):
|
||||
"""
|
||||
Candle styling for each of its parts.
|
||||
Candle styling for each of its parts.\n
|
||||
If only `up_color` and `down_color` are passed, they will color all parts of the candle.
|
||||
"""
|
||||
self.run_script(f"""
|
||||
{self.id}.series.applyOptions({{
|
||||
upColor: "{up_color}",
|
||||
downColor: "{down_color}",
|
||||
wickVisible: {_js_bool(wick_enabled)},
|
||||
borderVisible: {_js_bool(border_enabled)},
|
||||
{f'borderUpColor: "{border_up_color}",' if border_up_color else up_color if border_enabled else ''}
|
||||
{f'borderDownColor: "{border_down_color}",' if border_down_color else down_color if border_enabled else ''}
|
||||
{f'wickUpColor: "{wick_up_color}",' if wick_up_color else wick_up_color if wick_enabled else ''}
|
||||
{f'wickDownColor: "{wick_down_color}",' if wick_down_color else wick_down_color if wick_enabled else ''}
|
||||
wickVisible: {jbool(wick_enabled)},
|
||||
borderVisible: {jbool(border_enabled)},
|
||||
{f'borderUpColor: "{border_up_color if border_up_color else up_color}",' if border_enabled else ''}
|
||||
{f'borderDownColor: "{border_down_color if border_down_color else down_color}",' if border_enabled else ''}
|
||||
{f'wickUpColor: "{wick_up_color if wick_up_color else up_color}",' if wick_enabled else ''}
|
||||
{f'wickDownColor: "{wick_down_color if wick_down_color else down_color}",' if wick_enabled else ''}
|
||||
}})""")
|
||||
|
||||
def volume_config(self, scale_margin_top: float = 0.8, scale_margin_bottom: float = 0.0,
|
||||
@ -776,19 +772,19 @@ class LWC(SeriesCommon):
|
||||
self.run_script(f'''
|
||||
{self.id}.chart.applyOptions({{
|
||||
crosshair: {{
|
||||
mode: {_crosshair_mode(mode)},
|
||||
mode: {crosshair_mode(mode)},
|
||||
vertLine: {{
|
||||
visible: {_js_bool(vert_visible)},
|
||||
visible: {jbool(vert_visible)},
|
||||
width: {vert_width},
|
||||
{f'color: "{vert_color}",' if vert_color else ''}
|
||||
style: {_line_style(vert_style)},
|
||||
style: {line_style(vert_style)},
|
||||
labelBackgroundColor: "{vert_label_background_color}"
|
||||
}},
|
||||
horzLine: {{
|
||||
visible: {_js_bool(horz_visible)},
|
||||
visible: {jbool(horz_visible)},
|
||||
width: {horz_width},
|
||||
{f'color: "{horz_color}",' if horz_color else ''}
|
||||
style: {_line_style(horz_style)},
|
||||
style: {line_style(horz_style)},
|
||||
labelBackgroundColor: "{horz_label_background_color}"
|
||||
}}
|
||||
}}}})''')
|
||||
@ -817,7 +813,7 @@ class LWC(SeriesCommon):
|
||||
if not visible:
|
||||
return
|
||||
self.run_script(f'''
|
||||
{self.id}.legend = new Legend({self.id}, {_js_bool(ohlc)}, {_js_bool(percent)}, {_js_bool(lines)}, '{color}', {font_size}, '{font_family}')
|
||||
{self.id}.legend = new Legend({self.id}, {jbool(ohlc)}, {jbool(percent)}, {jbool(lines)}, '{color}', {font_size}, '{font_family}')
|
||||
''')
|
||||
|
||||
def spinner(self, visible): self.run_script(f"{self.id}.spinner.style.display = '{'block' if visible else 'none'}'")
|
||||
@ -840,42 +836,40 @@ class LWC(SeriesCommon):
|
||||
serial_data = self._return_q.get()
|
||||
return b64decode(serial_data.split(',')[1])
|
||||
|
||||
def add_hotkey(self, modifier_key: Literal['ctrl', 'alt', 'shift', 'meta'], keys: Union[str, tuple, int], method):
|
||||
self._methods[str(method)] = method
|
||||
def hotkey(self, modifier_key: Literal['ctrl', 'alt', 'shift', 'meta'], keys: Union[str, tuple, int], func: callable):
|
||||
if not isinstance(keys, tuple): keys = (keys,)
|
||||
for key in keys:
|
||||
key_code = 'Key' + key.upper() if isinstance(key, str) else 'Digit' + str(key)
|
||||
self.run_script(f'''
|
||||
{self.id}.commandFunctions.unshift((event) => {{
|
||||
if (event.{modifier_key + 'Key'} && event.code === '{key_code}') {{
|
||||
event.preventDefault()
|
||||
window.callbackFunction(`{str(method)}_~_{self.id}_~_{key}`)
|
||||
return true
|
||||
}}
|
||||
else return false
|
||||
{self.id}.commandFunctions.unshift((event) => {{
|
||||
if (event.{modifier_key + 'Key'} && event.code === '{key_code}') {{
|
||||
event.preventDefault()
|
||||
window.callbackFunction(`{modifier_key, keys}_~_{key}`)
|
||||
return true
|
||||
}}
|
||||
else return false
|
||||
}})''')
|
||||
self._handlers[f'{modifier_key, keys}'] = func
|
||||
|
||||
def create_table(self, width: Union[float, int], height: Union[float, int], headings: tuple, widths: tuple = None, alignments: tuple = None,
|
||||
position: str = 'left', draggable: bool = False, method: object = None):
|
||||
self._methods[str(method)] = method
|
||||
return Table(self, width, height, headings, widths, alignments, position, draggable, method)
|
||||
position: str = 'left', draggable: bool = False, func: callable = None) -> Table:
|
||||
return Table(self, width, height, headings, widths, alignments, position, draggable, func)
|
||||
|
||||
def create_subchart(self, volume_enabled: bool = True, position: Literal['left', 'right', 'top', 'bottom'] = 'left',
|
||||
width: float = 0.5, height: float = 0.5, sync: Union[bool, str] = False, dynamic_loading: bool = False,
|
||||
scale_candles_only: bool = False, topbar: bool = False, searchbox: bool = False, toolbox: bool = False):
|
||||
subchart = SubChart(self, volume_enabled, position, width, height, sync, dynamic_loading, scale_candles_only, topbar, searchbox, toolbox)
|
||||
self._charts[subchart.id] = subchart
|
||||
return subchart
|
||||
def create_subchart(self, position: Literal['left', 'right', 'top', 'bottom'] = 'left', width: float = 0.5, height: float = 0.5,
|
||||
sync: Union[bool, str] = False, scale_candles_only: bool = False, toolbox: bool = False):
|
||||
return SubChart(self, position, width, height, sync, scale_candles_only, toolbox)
|
||||
|
||||
|
||||
class SubChart(LWC):
|
||||
def __init__(self, parent, volume_enabled, position, width, height, sync, dynamic_loading, scale_candles_only, topbar, searchbox, toolbox):
|
||||
def __init__(self, parent, position, width, height, sync, scale_candles_only, toolbox):
|
||||
self._chart = parent._chart if isinstance(parent, SubChart) else parent
|
||||
super().__init__(volume_enabled, width, height, dynamic_loading, scale_candles_only, topbar, searchbox, toolbox, _run_script=self._chart.run_script)
|
||||
super().__init__(width, height, scale_candles_only, toolbox, _run_script=self._chart.run_script)
|
||||
self._parent = parent
|
||||
self._position = position
|
||||
self._return_q = self._chart._return_q
|
||||
self._charts = self._chart._charts
|
||||
for key, val in self._handlers.items():
|
||||
self._chart._handlers[key] = val
|
||||
self._handlers = self._chart._handlers
|
||||
self.polygon = self._chart.polygon._subchart(self)
|
||||
|
||||
if not sync:
|
||||
|
||||
@ -14,10 +14,8 @@ class CallbackAPI:
|
||||
self.emit_q, self.return_q = emit_queue, return_queue
|
||||
|
||||
def callback(self, message: str):
|
||||
messages = message.split('_~_')
|
||||
name, chart_id = messages[:2]
|
||||
args = messages[2:]
|
||||
self.return_q.put(*args) if name == 'return' else self.emit_q.put((name, chart_id, *args))
|
||||
name, args = message.split('_~_')
|
||||
self.return_q.put(*args) if name == 'return' else self.emit_q.put((name, args.split(';;;')))
|
||||
|
||||
|
||||
class PyWV:
|
||||
@ -60,22 +58,21 @@ class PyWV:
|
||||
|
||||
|
||||
class Chart(LWC):
|
||||
def __init__(self, volume_enabled: bool = True, width: int = 800, height: int = 600, x: int = None, y: int = None,
|
||||
on_top: bool = False, maximize: bool = False, debug: bool = False,
|
||||
api: object = None, topbar: bool = False, searchbox: bool = False, toolbox: bool = False,
|
||||
inner_width: float = 1.0, inner_height: float = 1.0, dynamic_loading: bool = False, scale_candles_only: bool = False):
|
||||
super().__init__(volume_enabled, inner_width, inner_height, dynamic_loading, scale_candles_only, topbar, searchbox, toolbox, 'pywebview.api.callback')
|
||||
def __init__(self, width: int = 800, height: int = 600, x: int = None, y: int = None,
|
||||
on_top: bool = False, maximize: bool = False, debug: bool = False, toolbox: bool = False,
|
||||
inner_width: float = 1.0, inner_height: float = 1.0, scale_candles_only: bool = False):
|
||||
super().__init__(inner_width, inner_height, scale_candles_only, toolbox, 'pywebview.api.callback')
|
||||
global chart, num_charts
|
||||
|
||||
if chart:
|
||||
self._q, self._exit, self._start, self._process = chart._q, chart._exit, chart._start, chart._process
|
||||
self._emit_q, self._return_q = mp.Queue(), mp.Queue()
|
||||
chart._charts[self.id] = self
|
||||
self._api = chart._api
|
||||
for key, val in self._handlers.items():
|
||||
chart._handlers[key] = val
|
||||
self._handlers = chart._handlers
|
||||
self._loaded = chart._loaded_list[num_charts]
|
||||
self._q.put(('create_window', (self._html, on_top, width, height, x, y)))
|
||||
else:
|
||||
self._api = api
|
||||
self._q, self._emit_q, self._return_q = (mp.Queue() for _ in range(3))
|
||||
self._loaded_list = [mp.Event() for _ in range(10)]
|
||||
self._loaded = self._loaded_list[0]
|
||||
@ -117,20 +114,9 @@ class Chart(LWC):
|
||||
self._exit.clear()
|
||||
return
|
||||
elif not self._emit_q.empty():
|
||||
name, chart_id, arg = self._emit_q.get()
|
||||
if self._api:
|
||||
self._api.chart = self._charts[chart_id]
|
||||
if self._api and name == 'save_drawings':
|
||||
func = self._api.chart.toolbox._save_drawings
|
||||
elif name in ('on_search', 'on_horizontal_line_move'):
|
||||
func = getattr(self._api, name)
|
||||
else:
|
||||
func = self._methods[name]
|
||||
if self._api and hasattr(self._api.chart, 'topbar') and (widget := self._api.chart.topbar._widget_with_method(name)):
|
||||
widget.value = arg
|
||||
await func() if asyncio.iscoroutinefunction(func) else func()
|
||||
else:
|
||||
await func(*arg.split(';;;')) if asyncio.iscoroutinefunction(func) else func(*arg.split(';;;'))
|
||||
name, args = self._emit_q.get()
|
||||
func = self._handlers[name]
|
||||
await func(*args) if asyncio.iscoroutinefunction(func) else func(*args)
|
||||
continue
|
||||
value = self.polygon._q.get()
|
||||
func, args = value[0], value[1:]
|
||||
@ -148,12 +134,10 @@ class Chart(LWC):
|
||||
"""
|
||||
Exits and destroys the chart window.\n
|
||||
"""
|
||||
if not self.loaded:
|
||||
global num_charts, chart
|
||||
chart = None
|
||||
num_charts = 0
|
||||
else:
|
||||
self._q.put((self.i, 'exit'))
|
||||
self._exit.wait()
|
||||
global num_charts, chart
|
||||
chart = None
|
||||
num_charts = 0
|
||||
self._q.put((self.i, 'exit'))
|
||||
self._exit.wait()
|
||||
self._process.terminate()
|
||||
del self
|
||||
|
||||
@ -1,3 +1,123 @@
|
||||
if (!window.TopBar) {
|
||||
class TopBar {
|
||||
constructor(chart, hoverBackgroundColor, clickBackgroundColor, activeBackgroundColor, textColor, activeTextColor) {
|
||||
this.makeSwitcher = this.makeSwitcher.bind(this)
|
||||
this.hoverBackgroundColor = hoverBackgroundColor
|
||||
this.clickBackgroundColor = clickBackgroundColor
|
||||
this.activeBackgroundColor = activeBackgroundColor
|
||||
this.textColor = textColor
|
||||
this.activeTextColor = activeTextColor
|
||||
|
||||
this.topBar = document.createElement('div')
|
||||
this.topBar.style.backgroundColor = '#0c0d0f'
|
||||
this.topBar.style.borderBottom = '2px solid #3C434C'
|
||||
this.topBar.style.display = 'flex'
|
||||
this.topBar.style.alignItems = 'center'
|
||||
chart.wrapper.prepend(this.topBar)
|
||||
}
|
||||
makeSwitcher(items, activeItem, callbackName) {
|
||||
let switcherElement = document.createElement('div');
|
||||
switcherElement.style.margin = '4px 12px'
|
||||
let widget = {
|
||||
elem: switcherElement,
|
||||
callbackName: callbackName,
|
||||
}
|
||||
let intervalElements = items.map((item)=> {
|
||||
let itemEl = document.createElement('button');
|
||||
itemEl.style.border = 'none'
|
||||
itemEl.style.padding = '2px 5px'
|
||||
itemEl.style.margin = '0px 2px'
|
||||
itemEl.style.fontSize = '13px'
|
||||
itemEl.style.borderRadius = '4px'
|
||||
itemEl.style.backgroundColor = item === activeItem ? this.activeBackgroundColor : 'transparent'
|
||||
itemEl.style.color = item === activeItem ? this.activeTextColor : this.textColor
|
||||
itemEl.innerText = item;
|
||||
document.body.appendChild(itemEl)
|
||||
itemEl.style.minWidth = itemEl.clientWidth + 1 + 'px'
|
||||
document.body.removeChild(itemEl)
|
||||
|
||||
itemEl.addEventListener('mouseenter', () => itemEl.style.backgroundColor = item === activeItem ? this.activeBackgroundColor : this.hoverBackgroundColor)
|
||||
itemEl.addEventListener('mouseleave', () => itemEl.style.backgroundColor = item === activeItem ? this.activeBackgroundColor : 'transparent')
|
||||
itemEl.addEventListener('mousedown', () => itemEl.style.backgroundColor = item === activeItem ? this.activeBackgroundColor : this.clickBackgroundColor)
|
||||
itemEl.addEventListener('mouseup', () => itemEl.style.backgroundColor = item === activeItem ? this.activeBackgroundColor : this.hoverBackgroundColor)
|
||||
itemEl.addEventListener('click', () => onItemClicked(item))
|
||||
|
||||
switcherElement.appendChild(itemEl);
|
||||
return itemEl;
|
||||
});
|
||||
|
||||
let onItemClicked = (item)=> {
|
||||
if (item === activeItem) return
|
||||
intervalElements.forEach((element, index) => {
|
||||
element.style.backgroundColor = items[index] === item ? this.activeBackgroundColor : 'transparent'
|
||||
element.style.color = items[index] === item ? this.activeTextColor : this.textColor
|
||||
element.style.fontWeight = items[index] === item ? '500' : 'normal'
|
||||
})
|
||||
activeItem = item;
|
||||
window.callbackFunction(`${widget.callbackName}_~_${item}`);
|
||||
}
|
||||
|
||||
this.topBar.appendChild(switcherElement)
|
||||
this.makeSeparator(this.topBar)
|
||||
return widget
|
||||
}
|
||||
makeTextBoxWidget(text) {
|
||||
let textBox = document.createElement('div')
|
||||
textBox.style.margin = '0px 18px'
|
||||
textBox.style.fontSize = '16px'
|
||||
textBox.style.color = 'rgb(220, 220, 220)'
|
||||
textBox.innerText = text
|
||||
this.topBar.append(textBox)
|
||||
this.makeSeparator(this.topBar)
|
||||
return textBox
|
||||
}
|
||||
makeButton(defaultText, callbackName) {
|
||||
let button = document.createElement('button')
|
||||
button.style.border = 'none'
|
||||
button.style.padding = '2px 5px'
|
||||
button.style.margin = '4px 18px'
|
||||
button.style.fontSize = '13px'
|
||||
button.style.backgroundColor = 'transparent'
|
||||
button.style.color = this.textColor
|
||||
button.style.borderRadius = '4px'
|
||||
button.innerText = defaultText;
|
||||
document.body.appendChild(button)
|
||||
button.style.minWidth = button.clientWidth+1+'px'
|
||||
document.body.removeChild(button)
|
||||
|
||||
let widget = {
|
||||
elem: button,
|
||||
callbackName: callbackName
|
||||
}
|
||||
|
||||
button.addEventListener('mouseenter', () => button.style.backgroundColor = this.hoverBackgroundColor)
|
||||
button.addEventListener('mouseleave', () => button.style.backgroundColor = 'transparent')
|
||||
button.addEventListener('click', () => window.callbackFunction(`${widget.callbackName}_~_${button.innerText}`));
|
||||
button.addEventListener('mousedown', () => {
|
||||
button.style.backgroundColor = this.activeBackgroundColor
|
||||
button.style.color = this.activeTextColor
|
||||
button.style.fontWeight = '500'
|
||||
})
|
||||
button.addEventListener('mouseup', () => {
|
||||
button.style.backgroundColor = this.hoverBackgroundColor
|
||||
button.style.color = this.textColor
|
||||
button.style.fontWeight = 'normal'
|
||||
})
|
||||
this.topBar.appendChild(button)
|
||||
return widget
|
||||
}
|
||||
|
||||
makeSeparator() {
|
||||
let seperator = document.createElement('div')
|
||||
seperator.style.width = '1px'
|
||||
seperator.style.height = '20px'
|
||||
seperator.style.backgroundColor = '#3C434C'
|
||||
this.topBar.appendChild(seperator)
|
||||
}
|
||||
}
|
||||
window.TopBar = TopBar
|
||||
}
|
||||
|
||||
function makeSearchBox(chart) {
|
||||
let searchWindow = document.createElement('div')
|
||||
searchWindow.style.position = 'absolute'
|
||||
@ -37,19 +157,13 @@ function makeSearchBox(chart) {
|
||||
|
||||
let yPrice = null
|
||||
chart.chart.subscribeCrosshairMove((param) => {
|
||||
if (param.point){
|
||||
yPrice = param.point.y;
|
||||
}
|
||||
});
|
||||
if (param.point) yPrice = param.point.y;
|
||||
})
|
||||
let selectedChart = false
|
||||
chart.wrapper.addEventListener('mouseover', (event) => {
|
||||
selectedChart = true
|
||||
})
|
||||
chart.wrapper.addEventListener('mouseout', (event) => {
|
||||
selectedChart = false
|
||||
})
|
||||
chart.wrapper.addEventListener('mouseover', (event) => selectedChart = true)
|
||||
chart.wrapper.addEventListener('mouseout', (event) => selectedChart = false)
|
||||
chart.commandFunctions.push((event) => {
|
||||
if (!selectedChart) return
|
||||
if (!selectedChart) return false
|
||||
if (searchWindow.style.display === 'none') {
|
||||
if (/^[a-zA-Z0-9]$/.test(event.key)) {
|
||||
searchWindow.style.display = 'flex';
|
||||
@ -58,22 +172,15 @@ function makeSearchBox(chart) {
|
||||
}
|
||||
else return false
|
||||
}
|
||||
else if (event.key === 'Enter') {
|
||||
window.callbackFunction(`on_search_~_${chart.id}_~_${sBox.value}`)
|
||||
searchWindow.style.display = 'none'
|
||||
sBox.value = ''
|
||||
return true
|
||||
}
|
||||
else if (event.key === 'Escape') {
|
||||
else if (event.key === 'Enter' || event.key === 'Escape') {
|
||||
if (event.key === 'Enter') window.callbackFunction(`search${chart.id}_~_${sBox.value}`)
|
||||
searchWindow.style.display = 'none'
|
||||
sBox.value = ''
|
||||
return true
|
||||
}
|
||||
else return false
|
||||
})
|
||||
sBox.addEventListener('input', function() {
|
||||
sBox.value = sBox.value.toUpperCase();
|
||||
});
|
||||
sBox.addEventListener('input', () => sBox.value = sBox.value.toUpperCase())
|
||||
return {
|
||||
window: searchWindow,
|
||||
box: sBox,
|
||||
@ -104,77 +211,4 @@ function makeSpinner(chart) {
|
||||
animateSpinner();
|
||||
}
|
||||
|
||||
function makeSwitcher(chart, items, activeItem, callbackName, activeBackgroundColor, activeColor, inactiveColor, hoverColor) {
|
||||
let switcherElement = document.createElement('div');
|
||||
switcherElement.style.margin = '4px 14px'
|
||||
switcherElement.style.zIndex = '1000'
|
||||
|
||||
let intervalElements = items.map(function(item) {
|
||||
let itemEl = document.createElement('button');
|
||||
itemEl.style.cursor = 'pointer'
|
||||
itemEl.style.padding = '2px 5px'
|
||||
itemEl.style.margin = '0px 4px'
|
||||
itemEl.style.fontSize = '13px'
|
||||
itemEl.style.backgroundColor = item === activeItem ? activeBackgroundColor : 'transparent'
|
||||
itemEl.style.color = item === activeItem ? activeColor : inactiveColor
|
||||
itemEl.style.border = 'none'
|
||||
itemEl.style.borderRadius = '4px'
|
||||
|
||||
itemEl.addEventListener('mouseenter', function() {
|
||||
itemEl.style.backgroundColor = item === activeItem ? activeBackgroundColor : hoverColor
|
||||
itemEl.style.color = activeColor
|
||||
})
|
||||
itemEl.addEventListener('mouseleave', function() {
|
||||
itemEl.style.backgroundColor = item === activeItem ? activeBackgroundColor : 'transparent'
|
||||
itemEl.style.color = item === activeItem ? activeColor : inactiveColor
|
||||
})
|
||||
itemEl.innerText = item;
|
||||
itemEl.addEventListener('click', function() {
|
||||
onItemClicked(item);
|
||||
});
|
||||
switcherElement.appendChild(itemEl);
|
||||
return itemEl;
|
||||
});
|
||||
function onItemClicked(item) {
|
||||
if (item === activeItem) {
|
||||
return;
|
||||
}
|
||||
intervalElements.forEach(function(element, index) {
|
||||
element.style.backgroundColor = items[index] === item ? activeBackgroundColor : 'transparent'
|
||||
element.style.color = items[index] === item ? 'activeColor' : inactiveColor
|
||||
});
|
||||
activeItem = item;
|
||||
window.callbackFunction(`${callbackName}_~_${chart.id}_~_${item}`);
|
||||
}
|
||||
chart.topBar.appendChild(switcherElement)
|
||||
makeSeperator(chart.topBar)
|
||||
return switcherElement;
|
||||
}
|
||||
|
||||
function makeTextBoxWidget(chart, text) {
|
||||
let textBox = document.createElement('div')
|
||||
textBox.style.margin = '0px 18px'
|
||||
textBox.style.fontSize = '16px'
|
||||
textBox.style.color = 'rgb(220, 220, 220)'
|
||||
textBox.innerText = text
|
||||
chart.topBar.append(textBox)
|
||||
makeSeperator(chart.topBar)
|
||||
return textBox
|
||||
}
|
||||
|
||||
function makeTopBar(chart) {
|
||||
chart.topBar = document.createElement('div')
|
||||
chart.topBar.style.backgroundColor = '#191B1E'
|
||||
chart.topBar.style.borderBottom = '2px solid #3C434C'
|
||||
chart.topBar.style.display = 'flex'
|
||||
chart.topBar.style.alignItems = 'center'
|
||||
chart.wrapper.prepend(chart.topBar)
|
||||
}
|
||||
|
||||
function makeSeperator(topBar) {
|
||||
let seperator = document.createElement('div')
|
||||
seperator.style.width = '1px'
|
||||
seperator.style.height = '20px'
|
||||
seperator.style.backgroundColor = '#3C434C'
|
||||
topBar.appendChild(seperator)
|
||||
}
|
||||
|
||||
@ -10,7 +10,8 @@ function makeChart(innerWidth, innerHeight, autoSize=true) {
|
||||
height: innerHeight,
|
||||
},
|
||||
candleData: [],
|
||||
commandFunctions: []
|
||||
commandFunctions: [],
|
||||
precision: 2,
|
||||
}
|
||||
chart.chart = LightweightCharts.createChart(chart.div, {
|
||||
width: window.innerWidth*innerWidth,
|
||||
@ -125,6 +126,12 @@ if (!window.HorizontalLine) {
|
||||
this.line = this.chart.series.createPriceLine(this.priceLine)
|
||||
}
|
||||
|
||||
updateColor(color) {
|
||||
this.chart.series.removePriceLine(this.line)
|
||||
this.priceLine.color = color
|
||||
this.line = this.chart.series.createPriceLine(this.priceLine)
|
||||
}
|
||||
|
||||
deleteLine() {
|
||||
this.chart.series.removePriceLine(this.line)
|
||||
this.chart.horizontal_lines.splice(this.chart.horizontal_lines.indexOf(this))
|
||||
@ -135,16 +142,17 @@ if (!window.HorizontalLine) {
|
||||
window.HorizontalLine = HorizontalLine
|
||||
|
||||
class Legend {
|
||||
constructor(chart, ohlcEnabled = true, percentEnabled = true, linesEnabled = true,
|
||||
constructor(chart, ohlcEnabled, percentEnabled, linesEnabled,
|
||||
color = 'rgb(191, 195, 203)', fontSize = '11', fontFamily = 'Monaco') {
|
||||
this.div = document.createElement('div')
|
||||
this.div.style.position = 'absolute'
|
||||
this.div.style.zIndex = '3000'
|
||||
this.div.style.pointerEvents = 'none'
|
||||
this.div.style.top = '10px'
|
||||
this.div.style.left = '10px'
|
||||
this.div.style.display = 'flex'
|
||||
this.div.style.flexDirection = 'column'
|
||||
this.div.style.width = `${(chart.scale.width * 100) - 8}vw`
|
||||
this.div.style.maxWidth = `${(chart.scale.width * 100) - 8}vw`
|
||||
this.div.style.color = color
|
||||
this.div.style.fontSize = fontSize + 'px'
|
||||
this.div.style.fontFamily = fontFamily
|
||||
@ -158,7 +166,16 @@ if (!window.HorizontalLine) {
|
||||
this.linesEnabled = linesEnabled
|
||||
this.makeLines(chart)
|
||||
|
||||
let legendItemFormat = (num) => num.toFixed(2).toString().padStart(8, ' ')
|
||||
let legendItemFormat = (num, decimal) => num.toFixed(decimal).toString().padStart(8, ' ')
|
||||
|
||||
let shorthandFormat = (num) => {
|
||||
if (num >= 1000000) {
|
||||
return (num / 1000000).toFixed(1) + 'M';
|
||||
} else if (num >= 1000) {
|
||||
return (num / 1000).toFixed(1) + 'K';
|
||||
}
|
||||
return num.toString().padStart(8, ' ');
|
||||
}
|
||||
|
||||
chart.chart.subscribeCrosshairMove((param) => {
|
||||
if (param.time) {
|
||||
@ -166,22 +183,23 @@ if (!window.HorizontalLine) {
|
||||
let finalString = '<span style="line-height: 1.8;">'
|
||||
if (data) {
|
||||
this.candle.style.color = ''
|
||||
let ohlc = `O ${legendItemFormat(data.open)}
|
||||
| H ${legendItemFormat(data.high)}
|
||||
| L ${legendItemFormat(data.low)}
|
||||
| C ${legendItemFormat(data.close)} `
|
||||
let ohlc = `O ${legendItemFormat(data.open, chart.precision)}
|
||||
| H ${legendItemFormat(data.high, chart.precision)}
|
||||
| L ${legendItemFormat(data.low, chart.precision)}
|
||||
| C ${legendItemFormat(data.close, chart.precision)} `
|
||||
let percentMove = ((data.close - data.open) / data.open) * 100
|
||||
let percent = `| ${percentMove >= 0 ? '+' : ''}${percentMove.toFixed(2)} %`
|
||||
|
||||
finalString += ohlcEnabled ? ohlc : ''
|
||||
finalString += percentEnabled ? percent : ''
|
||||
|
||||
let volumeData = param.seriesData.get(chart.volumeSeries)
|
||||
if (volumeData) finalString += ohlcEnabled ? `<br>V ${shorthandFormat(volumeData.value)}` : ''
|
||||
}
|
||||
this.candle.innerHTML = finalString + '</span>'
|
||||
this.lines.forEach((line) => {
|
||||
if (!param.seriesData.get(line.line.series)) return
|
||||
let price = legendItemFormat(param.seriesData.get(line.line.series).value)
|
||||
line.div.innerHTML = `<span style="color: ${line.line.color};">▨</span> ${line.line.name} : ${price}`
|
||||
let price = legendItemFormat(param.seriesData.get(line.line.series).value, line.line.precision)
|
||||
line.div.innerHTML = `<span style="color: ${line.solid};">▨</span> ${line.line.name} : ${price}`
|
||||
})
|
||||
|
||||
} else {
|
||||
@ -215,6 +233,7 @@ if (!window.HorizontalLine) {
|
||||
let toggle = document.createElement('div')
|
||||
toggle.style.borderRadius = '4px'
|
||||
toggle.style.marginLeft = '10px'
|
||||
toggle.style.pointerEvents = 'auto'
|
||||
|
||||
|
||||
let svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
||||
@ -258,6 +277,7 @@ if (!window.HorizontalLine) {
|
||||
row: row,
|
||||
toggle: toggle,
|
||||
line: line,
|
||||
solid: line.color.startsWith('rgba') ? line.color.replace(/[^,]+(?=\))/, '1') : line.color
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -382,16 +402,20 @@ if (!window.ContextMenu) {
|
||||
this.menu.style.position = 'absolute'
|
||||
this.menu.style.zIndex = '10000'
|
||||
this.menu.style.background = 'rgb(50, 50, 50)'
|
||||
this.menu.style.color = 'lightgrey'
|
||||
this.menu.style.color = '#ececed'
|
||||
this.menu.style.display = 'none'
|
||||
this.menu.style.borderRadius = '5px'
|
||||
this.menu.style.padding = '3px 3px'
|
||||
this.menu.style.fontSize = '14px'
|
||||
this.menu.style.fontSize = '13px'
|
||||
this.menu.style.cursor = 'default'
|
||||
document.body.appendChild(this.menu)
|
||||
this.hoverItem = null
|
||||
|
||||
let closeMenu = (event) => {
|
||||
if (!this.menu.contains(event.target)) this.menu.style.display = 'none';
|
||||
if (!this.menu.contains(event.target)) {
|
||||
this.menu.style.display = 'none';
|
||||
this.listen(false)
|
||||
}
|
||||
}
|
||||
|
||||
this.onRightClick = (event) => {
|
||||
@ -406,16 +430,44 @@ if (!window.ContextMenu) {
|
||||
listen(active) {
|
||||
active ? document.addEventListener('contextmenu', this.onRightClick) : document.removeEventListener('contextmenu', this.onRightClick)
|
||||
}
|
||||
menuItem(text, action) {
|
||||
menuItem(text, action, hover=false) {
|
||||
let item = document.createElement('div')
|
||||
item.style.display = 'flex'
|
||||
item.style.alignItems = 'center'
|
||||
item.style.justifyContent = 'space-between'
|
||||
item.style.padding = '0px 10px'
|
||||
item.style.margin = '3px 0px'
|
||||
item.style.borderRadius = '3px'
|
||||
this.menu.appendChild(item)
|
||||
|
||||
let elem = document.createElement('div')
|
||||
elem.innerText = text
|
||||
elem.style.padding = '0px 10px'
|
||||
elem.style.borderRadius = '3px'
|
||||
this.menu.appendChild(elem)
|
||||
elem.addEventListener('mouseover', (event) => elem.style.backgroundColor = 'rgba(0, 122, 255, 0.3)')
|
||||
elem.addEventListener('mouseout', (event) => elem.style.backgroundColor = 'transparent')
|
||||
elem.addEventListener('click', (event) => {action(); this.menu.style.display = 'none'})
|
||||
item.appendChild(elem)
|
||||
|
||||
if (hover) {
|
||||
let arrow = document.createElement('div')
|
||||
arrow.innerHTML = `<svg width="15px" height="10px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.82054 20.7313C8.21107 21.1218 8.84423 21.1218 9.23476 20.7313L15.8792 14.0868C17.0505 12.9155 17.0508 11.0167 15.88 9.84497L9.3097 3.26958C8.91918 2.87905 8.28601 2.87905 7.89549 3.26958C7.50497 3.6601 7.50497 4.29327 7.89549 4.68379L14.4675 11.2558C14.8581 11.6464 14.8581 12.2795 14.4675 12.67L7.82054 19.317C7.43002 19.7076 7.43002 20.3407 7.82054 20.7313Z" fill="#fff"/></svg>`
|
||||
item.appendChild(arrow)
|
||||
}
|
||||
|
||||
elem.addEventListener('mouseover', (event) => {
|
||||
item.style.backgroundColor = 'rgba(0, 122, 255, 0.3)'
|
||||
if (this.hoverItem && this.hoverItem.closeAction) this.hoverItem.closeAction()
|
||||
this.hoverItem = {elem: elem, action: action, closeAction: hover}
|
||||
})
|
||||
elem.addEventListener('mouseout', (event) => item.style.backgroundColor = 'transparent')
|
||||
if (!hover) elem.addEventListener('click', (event) => {action(event); this.menu.style.display = 'none'})
|
||||
else elem.addEventListener('mouseover', () => action(item.getBoundingClientRect()))
|
||||
}
|
||||
separator() {
|
||||
let separator = document.createElement('div')
|
||||
separator.style.width = '90%'
|
||||
separator.style.height = '1px'
|
||||
separator.style.margin = '4px 0px'
|
||||
separator.style.backgroundColor = '#3C434C'
|
||||
this.menu.appendChild(separator)
|
||||
}
|
||||
|
||||
}
|
||||
window.ContextMenu = ContextMenu
|
||||
}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
if (!window.Table) {
|
||||
class Table {
|
||||
constructor(width, height, headings, widths, alignments, position, draggable = false, pythonMethod, chart) {
|
||||
constructor(width, height, headings, widths, alignments, position, draggable = false, chart) {
|
||||
this.container = document.createElement('div')
|
||||
this.pythonMethod = pythonMethod
|
||||
this.callbackName = null
|
||||
this.chart = chart
|
||||
|
||||
if (draggable) {
|
||||
@ -15,12 +15,12 @@ if (!window.Table) {
|
||||
|
||||
this.container.style.zIndex = '2000'
|
||||
this.container.style.width = width <= 1 ? width * 100 + '%' : width + 'px'
|
||||
this.container.style.height = height <= 1 ? height * 100 + '%' : height + 'px'
|
||||
this.container.style.minHeight = height <= 1 ? height * 100 + '%' : height + 'px'
|
||||
this.container.style.display = 'flex'
|
||||
this.container.style.flexDirection = 'column'
|
||||
this.container.style.justifyContent = 'space-between'
|
||||
|
||||
this.container.style.backgroundColor = 'rgb(45, 45, 45)'
|
||||
this.container.style.backgroundColor = '#121417'
|
||||
this.container.style.borderRadius = '5px'
|
||||
this.container.style.color = 'white'
|
||||
this.container.style.fontSize = '12px'
|
||||
@ -29,7 +29,8 @@ if (!window.Table) {
|
||||
this.table = document.createElement('table')
|
||||
this.table.style.width = '100%'
|
||||
this.table.style.borderCollapse = 'collapse'
|
||||
this.table.style.border = '1px solid rgb(70, 70, 70)';
|
||||
this.container.style.overflow = 'hidden'
|
||||
|
||||
this.rows = {}
|
||||
|
||||
this.headings = headings
|
||||
@ -43,6 +44,9 @@ if (!window.Table) {
|
||||
let th = document.createElement('th')
|
||||
th.textContent = this.headings[i]
|
||||
th.style.width = this.widths[i]
|
||||
th.style.letterSpacing = '0.03rem'
|
||||
th.style.padding = '0.2rem 0px'
|
||||
th.style.fontWeight = '500'
|
||||
th.style.textAlign = 'center'
|
||||
row.appendChild(th)
|
||||
th.style.border = '1px solid rgb(70, 70, 70)'
|
||||
@ -93,10 +97,9 @@ if (!window.Table) {
|
||||
}
|
||||
row.addEventListener('mouseover', () => row.style.backgroundColor = 'rgba(60, 60, 60, 0.6)')
|
||||
row.addEventListener('mouseout', () => row.style.backgroundColor = 'transparent')
|
||||
row.addEventListener('mousedown', () => {
|
||||
row.style.backgroundColor = 'rgba(60, 60, 60)'
|
||||
window.callbackFunction(`${this.pythonMethod}_~_${this.chart.id}_~_${id}`)
|
||||
})
|
||||
row.addEventListener('mousedown', () => row.style.backgroundColor = 'rgba(60, 60, 60)')
|
||||
|
||||
row.addEventListener('click', () => window.callbackFunction(`${this.callbackName}_~_${id}`))
|
||||
row.addEventListener('mouseup', () => row.style.backgroundColor = 'rgba(60, 60, 60, 0.6)')
|
||||
|
||||
this.rows[id] = row
|
||||
@ -134,6 +137,11 @@ if (!window.Table) {
|
||||
this.footer[i].style.textAlign = 'center'
|
||||
}
|
||||
}
|
||||
toJSON() {
|
||||
// Exclude the chart attribute from serialization
|
||||
const {chart, ...serialized} = this;
|
||||
return serialized;
|
||||
}
|
||||
}
|
||||
window.Table = Table
|
||||
}
|
||||
|
||||
@ -4,6 +4,7 @@ if (!window.ToolBox) {
|
||||
this.onTrendSelect = this.onTrendSelect.bind(this)
|
||||
this.onHorzSelect = this.onHorzSelect.bind(this)
|
||||
this.onRaySelect = this.onRaySelect.bind(this)
|
||||
this.saveDrawings = this.saveDrawings.bind(this)
|
||||
|
||||
this.chart = chart
|
||||
this.drawings = []
|
||||
@ -15,7 +16,8 @@ if (!window.ToolBox) {
|
||||
this.activeIconColor = 'rgb(240, 240, 240)'
|
||||
this.iconColor = 'lightgrey'
|
||||
this.backgroundColor = 'transparent'
|
||||
this.hoverColor = 'rgba(60, 60, 60, 0.7)'
|
||||
this.hoverColor = 'rgba(80, 86, 94, 0.7)'
|
||||
this.clickBackgroundColor = 'rgba(90, 106, 104, 0.7)'
|
||||
|
||||
this.elem = this.makeToolBox()
|
||||
this.subscribeHoverMove()
|
||||
@ -92,11 +94,15 @@ if (!window.ToolBox) {
|
||||
|
||||
icon.elem.addEventListener('mouseenter', () => {
|
||||
icon.elem.style.backgroundColor = icon === this.chart.activeIcon ? this.activeBackgroundColor : this.hoverColor
|
||||
document.body.style.cursor = 'pointer'
|
||||
})
|
||||
icon.elem.addEventListener('mouseleave', () => {
|
||||
icon.elem.style.backgroundColor = icon === this.chart.activeIcon ? this.activeBackgroundColor : this.backgroundColor
|
||||
document.body.style.cursor = this.chart.cursor
|
||||
})
|
||||
icon.elem.addEventListener('mousedown', () => {
|
||||
icon.elem.style.backgroundColor = icon === this.chart.activeIcon ? this.activeBackgroundColor : this.clickBackgroundColor
|
||||
})
|
||||
icon.elem.addEventListener('mouseup', () => {
|
||||
icon.elem.style.backgroundColor = icon === this.chart.activeIcon ? this.activeBackgroundColor : 'transparent'
|
||||
})
|
||||
icon.elem.addEventListener('click', () => {
|
||||
if (this.chart.activeIcon) {
|
||||
@ -118,6 +124,7 @@ if (!window.ToolBox) {
|
||||
})
|
||||
this.chart.commandFunctions.push((event) => {
|
||||
if (event.altKey && event.code === keyCmd) {
|
||||
event.preventDefault()
|
||||
if (this.chart.activeIcon) {
|
||||
this.chart.activeIcon.elem.style.backgroundColor = this.backgroundColor
|
||||
group.setAttribute("fill", this.iconColor)
|
||||
@ -140,6 +147,7 @@ if (!window.ToolBox) {
|
||||
onTrendSelect(toggle, ray = false) {
|
||||
let trendLine = {
|
||||
line: null,
|
||||
color: 'rgb(15, 139, 237)',
|
||||
markers: null,
|
||||
data: null,
|
||||
from: null,
|
||||
@ -160,17 +168,14 @@ if (!window.ToolBox) {
|
||||
|
||||
if (!this.makingDrawing) return
|
||||
|
||||
let logical
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: false})
|
||||
let logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
let lastCandleTime = this.chart.candleData[this.chart.candleData.length - 1].time
|
||||
currentTime = this.chart.chart.timeScale().coordinateToTime(param.point.x)
|
||||
if (!currentTime) {
|
||||
let barsToMove = param.logical - this.chart.chart.timeScale().coordinateToLogical(this.chart.chart.timeScale().timeToCoordinate(lastCandleTime))
|
||||
logical = barsToMove <= 0 ? null : this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
currentTime = dateToChartTime(new Date(chartTimeToDate(this.chart.candleData[this.chart.candleData.length - 1].time).getTime() + (barsToMove * this.interval)), this.interval)
|
||||
} else if (chartTimeToDate(lastCandleTime).getTime() <= chartTimeToDate(currentTime).getTime()) {
|
||||
logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
}
|
||||
|
||||
let currentPrice = this.chart.series.coordinateToPrice(param.point.y)
|
||||
|
||||
|
||||
@ -179,19 +184,11 @@ if (!window.ToolBox) {
|
||||
trendLine.from = [data[0].time, data[0].value]
|
||||
trendLine.to = [data[data.length - 1].time, data[data.length-1].value]
|
||||
|
||||
if (ray) logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
|
||||
trendLine.line.setData(data)
|
||||
|
||||
if (logical) {
|
||||
this.chart.chart.applyOptions({handleScroll: false})
|
||||
setTimeout(() => {
|
||||
this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
}, 1)
|
||||
setTimeout(() => {
|
||||
this.chart.chart.applyOptions({handleScroll: true})
|
||||
}, 50)
|
||||
}
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: true})
|
||||
this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
|
||||
if (!ray) {
|
||||
trendLine.markers = [
|
||||
{time: firstTime, position: 'inBar', color: '#1E80F0', shape: 'circle', size: 0.1},
|
||||
@ -208,6 +205,7 @@ if (!window.ToolBox) {
|
||||
if (!this.makingDrawing) {
|
||||
this.makingDrawing = true
|
||||
trendLine.line = this.chart.chart.addLineSeries({
|
||||
color: 'rgb(15, 139, 237)',
|
||||
lineWidth: 2,
|
||||
lastValueVisible: false,
|
||||
priceLineVisible: false,
|
||||
@ -221,14 +219,11 @@ if (!window.ToolBox) {
|
||||
})
|
||||
firstPrice = this.chart.series.coordinateToPrice(param.point.y)
|
||||
firstTime = !ray ? this.chart.chart.timeScale().coordinateToTime(param.point.x) : this.chart.candleData[this.chart.candleData.length - 1].time
|
||||
this.chart.chart.applyOptions({
|
||||
handleScroll: false
|
||||
})
|
||||
this.chart.chart.applyOptions({handleScroll: false})
|
||||
this.chart.chart.subscribeCrosshairMove(crosshairHandlerTrend)
|
||||
} else {
|
||||
this.chart.chart.applyOptions({
|
||||
handleScroll: true
|
||||
})
|
||||
}
|
||||
else {
|
||||
this.chart.chart.applyOptions({handleScroll: true})
|
||||
this.makingDrawing = false
|
||||
trendLine.line.setMarkers([])
|
||||
this.drawings.push(trendLine)
|
||||
@ -247,7 +242,7 @@ if (!window.ToolBox) {
|
||||
clickHandlerHorz = (param) => {
|
||||
let price = this.chart.series.coordinateToPrice(param.point.y)
|
||||
let lineStyle = LightweightCharts.LineStyle.Solid
|
||||
let line = new HorizontalLine(this.chart, 'toolBox', price, null, 2, lineStyle, true)
|
||||
let line = new HorizontalLine(this.chart, 'toolBox', price,'red', 2, lineStyle, true)
|
||||
this.drawings.push(line)
|
||||
this.chart.chart.unsubscribeClick(this.clickHandlerHorz)
|
||||
document.body.style.cursor = 'default'
|
||||
@ -267,9 +262,16 @@ if (!window.ToolBox) {
|
||||
subscribeHoverMove() {
|
||||
let hoveringOver = null
|
||||
let x, y
|
||||
let colorPicker = new ColorPicker(this.saveDrawings)
|
||||
|
||||
let onClickDelete = () => this.deleteDrawing(contextMenu.drawing)
|
||||
let onClickColor = (rect) => colorPicker.openMenu(rect, contextMenu.drawing)
|
||||
let contextMenu = new ContextMenu()
|
||||
contextMenu.menuItem('Color Picker', onClickColor, () =>{
|
||||
document.removeEventListener('click', colorPicker.closeMenu)
|
||||
colorPicker.container.style.display = 'none'
|
||||
})
|
||||
contextMenu.separator()
|
||||
contextMenu.menuItem('Delete Drawing', onClickDelete)
|
||||
|
||||
let hoverOver = (param) => {
|
||||
@ -325,9 +327,7 @@ if (!window.ToolBox) {
|
||||
let checkForClick = (event) => {
|
||||
mouseDown = true
|
||||
document.body.style.cursor = 'grabbing'
|
||||
this.chart.chart.applyOptions({
|
||||
handleScroll: false
|
||||
})
|
||||
this.chart.chart.applyOptions({handleScroll: false})
|
||||
|
||||
this.chart.chart.unsubscribeCrosshairMove(hoverOver)
|
||||
|
||||
@ -354,7 +354,7 @@ if (!window.ToolBox) {
|
||||
|
||||
this.chart.chart.applyOptions({handleScroll: true})
|
||||
if (hoveringOver && 'price' in hoveringOver && hoveringOver.id !== 'toolBox') {
|
||||
window.callbackFunction(`on_horizontal_line_move_~_${this.chart.id}_~_${hoveringOver.id};;;${hoveringOver.price.toFixed(8)}`);
|
||||
window.callbackFunction(`${hoveringOver.id}_~_${hoveringOver.price.toFixed(8)}`);
|
||||
}
|
||||
hoveringOver = null
|
||||
document.removeEventListener('mousedown', checkForClick)
|
||||
@ -390,14 +390,15 @@ if (!window.ToolBox) {
|
||||
let endValue = hoveringOver.to[1] + priceDiff
|
||||
let data = calculateTrendLine(startDate, startValue, endDate, endValue, this.interval, this.chart, hoveringOver.ray)
|
||||
|
||||
let logical
|
||||
if (chartTimeToDate(data[data.length - 1].time).getTime() >= chartTimeToDate(this.chart.candleData[this.chart.candleData.length - 1].time).getTime()) {
|
||||
logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
}
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: false})
|
||||
let logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
|
||||
hoveringOver.from = [data[0].time, data[0].value]
|
||||
hoveringOver.to = [data[data.length - 1].time, data[data.length - 1].value]
|
||||
hoveringOver.line.setData(data)
|
||||
if (logical) this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: true})
|
||||
this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
|
||||
if (!hoveringOver.ray) {
|
||||
hoveringOver.markers = [
|
||||
@ -428,22 +429,23 @@ if (!window.ToolBox) {
|
||||
firstPrice = hoveringOver.to[1]
|
||||
}
|
||||
|
||||
let logical
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: false})
|
||||
let logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
|
||||
let lastCandleTime = this.chart.candleData[this.chart.candleData.length - 1].time
|
||||
if (!currentTime) {
|
||||
let barsToMove = param.logical - this.chart.chart.timeScale().coordinateToLogical(this.chart.chart.timeScale().timeToCoordinate(lastCandleTime))
|
||||
logical = barsToMove <= 0 ? null : this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
currentTime = dateToChartTime(new Date(chartTimeToDate(this.chart.candleData[this.chart.candleData.length - 1].time).getTime() + (barsToMove * this.interval)), this.interval)
|
||||
} else if (chartTimeToDate(lastCandleTime).getTime() <= chartTimeToDate(currentTime).getTime()) {
|
||||
logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
}
|
||||
|
||||
let data = calculateTrendLine(firstTime, firstPrice, currentTime, currentPrice, this.interval, this.chart)
|
||||
hoveringOver.line.setData(data)
|
||||
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: true})
|
||||
this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
|
||||
hoveringOver.from = [data[0].time, data[0].value]
|
||||
hoveringOver.to = [data[data.length - 1].time, data[data.length - 1].value]
|
||||
if (logical) this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
|
||||
|
||||
hoveringOver.markers = [
|
||||
{time: firstTime, position: 'inBar', color: '#1E80F0', shape: 'circle', size: 0.1},
|
||||
@ -468,7 +470,6 @@ if (!window.ToolBox) {
|
||||
}
|
||||
|
||||
renderDrawings() {
|
||||
//let logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
this.drawings.forEach((item) => {
|
||||
if ('price' in item) return
|
||||
let startDate = dateToChartTime(new Date(Math.round(chartTimeToDate(item.from[0]).getTime() / this.interval) * this.interval), this.interval)
|
||||
@ -478,7 +479,6 @@ if (!window.ToolBox) {
|
||||
item.to = [data[data.length - 1].time, data[data.length-1].value]
|
||||
item.line.setData(data)
|
||||
})
|
||||
//this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
}
|
||||
|
||||
deleteDrawing(drawing) {
|
||||
@ -486,10 +486,9 @@ if (!window.ToolBox) {
|
||||
this.chart.series.removePriceLine(drawing.line)
|
||||
}
|
||||
else {
|
||||
let logical
|
||||
if (drawing.ray) logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: false})
|
||||
this.chart.chart.removeSeries(drawing.line);
|
||||
if (drawing.ray) this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: true})
|
||||
}
|
||||
this.drawings.splice(this.drawings.indexOf(drawing), 1)
|
||||
this.saveDrawings()
|
||||
@ -512,22 +511,22 @@ if (!window.ToolBox) {
|
||||
}
|
||||
return value;
|
||||
});
|
||||
window.callbackFunction(`save_drawings_~_${this.chart.id}_~_${drawingsString}`)
|
||||
window.callbackFunction(`save_drawings${this.chart.id}_~_${drawingsString}`)
|
||||
}
|
||||
|
||||
loadDrawings(drawings) {
|
||||
this.drawings = drawings
|
||||
this.chart.chart.applyOptions({
|
||||
handleScroll: false
|
||||
})
|
||||
let logical = this.chart.chart.timeScale().getVisibleLogicalRange()
|
||||
this.chart.chart.applyOptions({handleScroll: false})
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: false})
|
||||
this.drawings.forEach((item) => {
|
||||
let idx = this.drawings.indexOf(item)
|
||||
if ('price' in item) {
|
||||
this.drawings[this.drawings.indexOf(item)] = new HorizontalLine(this.chart, 'toolBox', item.priceLine.price, item.priceLine.color, 2, item.priceLine.lineStyle, item.priceLine.axisLabelVisible)
|
||||
this.drawings[idx] = new HorizontalLine(this.chart, 'toolBox', item.priceLine.price, item.priceLine.color, 2, item.priceLine.lineStyle, item.priceLine.axisLabelVisible)
|
||||
}
|
||||
else {
|
||||
this.drawings[this.drawings.indexOf(item)].line = this.chart.chart.addLineSeries({
|
||||
this.drawings[idx].line = this.chart.chart.addLineSeries({
|
||||
lineWidth: 2,
|
||||
color: this.drawings[idx].color,
|
||||
lastValueVisible: false,
|
||||
priceLineVisible: false,
|
||||
crosshairMarkerVisible: false,
|
||||
@ -546,11 +545,140 @@ if (!window.ToolBox) {
|
||||
item.line.setData(data)
|
||||
}
|
||||
})
|
||||
this.chart.chart.applyOptions({
|
||||
handleScroll: true
|
||||
})
|
||||
this.chart.chart.timeScale().setVisibleLogicalRange(logical)
|
||||
this.chart.chart.applyOptions({handleScroll: true})
|
||||
this.chart.chart.timeScale().applyOptions({shiftVisibleRangeOnNewBar: true})
|
||||
}
|
||||
}
|
||||
window.ToolBox = ToolBox
|
||||
}
|
||||
}
|
||||
|
||||
if (!window.ColorPicker) {
|
||||
class ColorPicker {
|
||||
constructor(saveDrawings) {
|
||||
this.saveDrawings = saveDrawings
|
||||
|
||||
this.container = document.createElement('div')
|
||||
this.container.style.maxWidth = '170px'
|
||||
this.container.style.backgroundColor = '#191B1E'
|
||||
this.container.style.position = 'absolute'
|
||||
this.container.style.zIndex = '10000'
|
||||
this.container.style.display = 'none'
|
||||
this.container.style.flexDirection = 'column'
|
||||
this.container.style.alignItems = 'center'
|
||||
this.container.style.border = '2px solid #3C434C'
|
||||
this.container.style.borderRadius = '8px'
|
||||
this.container.style.cursor = 'default'
|
||||
|
||||
let colorPicker = document.createElement('div')
|
||||
colorPicker.style.margin = '10px'
|
||||
colorPicker.style.display = 'flex'
|
||||
colorPicker.style.flexWrap = 'wrap'
|
||||
|
||||
let colors = [
|
||||
'#EBB0B0','#E9CEA1','#E5DF80','#ADEB97','#A3C3EA','#D8BDED',
|
||||
'#E15F5D','#E1B45F','#E2D947','#4BE940','#639AE1','#D7A0E8',
|
||||
'#E42C2A','#E49D30','#E7D827','#3CFF0A','#3275E4','#B06CE3',
|
||||
'#F3000D','#EE9A14','#F1DA13','#2DFC0F','#1562EE','#BB00EF',
|
||||
'#B50911','#E3860E','#D2BD11','#48DE0E','#1455B4','#6E009F',
|
||||
'#7C1713','#B76B12','#8D7A13','#479C12','#165579','#51007E',
|
||||
]
|
||||
|
||||
colors.forEach((color) => colorPicker.appendChild(this.makeColorBox(color)))
|
||||
|
||||
let separator = document.createElement('div')
|
||||
separator.style.backgroundColor = '#3C434C'
|
||||
separator.style.height = '1px'
|
||||
separator.style.width = '130px'
|
||||
|
||||
let opacity = document.createElement('div')
|
||||
opacity.style.margin = '10px'
|
||||
|
||||
let opacityText = document.createElement('div')
|
||||
opacityText.style.color = 'lightgray'
|
||||
opacityText.style.fontSize = '12px'
|
||||
opacityText.innerText = 'Opacity'
|
||||
|
||||
let opacityValue = document.createElement('div')
|
||||
opacityValue.style.color = 'lightgray'
|
||||
opacityValue.style.fontSize = '12px'
|
||||
|
||||
let opacitySlider = document.createElement('input')
|
||||
opacitySlider.type = 'range'
|
||||
opacitySlider.value = this.opacity*100
|
||||
opacityValue.innerText = opacitySlider.value+'%'
|
||||
opacitySlider.oninput = () => {
|
||||
opacityValue.innerText = opacitySlider.value+'%'
|
||||
this.opacity = opacitySlider.value/100
|
||||
this.updateColor()
|
||||
}
|
||||
|
||||
opacity.appendChild(opacityText)
|
||||
opacity.appendChild(opacitySlider)
|
||||
opacity.appendChild(opacityValue)
|
||||
|
||||
this.container.appendChild(colorPicker)
|
||||
this.container.appendChild(separator)
|
||||
this.container.appendChild(opacity)
|
||||
document.getElementById('wrapper').appendChild(this.container)
|
||||
|
||||
}
|
||||
makeColorBox(color) {
|
||||
let box = document.createElement('div')
|
||||
box.style.width = '18px'
|
||||
box.style.height = '18px'
|
||||
box.style.borderRadius = '3px'
|
||||
box.style.margin = '3px'
|
||||
box.style.boxSizing = 'border-box'
|
||||
box.style.backgroundColor = color
|
||||
|
||||
box.addEventListener('mouseover', (event) => box.style.border = '2px solid lightgray')
|
||||
box.addEventListener('mouseout', (event) => box.style.border = 'none')
|
||||
|
||||
let rgbValues = this.extractRGB(color)
|
||||
|
||||
box.addEventListener('click', (event) => {
|
||||
this.rgbValues = rgbValues
|
||||
this.updateColor()
|
||||
})
|
||||
return box
|
||||
}
|
||||
extractRGB = (anyColor) => {
|
||||
let dummyElem = document.createElement('div');
|
||||
dummyElem.style.color = anyColor;
|
||||
document.body.appendChild(dummyElem);
|
||||
let computedColor = getComputedStyle(dummyElem).color;
|
||||
document.body.removeChild(dummyElem);
|
||||
let colorValues = computedColor.match(/\d+/g).map(Number);
|
||||
let isRgba = computedColor.includes('rgba');
|
||||
let opacity = isRgba ? parseFloat(computedColor.split(',')[3]) : 1
|
||||
return [colorValues[0], colorValues[1], colorValues[2], opacity]
|
||||
}
|
||||
updateColor() {
|
||||
let oColor = `rgba(${this.rgbValues[0]}, ${this.rgbValues[1]}, ${this.rgbValues[2]}, ${this.opacity})`
|
||||
if ('price' in this.drawing) this.drawing.updateColor(oColor)
|
||||
else {
|
||||
this.drawing.color = oColor
|
||||
this.drawing.line.applyOptions({color: oColor})
|
||||
}
|
||||
this.saveDrawings()
|
||||
}
|
||||
openMenu(rect, drawing) {
|
||||
this.drawing = drawing
|
||||
this.rgbValues = this.extractRGB('price' in drawing ? drawing.priceLine.color : drawing.color)
|
||||
this.opacity = parseFloat(this.rgbValues[3])
|
||||
this.container.style.top = (rect.top-30)+'px'
|
||||
this.container.style.left = rect.right+'px'
|
||||
this.container.style.display = 'flex'
|
||||
setTimeout(() => document.addEventListener('mousedown', (event) => {
|
||||
if (!this.container.contains(event.target)) {
|
||||
this.closeMenu()
|
||||
}
|
||||
}), 10)
|
||||
}
|
||||
closeMenu(event) {
|
||||
document.removeEventListener('click', this.closeMenu)
|
||||
this.container.style.display = 'none'
|
||||
}
|
||||
}
|
||||
window.ColorPicker = ColorPicker
|
||||
}
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import asyncio
|
||||
import logging
|
||||
import datetime as dt
|
||||
import re
|
||||
import threading
|
||||
import queue
|
||||
import json
|
||||
@ -8,7 +9,6 @@ import ssl
|
||||
from typing import Literal, Union, List
|
||||
import pandas as pd
|
||||
|
||||
from lightweight_charts.util import _convert_timeframe
|
||||
from lightweight_charts import Chart
|
||||
|
||||
try:
|
||||
@ -21,6 +21,22 @@ except ImportError:
|
||||
websockets = None
|
||||
|
||||
|
||||
def convert_timeframe(timeframe):
|
||||
spans = {
|
||||
'min': 'minute',
|
||||
'H': 'hour',
|
||||
'D': 'day',
|
||||
'W': 'week',
|
||||
'M': 'month',
|
||||
}
|
||||
try:
|
||||
multiplier = re.findall(r'\d+', timeframe)[0]
|
||||
except IndexError:
|
||||
return 1, spans[timeframe]
|
||||
timespan = spans[timeframe.replace(multiplier, '')]
|
||||
return multiplier, timespan
|
||||
|
||||
|
||||
class PolygonAPI:
|
||||
"""
|
||||
Offers direct access to Polygon API data within all Chart objects.
|
||||
@ -136,7 +152,7 @@ class PolygonAPI:
|
||||
|
||||
self._ws_q.put(('_unsubscribe', chart))
|
||||
end_date = dt.datetime.now().strftime('%Y-%m-%d') if end_date == 'now' else end_date
|
||||
mult, span = _convert_timeframe(timeframe)
|
||||
mult, span = convert_timeframe(timeframe)
|
||||
|
||||
query_url = f"https://api.polygon.io/v2/aggs/ticker/{ticker.replace('-', '')}/range/{mult}/{span}/{start_date}/{end_date}?limit={limit}&apiKey={self._key}"
|
||||
response = requests.get(query_url, headers={'User-Agent': 'lightweight_charts/1.0'})
|
||||
@ -250,8 +266,11 @@ class PolygonAPI:
|
||||
if sec_type == 'forex':
|
||||
data['bp'] = data.pop('b')
|
||||
data['ap'] = data.pop('a')
|
||||
self._lasts[key]['price'] = (data['bp']+data['ap'])/2 if sec_type != 'indices' else data['val']
|
||||
self._lasts[key]['volume'] = 0
|
||||
if sec_type == 'indices':
|
||||
self._lasts[key]['price'] = data['val']
|
||||
else:
|
||||
self._lasts[key]['price'] = (data['bp']+data['ap'])/2
|
||||
self._lasts[key]['volume'] = 0
|
||||
elif data['ev'] in ('A', 'CA', 'XA'):
|
||||
self._lasts[key]['volume'] = data['v']
|
||||
if not self._lasts[key].get('time'):
|
||||
@ -305,8 +324,7 @@ class PolygonChart(Chart):
|
||||
security_options: tuple = ('Stock', 'Option', 'Index', 'Forex', 'Crypto'),
|
||||
toolbox: bool = True, width: int = 800, height: int = 600, x: int = None, y: int = None,
|
||||
on_top: bool = False, maximize: bool = False, debug: bool = False):
|
||||
super().__init__(volume_enabled=True, width=width, height=height, x=x, y=y, on_top=on_top, maximize=maximize, debug=debug,
|
||||
api=self, topbar=True, searchbox=True, toolbox=toolbox)
|
||||
super().__init__(width=width, height=height, x=x, y=y, on_top=on_top, maximize=maximize, debug=debug, toolbox=toolbox)
|
||||
self.chart = self
|
||||
self.num_bars = num_bars
|
||||
self.end_date = end_date
|
||||
@ -316,26 +334,18 @@ class PolygonChart(Chart):
|
||||
|
||||
self.topbar.active_background_color = 'rgb(91, 98, 246)'
|
||||
self.topbar.textbox('symbol')
|
||||
self.topbar.switcher('timeframe', self._on_timeframe_selection, *timeframe_options)
|
||||
self.topbar.switcher('security', self._on_security_selection, *security_options)
|
||||
self.topbar.switcher('timeframe', timeframe_options, func=self._on_timeframe_selection)
|
||||
self.topbar.switcher('security', security_options, func=self._on_security_selection)
|
||||
self.legend(True)
|
||||
self.grid(False, False)
|
||||
self.crosshair(vert_visible=False, horz_visible=False)
|
||||
self.events.search += self.on_search
|
||||
self.run_script(f'''
|
||||
{self.id}.search.box.style.backgroundColor = 'rgba(91, 98, 246, 0.5)'
|
||||
{self.id}.spinner.style.borderTop = '4px solid rgba(91, 98, 246, 0.8)'
|
||||
|
||||
{self.id}.search.window.style.display = "flex"
|
||||
{self.id}.search.box.focus()
|
||||
|
||||
//let polyLogo = document.createElement('div')
|
||||
//polyLogo.innerHTML = '<svg><g transform="scale(0.9)"><path d="M17.9821362,6 L24,12.1195009 L22.9236698,13.5060353 L17.9524621,27 L14.9907916,17.5798557 L12,12.0454987 L17.9821362,6 Z M21.437,15.304 L18.3670383,19.1065035 L18.367,23.637 L21.437,15.304 Z M18.203,7.335 L15.763,17.462 L17.595,23.287 L17.5955435,18.8249858 L22.963,12.176 L18.203,7.335 Z M17.297,7.799 L12.9564162,12.1857947 L15.228,16.389 L17.297,7.799 Z" fill="#FFFFFF"></path></g></svg>'
|
||||
//polyLogo.style.position = 'absolute'
|
||||
//polyLogo.style.width = '28px'
|
||||
//polyLogo.style.zIndex = 10000
|
||||
//polyLogo.style.right = '18px'
|
||||
//polyLogo.style.top = '-1px'
|
||||
//{self.id}.wrapper.appendChild(polyLogo)
|
||||
''')
|
||||
|
||||
def _polygon(self, symbol):
|
||||
@ -343,7 +353,7 @@ class PolygonChart(Chart):
|
||||
self.set(pd.DataFrame(), True)
|
||||
self.crosshair(vert_visible=False, horz_visible=False)
|
||||
|
||||
mult, span = _convert_timeframe(self.topbar['timeframe'].value)
|
||||
mult, span = convert_timeframe(self.topbar['timeframe'].value)
|
||||
delta = dt.timedelta(**{span + 's': int(mult)})
|
||||
short_delta = (delta < dt.timedelta(days=7))
|
||||
start_date = dt.datetime.now() if self.end_date == 'now' else dt.datetime.strptime(self.end_date, '%Y-%m-%d')
|
||||
@ -367,18 +377,11 @@ class PolygonChart(Chart):
|
||||
self.crosshair(vert_visible=True, horz_visible=True) if success else None
|
||||
return success
|
||||
|
||||
async def on_search(self, searched_string): self.topbar['symbol'].set(searched_string if self._polygon(searched_string) else '')
|
||||
async def on_search(self, chart, searched_string):
|
||||
self.topbar['symbol'].set(searched_string if self._polygon(searched_string) else '')
|
||||
|
||||
async def _on_timeframe_selection(self):
|
||||
async def _on_timeframe_selection(self, chart):
|
||||
self._polygon(self.topbar['symbol'].value) if self.topbar['symbol'].value else None
|
||||
|
||||
async def _on_security_selection(self):
|
||||
sec_type = self.topbar['security'].value
|
||||
self.volume_enabled = False if sec_type == 'Index' else True
|
||||
|
||||
precision = 5 if sec_type == 'Forex' else 2
|
||||
min_move = 1 / (10 ** precision) # 2 -> 0.1, 5 -> 0.00005 etc.
|
||||
self.run_script(f'''
|
||||
{self.chart.id}.series.applyOptions({{
|
||||
priceFormat: {{precision: {precision}, minMove: {min_move}}}
|
||||
}})''')
|
||||
async def _on_security_selection(self, chart):
|
||||
self.precision(5 if self.topbar['security'].value == 'Forex' else 2)
|
||||
|
||||
@ -1,59 +1,67 @@
|
||||
import random
|
||||
from typing import Union
|
||||
|
||||
from lightweight_charts.util import _js_bool
|
||||
from .util import jbool
|
||||
|
||||
|
||||
class Footer:
|
||||
def __init__(self, table):
|
||||
self._table = table
|
||||
self._chart = table._chart
|
||||
def __init__(self, table): self._table = table
|
||||
|
||||
def __setitem__(self, key, value): self._chart.run_script(f'{self._table.id}.footer[{key}].innerText = "{value}"')
|
||||
def __setitem__(self, key, value): self._table._run_script(f'{self._table.id}.footer[{key}].innerText = "{value}"')
|
||||
|
||||
def __call__(self, number_of_text_boxes): self._chart.run_script(f'{self._table.id}.makeFooter({number_of_text_boxes})')
|
||||
def __call__(self, number_of_text_boxes): self._table._run_script(f'{self._table.id}.makeFooter({number_of_text_boxes})')
|
||||
|
||||
|
||||
class Row(dict):
|
||||
def __init__(self, table, id, items):
|
||||
super().__init__()
|
||||
self._table = table
|
||||
self._chart = table._chart
|
||||
self._run_script = table._run_script
|
||||
self.id = id
|
||||
self.meta = {}
|
||||
self._table._chart.run_script(f'''{self._table.id}.newRow({list(items.values())}, '{self.id}')''')
|
||||
self._run_script(f'''{self._table.id}.newRow({list(items.values())}, '{self.id}')''')
|
||||
for key, val in items.items():
|
||||
self[key] = val
|
||||
|
||||
def __setitem__(self, column, value):
|
||||
str_value = str(value)
|
||||
if isinstance(column, tuple):
|
||||
return [self.__setitem__(col, val) for col, val in zip(column, value)]
|
||||
original_value = value
|
||||
if column in self._table._formatters:
|
||||
str_value = self._table._formatters[column].replace(self._table.VALUE, str_value)
|
||||
self._chart.run_script(f'''{self._table.id}.updateCell('{self.id}', '{column}', '{str_value}')''')
|
||||
value = self._table._formatters[column].replace(self._table.VALUE, str(value))
|
||||
self._run_script(f'{self._table.id}.updateCell("{self.id}", "{column}", "{value}")')
|
||||
|
||||
return super().__setitem__(column, value)
|
||||
return super().__setitem__(column, original_value)
|
||||
|
||||
def background_color(self, column, color):
|
||||
self._chart.run_script(f"{self._table.id}.rows[{self.id}]['{column}'].style.backgroundColor = '{color}'")
|
||||
def background_color(self, column, color): self._style('backgroundColor', column, color)
|
||||
|
||||
def text_color(self, column, color): self._style('textColor', column, color)
|
||||
|
||||
def _style(self, style, column, arg):
|
||||
self._run_script(f"{self._table.id}.rows[{self.id}]['{column}'].style.{style} = '{arg}'")
|
||||
|
||||
def delete(self):
|
||||
self._chart.run_script(f"{self._table.id}.deleteRow('{self.id}')")
|
||||
self._run_script(f"{self._table.id}.deleteRow('{self.id}')")
|
||||
self._table.pop(self.id)
|
||||
|
||||
class Table(dict):
|
||||
VALUE = 'CELL__~__VALUE__~__PLACEHOLDER'
|
||||
|
||||
def __init__(self, chart, width, height, headings, widths=None, alignments=None, position='left', draggable=False, method=None):
|
||||
def __init__(self, chart, width, height, headings, widths=None, alignments=None, position='left', draggable=False, func=None):
|
||||
super().__init__()
|
||||
self._run_script = chart.run_script
|
||||
self._chart = chart
|
||||
self.headings = headings
|
||||
self._formatters = {}
|
||||
self.is_shown = True
|
||||
|
||||
self.id = self._chart._rand.generate()
|
||||
self._chart.run_script(f'''
|
||||
{self.id} = new Table({width}, {height}, {list(headings)}, {list(widths)}, {list(alignments)}, '{position}', {_js_bool(draggable)}, '{method}', {chart.id})
|
||||
self.id = chart._rand.generate()
|
||||
chart._handlers[self.id] = lambda rId: func(self[rId])
|
||||
self._run_script(f'''
|
||||
{self.id} = new Table({width}, {height}, {list(headings)}, {list(widths) if widths else []}, {list(alignments) if alignments else []},
|
||||
'{position}', {jbool(draggable)}, {chart.id})
|
||||
''')
|
||||
self._run_script(f'{self.id}.callbackName = "{self.id}"') if func else None
|
||||
self.footer = Footer(self)
|
||||
|
||||
def new_row(self, *values, id=None) -> Row:
|
||||
@ -61,7 +69,7 @@ class Table(dict):
|
||||
self[row_id] = Row(self, row_id, {heading: item for heading, item in zip(self.headings, values)})
|
||||
return self[row_id]
|
||||
|
||||
def clear(self): self._chart.run_script(f"{self.id}.clearRows()"), super().clear()
|
||||
def clear(self): self._run_script(f"{self.id}.clearRows()"), super().clear()
|
||||
|
||||
def get(self, __key: Union[int, str]) -> Row: return super().get(int(__key))
|
||||
|
||||
@ -71,7 +79,7 @@ class Table(dict):
|
||||
|
||||
def visible(self, visible: bool):
|
||||
self.is_shown = visible
|
||||
self._chart.run_script(f"""
|
||||
self._run_script(f"""
|
||||
{self.id}.container.style.display = '{'block' if visible else 'none'}'
|
||||
{self.id}.container.{'add' if visible else 'remove'}EventListener('mousedown', {self.id}.onMouseDown)
|
||||
""")
|
||||
|
||||
@ -1,43 +1,20 @@
|
||||
import re
|
||||
import asyncio
|
||||
from random import choices
|
||||
from string import ascii_lowercase
|
||||
from typing import Literal
|
||||
|
||||
|
||||
class MissingColumn(KeyError):
|
||||
def __init__(self, message):
|
||||
super().__init__(message)
|
||||
self.msg = message
|
||||
|
||||
def __str__(self):
|
||||
return f'{self.msg}'
|
||||
|
||||
|
||||
class ColorError(ValueError):
|
||||
def __init__(self, message):
|
||||
super().__init__(message)
|
||||
self.msg = message
|
||||
|
||||
def __str__(self):
|
||||
return f'{self.msg}'
|
||||
|
||||
|
||||
class IDGen(list):
|
||||
ascii = 'abcdefghijklmnopqrstuvwxyz'
|
||||
|
||||
def generate(self):
|
||||
var = ''.join(choices(ascii_lowercase, k=8))
|
||||
var = ''.join(choices(self.ascii, k=8))
|
||||
if var not in self:
|
||||
self.append(var)
|
||||
return f'window.{var}'
|
||||
self.generate()
|
||||
|
||||
|
||||
def _valid_color(string):
|
||||
if string[:3] == 'rgb' or string[:4] == 'rgba' or string[0] == '#':
|
||||
return True
|
||||
raise ColorError('Colors must be in the format of either rgb, rgba or hex.')
|
||||
|
||||
|
||||
def _js_bool(b: bool): return 'true' if b is True else 'false' if b is False else None
|
||||
def jbool(b: bool): return 'true' if b is True else 'false' if b is False else None
|
||||
|
||||
|
||||
LINE_STYLE = Literal['solid', 'dotted', 'dashed', 'large_dashed', 'sparse_dotted']
|
||||
@ -51,24 +28,24 @@ CROSSHAIR_MODE = Literal['normal', 'magnet']
|
||||
PRICE_SCALE_MODE = Literal['normal', 'logarithmic', 'percentage', 'index100']
|
||||
|
||||
|
||||
def _line_style(line: LINE_STYLE):
|
||||
def line_style(line: LINE_STYLE):
|
||||
js = 'LightweightCharts.LineStyle.'
|
||||
return js+line[:line.index('_')].title() + line[line.index('_') + 1:].title() if '_' in line else js+line.title()
|
||||
|
||||
|
||||
def _crosshair_mode(mode: CROSSHAIR_MODE):
|
||||
def crosshair_mode(mode: CROSSHAIR_MODE):
|
||||
return f'LightweightCharts.CrosshairMode.{mode.title()}' if mode else None
|
||||
|
||||
|
||||
def _price_scale_mode(mode: PRICE_SCALE_MODE):
|
||||
def price_scale_mode(mode: PRICE_SCALE_MODE):
|
||||
return f"LightweightCharts.PriceScaleMode.{'IndexedTo100' if mode == 'index100' else mode.title() if mode else None}"
|
||||
|
||||
|
||||
def _marker_shape(shape: MARKER_SHAPE):
|
||||
def marker_shape(shape: MARKER_SHAPE):
|
||||
return shape[:shape.index('_')]+shape[shape.index('_')+1:].title() if '_' in shape else shape.title()
|
||||
|
||||
|
||||
def _marker_position(p: MARKER_POSITION):
|
||||
def marker_position(p: MARKER_POSITION):
|
||||
return {
|
||||
'above': 'aboveBar',
|
||||
'below': 'belowBar',
|
||||
@ -77,17 +54,59 @@ def _marker_position(p: MARKER_POSITION):
|
||||
}[p]
|
||||
|
||||
|
||||
def _convert_timeframe(timeframe):
|
||||
spans = {
|
||||
'min': 'minute',
|
||||
'H': 'hour',
|
||||
'D': 'day',
|
||||
'W': 'week',
|
||||
'M': 'month',
|
||||
}
|
||||
try:
|
||||
multiplier = re.findall(r'\d+', timeframe)[0]
|
||||
except IndexError:
|
||||
return 1, spans[timeframe]
|
||||
timespan = spans[timeframe.replace(multiplier, '')]
|
||||
return multiplier, timespan
|
||||
class Emitter:
|
||||
def __init__(self):
|
||||
self._callable = None
|
||||
|
||||
def __iadd__(self, other):
|
||||
self._callable = other
|
||||
return self
|
||||
|
||||
def _emit(self, *args):
|
||||
self._callable(*args) if self._callable else None
|
||||
|
||||
class JSEmitter:
|
||||
def __init__(self, chart, name, on_iadd, wrapper=None):
|
||||
self._on_iadd = on_iadd
|
||||
self._chart = chart
|
||||
self._name = name
|
||||
self._wrapper = wrapper
|
||||
|
||||
def __iadd__(self, other):
|
||||
def final_wrapper(*arg):
|
||||
other(self._chart, *arg) if not self._wrapper else self._wrapper(other, self._chart, *arg)
|
||||
async def final_async_wrapper(*arg):
|
||||
await other(self._chart, *arg) if not self._wrapper else await self._wrapper(other, self._chart, *arg)
|
||||
|
||||
self._chart._handlers[self._name] = final_async_wrapper if asyncio.iscoroutinefunction(other) else final_wrapper
|
||||
self._on_iadd(other)
|
||||
return self
|
||||
|
||||
|
||||
class Events:
|
||||
def __init__(self, chart):
|
||||
self.new_bar = Emitter()
|
||||
from lightweight_charts.abstract import JS
|
||||
self.search = JSEmitter(chart, f'search{chart.id}',
|
||||
lambda o: chart.run_script(f'''
|
||||
{JS['callback'] if not chart._callbacks_enabled else ''}
|
||||
makeSpinner({chart.id})
|
||||
{chart.id}.search = makeSearchBox({chart.id})
|
||||
''')
|
||||
)
|
||||
self.range_change = JSEmitter(chart, f'range_change{chart.id}',
|
||||
lambda o: chart.run_script(f'''
|
||||
let checkLogicalRange = (logical) => {{
|
||||
{chart.id}.chart.timeScale().unsubscribeVisibleLogicalRangeChange(checkLogicalRange)
|
||||
|
||||
let barsInfo = {chart.id}.series.barsInLogicalRange(logical)
|
||||
if (barsInfo) window.callbackFunction(`range_change{chart.id}_~_${{barsInfo.barsBefore}};;;${{barsInfo.barsAfter}}`)
|
||||
|
||||
setTimeout(() => {chart.id}.chart.timeScale().subscribeVisibleLogicalRangeChange(checkLogicalRange), 50)
|
||||
}}
|
||||
{chart.id}.chart.timeScale().subscribeVisibleLogicalRangeChange(checkLogicalRange)
|
||||
'''),
|
||||
wrapper=lambda o, c, *arg: o(c, *[float(a) for a in arg])
|
||||
)
|
||||
|
||||
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
import asyncio
|
||||
from inspect import iscoroutinefunction
|
||||
|
||||
try:
|
||||
import wx.html2
|
||||
@ -19,7 +18,21 @@ try:
|
||||
def callback(self, message):
|
||||
_widget_message(self.chart, message)
|
||||
except ImportError:
|
||||
QWebEngineView = None
|
||||
try:
|
||||
from PySide6.QtWebEngineWidgets import QWebEngineView
|
||||
from PySide6.QtWebChannel import QWebChannel
|
||||
from PySide6.QtCore import QObject, Slot
|
||||
|
||||
class Bridge(QObject):
|
||||
def __init__(self, chart):
|
||||
super().__init__()
|
||||
self.chart = chart
|
||||
|
||||
@Slot(str)
|
||||
def callback(self, message):
|
||||
_widget_message(self.chart, message)
|
||||
except ImportError:
|
||||
QWebEngineView = None
|
||||
try:
|
||||
from streamlit.components.v1 import html
|
||||
except ImportError:
|
||||
@ -33,55 +46,43 @@ from lightweight_charts.abstract import LWC, JS
|
||||
|
||||
|
||||
def _widget_message(chart, string):
|
||||
messages = string.split('_~_')
|
||||
name, chart_id = messages[:2]
|
||||
arg = messages[2]
|
||||
chart.api.chart = chart._charts[chart_id]
|
||||
fixed_callbacks = ('on_search', 'on_horizontal_line_move')
|
||||
func = chart._methods[name] if name not in fixed_callbacks else getattr(chart._api, name)
|
||||
if hasattr(chart._api.chart, 'topbar') and (widget := chart._api.chart.topbar._widget_with_method(name)):
|
||||
widget.value = arg
|
||||
asyncio.create_task(func()) if asyncio.iscoroutinefunction(func) else func()
|
||||
else:
|
||||
asyncio.create_task(func(*arg.split(';;;'))) if asyncio.iscoroutinefunction(func) else func(*arg.split(';;;'))
|
||||
name, args = string.split('_~_')
|
||||
args = args.split(';;;')
|
||||
func = chart._handlers[name]
|
||||
asyncio.create_task(func(*args)) if asyncio.iscoroutinefunction(func) else func(*args)
|
||||
|
||||
|
||||
class WxChart(LWC):
|
||||
def __init__(self, parent, volume_enabled: bool = True, inner_width: float = 1.0, inner_height: float = 1.0,
|
||||
scale_candles_only: bool = False, api: object = None, topbar: bool = False, searchbox: bool = False,
|
||||
toolbox: bool = False):
|
||||
def __init__(self, parent, inner_width: float = 1.0, inner_height: float = 1.0,
|
||||
scale_candles_only: bool = False, toolbox: bool = False):
|
||||
if wx is None:
|
||||
raise ModuleNotFoundError('wx.html2 was not found, and must be installed to use WxChart.')
|
||||
self.webview: wx.html2.WebView = wx.html2.WebView.New(parent)
|
||||
|
||||
super().__init__(volume_enabled, inner_width=inner_width, inner_height=inner_height,
|
||||
scale_candles_only=scale_candles_only, topbar=topbar, searchbox=searchbox, toolbox=toolbox,
|
||||
super().__init__(inner_width=inner_width, inner_height=inner_height,
|
||||
scale_candles_only=scale_candles_only, toolbox=toolbox,
|
||||
_js_api_code='window.wx_msg.postMessage.bind(window.wx_msg)')
|
||||
self.api = api
|
||||
self._script_func = self.webview.RunScript
|
||||
|
||||
self.webview.Bind(wx.html2.EVT_WEBVIEW_LOADED, lambda e: wx.CallLater(500, self._on_js_load))
|
||||
self.webview.Bind(wx.html2.EVT_WEBVIEW_SCRIPT_MESSAGE_RECEIVED, lambda e: _widget_message(self, e.GetString()))
|
||||
self.webview.AddScriptMessageHandler('wx_msg')
|
||||
self.webview.SetPage(self._html, '')
|
||||
self.webview.AddUserScript(JS['callback']) if topbar or searchbox else None
|
||||
self.webview.AddUserScript(JS['toolbox']) if toolbox else None
|
||||
|
||||
def get_webview(self): return self.webview
|
||||
|
||||
|
||||
class QtChart(LWC):
|
||||
def __init__(self, widget=None, volume_enabled: bool = True, inner_width: float = 1.0, inner_height: float = 1.0,
|
||||
scale_candles_only: bool = False, api: object = None, topbar: bool = False, searchbox: bool = False,
|
||||
toolbox: bool = False):
|
||||
def __init__(self, widget=None, inner_width: float = 1.0, inner_height: float = 1.0,
|
||||
scale_candles_only: bool = False, toolbox: bool = False):
|
||||
if QWebEngineView is None:
|
||||
raise ModuleNotFoundError('QWebEngineView was not found, and must be installed to use QtChart.')
|
||||
self.webview = QWebEngineView(widget)
|
||||
|
||||
super().__init__(volume_enabled, inner_width=inner_width, inner_height=inner_height,
|
||||
scale_candles_only=scale_candles_only, topbar=topbar, searchbox=searchbox, toolbox=toolbox,
|
||||
super().__init__(inner_width=inner_width, inner_height=inner_height,
|
||||
scale_candles_only=scale_candles_only, toolbox=toolbox,
|
||||
_js_api_code='window.pythonObject.callback')
|
||||
self.api = api
|
||||
self._script_func = self.webview.page().runJavaScript
|
||||
|
||||
self.web_channel = QWebChannel()
|
||||
@ -106,8 +107,9 @@ class QtChart(LWC):
|
||||
|
||||
|
||||
class StaticLWC(LWC):
|
||||
def __init__(self, volume_enabled=True, width=None, height=None, inner_width=1, inner_height=1, scale_candles_only: bool = False, toolbox=False, autosize=True):
|
||||
super().__init__(volume_enabled, inner_width, inner_height, scale_candles_only=scale_candles_only, toolbox=toolbox, autosize=autosize)
|
||||
def __init__(self, width=None, height=None, inner_width=1, inner_height=1,
|
||||
scale_candles_only: bool = False, toolbox=False, autosize=True):
|
||||
super().__init__(inner_width, inner_height, scale_candles_only=scale_candles_only, toolbox=toolbox, autosize=autosize)
|
||||
self.width = width
|
||||
self.height = height
|
||||
self._html = self._html.replace('</script>\n</body>\n</html>', '')
|
||||
@ -130,8 +132,8 @@ class StaticLWC(LWC):
|
||||
|
||||
|
||||
class StreamlitChart(StaticLWC):
|
||||
def __init__(self, volume_enabled=True, width=None, height=None, inner_width=1, inner_height=1, scale_candles_only: bool = False, toolbox: bool = False):
|
||||
super().__init__(volume_enabled, width, height, inner_width, inner_height, scale_candles_only, toolbox)
|
||||
def __init__(self, width=None, height=None, inner_width=1, inner_height=1, scale_candles_only: bool = False, toolbox: bool = False):
|
||||
super().__init__(width, height, inner_width, inner_height, scale_candles_only, toolbox)
|
||||
|
||||
def _load(self):
|
||||
if html is None:
|
||||
@ -140,8 +142,8 @@ class StreamlitChart(StaticLWC):
|
||||
|
||||
|
||||
class JupyterChart(StaticLWC):
|
||||
def __init__(self, volume_enabled=True, width: int = 800, height=350, inner_width=1, inner_height=1, scale_candles_only: bool = False, toolbox: bool = False):
|
||||
super().__init__(volume_enabled, width, height, inner_width, inner_height, scale_candles_only, toolbox, autosize=False)
|
||||
def __init__(self, width: int = 800, height=350, inner_width=1, inner_height=1, scale_candles_only: bool = False, toolbox: bool = False):
|
||||
super().__init__(width, height, inner_width, inner_height, scale_candles_only, toolbox, autosize=False)
|
||||
self._position = ""
|
||||
|
||||
self.run_script(f'''
|
||||
|
||||
Reference in New Issue
Block a user