Created
August 4, 2022 16:29
-
-
Save SlicedSilver/f2634ec2d06c5d47dab2f89dcf29b45a to your computer and use it in GitHub Desktop.
Lightweight Charts. Example of getting the series data when clicking on the chart.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta | |
| name="viewport" | |
| content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0" | |
| /> | |
| <title>Debug page</title> | |
| <script | |
| type="text/javascript" | |
| src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js" | |
| ></script> | |
| </head> | |
| <body style="padding: 0; margin: 0"> | |
| <div | |
| id="container" | |
| style="position: absolute; width: 100%; height: 100%" | |
| ></div> | |
| <script type="text/javascript"> | |
| function generateData() { | |
| var res = []; | |
| var time = new Date(Date.UTC(2018, 0, 1, 0, 0, 0, 0)); | |
| for (var i = 0; i < 500; ++i) { | |
| res.push({ | |
| time: time.getTime() / 1000, | |
| high: i + 10, | |
| low: i - 10, | |
| open: i - 5, | |
| close: i + 5, | |
| }); | |
| time.setUTCDate(time.getUTCDate() + 1); | |
| } | |
| return res; | |
| } | |
| var chart = LightweightCharts.createChart( | |
| document.getElementById("container") | |
| ); | |
| var mainSeries = chart.addCandlestickSeries({}); | |
| mainSeries.setData(generateData()); | |
| function myClickHandler(param) { | |
| if (!param.point) { | |
| return; | |
| } | |
| const datapoint = param.seriesPrices.get(mainSeries); | |
| console.log(datapoint); | |
| } | |
| chart.subscribeClick(myClickHandler); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment