Closed yigiterdall closed 1 year ago
SlicedSilver
commented
1 year ago I believe that the issue is:
Lightweight charts expects the time value to be in seconds, not milliseconds. Could you try divide the time value by 1000?
For example:
var timestamp = date.getTime() / 1000;Additionally, if you use the development build of the library instead of the production build then you will get more helpful console errors.
yigiterdall
commented
1 year ago I believe that the issue is: Lightweight charts expects the
timevalue to be in seconds, not milliseconds. Could you try divide the time value by1000?For example:
var timestamp = date.getTime() / 1000;Additionally, if you use the
developmentbuild of the library instead of theproductionbuild then you will get more helpful console errors.
Thank you for your answer, but I had tried this before. I tried again and the problem persists. I don't know exactly what you're saying about console errors, can you give an example please?
By the way, the timestamp example is as follows:
1675771800 1675771740 1675771680 1675771620 1675771560 1675771500
SlicedSilver
commented
1 year ago If you run your example with the development build of the library then you will get the following error in the console:
Assertion failed: data must be asc ordered by time, index=1, time=1675782360, prev time=1675782600This means that the data is not in the correct order. The timestamps in the array should be in ascending order.
You still need to divide by 1000.
Example: https://codesandbox.io/s/timestamps-lwc-5tjgrh?file=/src/index.js
Depending on how you load the library will determine how to load the development version.
Looks like you are using the standalone version. So you can change your script tag from
<script
type="text/javascript"
src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js"
></script>to:
<script
type="text/javascript"
src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.development.js"
></script>If you run your example with the
developmentbuild of the library then you will get the following error in the console:Assertion failed: data must be asc ordered by time, index=1, time=1675782360, prev time=1675782600This means that the data is not in the correct order. The timestamps in the array should be in ascending order. You still need to divide by
1000.Example: https://codesandbox.io/s/timestamps-lwc-5tjgrh?file=/src/index.js
Depending on how you load the library will determine how to load the development version.
Looks like you are using the standalone version. So you can change your script tag from
<script type="text/javascript" src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js" ></script>to:
<script type="text/javascript" src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.development.js" ></script>
Solved! Thank you very much. I was having a problem with the exact data inversion.
I am sharing all the code to help. I hope it will be a solution for someone else as well.
<script src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.development.js"></script>
<script>
const log = console.log;
const chartProperties = {
width:300,
height:400,
timeScale:{
timeVisible:true,
secondsVisible:false,
}
}
const domElement = document.getElementById('chart');
const chart = LightweightCharts.createChart(domElement,chartProperties);
const candleSeries = chart.addCandlestickSeries();
fetch('YOURJSON API LINK HERE')
.then(res => res.json())
.then(data => {
data.reverse()
const cdata = data.map(d => {
var dateString = d["date"];
var date = new Date(dateString);
var timestamp = date.getTime() / 1000;
console.log(timestamp);
return {time:timestamp,open:parseFloat(d["open"]),high:parseFloat(d["high"]),low:parseFloat(d["low"]),close:parseFloat(d["close"])}
});
candleSeries.setData(cdata);
})
.catch(err => log(err))
</script>
Hello everyone,
I want to graph OHLC data from api with candlestick chart. I have no problem with Binance api. I have no problem with Coinecko api. These two APIs are also written in similar ways. But when I get data from a different source, the date part comes as follows:
I'm converting this to timestamp in the code help below and when I write it to the console it's fine. But javascript says data is empty.
My conversion code:
Error Received:
All Codes: