I need a javascript charting library that will fit my needs as I will elaborate. I need to be able to create multi series candlestick charts stacked ontop of volume bars, and I also need to be draw pictures on top of the data points. And I need to be able to have a range slider at the bottom to look at old datapoints.
I was using google.visualization, but as soon as I put a range filter on it, it broke my needs, as trying to get the positions on the chart converted into coordinates, so that I could draw images on top of the candles on a canvas I positioned ontop of it, got broken (seems I have to stretch them out from the middle). But I was just annoyed and I started looking at canvasJS, because they use a canvas, so I didn't have to create my own canvas on top and I read that drawing on a canvas is better on memory because it's not creating new dom elements everytime there is data added to it, and this is dynamic data. Plus the range filter available in google visulization sucks because it doesn't really look good when you have multi series, as it looks ugly and I originally just wanted a slider that I could slide back and forth to look at older data as it is a live chart connected to a websocket I am making. And I can't do that in google.visulizations.
So I started trying to use canvasJS, but I couldn't find a way to have both a multi series candlestick data and volume bars underneath complete with there own separate y axis labels. So I created two charts and put them underneath each other. But then I had to line up the y axis, and I figured out how to do that, but the problem is they force you to render it before doing the calculations you need to do to line it up, so I had to render it, adjust the axis, and re-render it, over and over again as this is dynamic data. I tried getting around this by rendering first to an invisible div then copying to a visible canvas, but the y axis was no longer visible for some reason. I tried resetting the size of the visible canvas based on the bounds of the invisible chart, but still there was no y axis for some reason. Maybe I could figure it out, but the fact that I have to do hackish things to make the library fit my needs just because they don't have the exact features I need is not ideal, and I could waste a lot of time trying to get it to work, as I already have.
I could keep looking at more libraries, but what if I discover more ways they don't fit my needs. But maybe there are some suggestions that could be given. I am getting to the point where I am thinking about creating my own chart from scratch in HTML5 canvas without a library.
