With a project this size, one thing always leads to another. There are so many rabbit holes to lose oneself in.
I started the research for implementing pixel perfect hit detection for the chart, as currently the calculations are prone to rounding errors which add up over many iterations, ultimately creating a sub optimal user experience.
The chart already has an extremely flexible multi-layered canvas class. The task is now to work hit detection layers into this. But more on that topic for another post. What this led to, was me finally implementing a chart image snapshot export; something I'd been putting off for a long time.
In theory it should be straight forward, because, that chart already has all of the layers for each chart component, all I needed to do was composite them together on a larger canvas, and then pass that to the code that would turn that into a format the browser could work with as a download.
In practice it was straight forward! Which left me wondering why I avoided it for so long.
So now it is as simple as chart.downloadImage() to save a .png image file to your local storage.
There is also a related toImageURL() call that then can be passed to other HTML elements as an image source, or passed on to other API calls.
The chart's development progress is accelerating now, because so many of the fundamentals are now in place, which means I'm starting to fill i the gaps, rather than working on the foundations.
In the coming posts, I'll fill you in on the big leap forward that is coming.
Available on GitHub and NPM
GitHub
https://github.com/tradex-app/TradeX-chart
NPM
https://www.npmjs.com/package/tradex-chart
Documentation - WIP
https://tradex-chart.guildmedia.net/reference/api-examples/#download-image