CODEWITHSUNDEEP
javascripttradingview-api
Allart
Allart

Reputation: 928

How to get the current price of custom chart with Javascript lightweight-chart API?

How can I get the price shown in the chart at the right side of my chart marked in blue. enter image description here

This is my code so far:

const chart = LightweightCharts.createChart(document.body, { width: 1500, height: 700 });
const lineSeries = chart.addLineSeries();

const log = console.log;

lineSeries.setData([
    { time: '2019-04-11', value: 80.01 },
    { time: '2019-04-12', value: 96.63 },
    { time: '2019-04-13', value: 76.64 },
    { time: '2019-04-14', value: 81.89 },
    { time: '2019-04-15', value: 74.43 },
    { time: '2019-04-16', value: 80.01 },
    { time: '2019-04-17', value: 96.63 },
    { time: '2019-04-18', value: 76.64 },
    { time: '2019-04-19', value: 81.89 },
    { time: '2019-04-20', value: 74.43 },
]);

function randomIntFromInterval(min, max) {
    return Math.round((Math.random() * (max - min + 1) + min) * 100) / 100;
}

var startDate = new Date();
var endDate = new Date(2020, 5, 1);

log(lineSeries);


// lineSeries.applyOptions({
//     priceFormat: {
//         type: 'custom',
//         minMove: 0.02,
//         formatter: function(price) {
//             log(price);                //Gives me the price in a very bad way. Also gives it when i hover over chart.
//             return '$' + price;
//         },
//     }
// });


/**
 * Updates the chart its lines randomly.
 */
function updateChartStatic() {
    setTimeout(() => {
        //For updating the date.
        let newDate = new Date(startDate);

        //Creates a random int.
        let randomInt = randomIntFromInterval(randomIntFromInterval(50, 100), randomIntFromInterval(75, 125));

        // log(randomInt);
        log(lineSeries._series._priceScale.rn.ct);

        //Updates the line of the chart.
        lineSeries.update({
            time: newDate.getFullYear() + '-' + (newDate.getMonth() + 1) + '-' + newDate.getDate(),
            value: randomInt,
        });

        //Makes sure the loop can actually end by adding a day to the startDate.
        startDate.setDate(startDate.getDate() + 1);

        //Make sure the function will be called again if startDate and endDate date not matches with each other. If they do, the loop will end and a console log will be shown.
        startDate <= endDate ? updateChartStatic() : log("END LOOP");
    }, 1000);
}

updateChartStatic();

Atm I update the lines randomly between some numbers. I need to know the price to make sure the lines update based on the current price. So a new line would be for example 50 dollar/euro in price higher or lower then the current price. This would make it less pointy :) In pseudo code:

let randomInt = randomIntFromInterval((currentPrice - 50), (currentprice + 50));

Upvotes: 0

Views: 2118

Answers (1)

Anarchy365
Anarchy365

Reputation: 26

An alternative to get the last value added to your lineSeries data is by Saving the data before doing another line update with your setTimeout. E.g.,

/**
 * Updates the chart its lines randomly.
 */
 function updateChartStatic() {

    // Array where we store all our added prices.
    var oldPrices = [];

    setTimeout(() => {

        // Creates a random int.
        let randomInt = randomIntFromInterval(randomIntFromInterval(50, 100), randomIntFromInterval(75, 125));

        // Logs OLD price. First time will be empty in this case
        log(oldPrices[oldPrices.length - 1]);

        // Updates the line of the chart.
        lineSeries.update({
            time: newDate.getFullYear() + '-' + (newDate.getMonth() + 1) + '-' + newDate.getDate(),
            value: randomInt,
        });

        // Add your currently set price to the array of prices.
        oldPrices.push(randomInt);
    }, 1000);
}

Old prices are stored in var oldPrices.

Here's another example from tradingview.com. https://jsfiddle.net/TradingView/8a29s0qj/

Upvotes: 1

Related Questions