TradingView candlestick chart help

I’m trying to implement a TradingView-like candlestick chart for my web-app, using hermes price feeds API for data. The flow on the backend is pretty simple:

  • request the price feed with changes by second with a 60s offset (so that we get the data in a minute timeframe with 1s gap)
  • somehow we need to render it as a candlestick chart on the frontend.

I know about the Pyth’s adapter, but AFAIK it only returns JUST one entry per minute MAX, so it doesnt really suit our purpose/use-case.
Looking for assistance/advice on how to approach this task.
Here’s the code of the backend endpoint (Node.js/Express):

app.get("/api/priceFeed/:priceFeedId", async (req, res) => {
	try {
		const { priceFeedId } = req.params;

		const priceFeedRegex = /^0x[a-f0-9]{64}$/;

		if (!priceFeedRegex.test(priceFeedId)) {
			console.log(`Invalid price feed id format: ${priceFeedId}`);
			return res.status(400).json({ error: "Invalid price feed id format" });
		}

		const reqTs = new Date(Date.now());
		const normalizedTimestamp =
			(reqTs - reqTs.getMilliseconds() - PRICE_FEED_SUBTRACTOR * 1000) / 1000;

		const response = await axios.get(
			`${PRICE_FEED_URL}/${normalizedTimestamp}/${PRICE_FEED_SUBTRACTOR}?ids=${priceFeedId}`,
		);

		result = response.data.map((obj) => {
			const parsed = obj.parsed[0].price;
			return {
				x: parsed.publish_time * 1000,
				y: parseFloat(
					(parseInt(parsed.price) / 10 ** Math.abs(parsed.expo)).toFixed(2),
				),
			};
		});

		res.status(200).json(result);
	} catch (error) {
		res.status(500).json({ error: "Failed to retrieve the price feed" });
		console.error("Error retrieving the price feed:", error);
	}
});

In short, i would like an advice on a solution that would use a smaller timeframe for a candle (like 10-15 seconds) using a proper TradingView chart.

Unfortunately the Benchmarks API does not support resolutions higher than 1 minute. I’m not sure I understand how you want to do it using Hermes and the problem you are facing. If you want to use Hermes, you need to store the data in a time series database and later query the data from that to get a complete chart (otherwise you need to make requests for each second price which gets you rate limited). The flow would like this:

  1. A writer service: subscribes to hermes prices and loads the data in a timeseries database (such as Clickhouse)

  2. A (materialized) view to create candles supporting different resolutions

  3. Service Backend: just querying the database to get the candles

somehow we need to render it as a candlestick chart on the frontend.

Pyth has price updates every 400ms and you can convert that to a candle for 1s as well.

1 Like