rustico/core
2
0
Fork 0
Code Issues 9 Pull Requests Projects Releases Wiki Activity

added dashed line on last price

Browse Source
This commit is contained in:
Giulio De Pasquale 2020-12-14 15:37:12 +00:00
parent dfc9adcd9f
commit 1718c37751
1 changed files with 45 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
websrc/components/RPlot.tsx
View File

@ -10,9 +10,18 @@ type FirstConnectData = {
prices: Array<number>
}
type PriceLine = {
x0: number,
y0: number,
x1: number,
y1: number
}
type PlotState = {
x: Array<number>,
y: Array<number>
y: Array<number>,
price_line: PriceLine
}
class RPlot extends Component<{}, PlotState> {
@ -22,14 +31,24 @@ class RPlot extends Component<{}, PlotState> {
state = {
x: [],
y: []
y: [],
price_line: { x0: 0, x1: 0, y0: 0, y1: 0 }
}
componentDidMount() {
socket.on("first_connect", (data: FirstConnectData) => {
var last_tick = data.ticks[data.ticks.length - 1]
var last_price = data.prices[data.prices.length - 1]
this.setState({
x: data.ticks,
y: data.prices
y: data.prices,
price_line: {
x0: 0,
y0: last_price,
x1: last_tick,
y1: last_price
}
})
})
@ -44,6 +63,12 @@ class RPlot extends Component<{}, PlotState> {
this.setState({
x: x,
y: y,
price_line: {
x0: 0,
y0: data.price,
x1: data.tick,
y1: data.price
}
})
})
}
@ -60,7 +85,22 @@ class RPlot extends Component<{}, PlotState> {
"marker.colorbar": { tickformat: ".1f" }
},
]}
layout={{ dragmode: "pan", autosize: true }}
layout={{
dragmode: "pan", autosize: true, shapes: [
{
type: 'line',
x0: this.state.price_line.x0,
y0: this.state.price_line.y0,
x1: this.state.price_line.x1,
y1: this.state.price_line.y1,
line: {
color: 'rgb(50, 171, 96)',
width: 2,
dash: 'dashdot'
}
},
]
}}
config={{
scrollZoom: true,
displayModeBar: false,