chartjs / chartjs-chart-financial

Chart.js module for charting financial securities
MIT License
721 stars 196 forks source link

latest commit ef246ede4d20a has broken me #76

Closed CupcakeThief closed 4 years ago

CupcakeThief commented 4 years ago

Not been able to trace through to the root of the problem, I'm afraid - and my code isn't pretty enough to give you a 'steps to reproduce'. I see from the commit that the sample tests have been updated to use integers instead of date strings on the x-axis, could this be related? I have custom y-axis called 'price' instead of 'y', changing this to 'y' doesn't do much though.

have some sample data: "[{"t":"2020-06-18T00:00:00Z","o":0.9336,"h":0.93406,"l":0.93266,"c":0.93345,"isTrendingUp":false,"prospects":[]},{"t":"2020-06-18T01:00:00Z","o":0.93345,"h":0.9344,"l":0.93015,"c":0.93158,"isTrendingUp":false,"prospects":[]},{"t":"2020-06-18T02:00:00Z","o":0.93158,"h":0.93175,"l":0.93068,"c":0.93132,"isTrendingUp":false,"prospects":[]},{"t":"2020-06-18T03:00:00Z","o":0.93132,"h":0.93251,"l":0.93098,"c":0.93213,"isTrendingUp":true,"prospects":[]},{"t":"2020-06-18T04:00:00Z","o":0.93213,"h":0.93301,"l":0.93127,"c":0.9326,"isTrendingUp":true,"prospects":[]},{"t":"2020-06-18T05:00:00Z","o":0.9326,"h":0.93337,"l":0.93165,"c":0.93195,"isTrendingUp":false,"prospects":[]},{"t":"2020-06-18T06:00:00Z","o":0.93195,"h":0.93314,"l":0.93149,"c":0.93176,"isTrendingUp":false,"prospects":[]},{"t":"2020-06-18T07:00:00Z","o":0.93176,"h":0.93197,"l":0.93046,"c":0.93152,"isTrendingUp":false,"prospects":[]},{"t":"2020-06-18T08:00:00Z","o":0.93152,"h":0.93368,"l":0.93093,"c":0.93292,"isTrendingUp":true,"prospects":[]}]"

nothing particularly funky with my dataset:

{ label: ['Candles'], borderColor: 'black', color: { up: 'white', down: 'black', unchanged: 'gray' }, data: candles, prospects: candles.map(c => c.prospects), order: 10, yAxisID: 'price', categoryPercentage: 1.0, barPercentage: 1.0 }

defaults are also pretty boring: financial: { scales: { x: { distribution: 'linear' } } },

In the meantime, I've forked & reverted back to the previous commit, which works perfectly for me.

mystery.

CupcakeThief commented 4 years ago

One additional point of interest - I have multiple series on my chart, which are a mix of scatter and line, with one candlestick. Latest version gives me a blank canvas (no errors in the console).

  1. Removing just the candlestick series, I still get a blank canvas
  2. If i also change the default chart type from candlestick to line, my data comes back
  3. If I add the candlestick series back in, and leave default type as line, then I'm back to a blank canvas
benmccann commented 4 years ago

You should specify t as a timestamp. You can probably make it work as before by specifying the parsing: true option if you don't mind giving up some performance

CupcakeThief commented 4 years ago

Setting parsing: true didn't work. Changing t to use timestamps did. There's probably a better way, but fwiw:

t: moment(c.DateFrom).unix()*1000
CupcakeThief commented 4 years ago

Alas, I spoke too soon. It seems there is further collateral, probably related to the line series with gaps that I draw. Have run out of time for tinkering today, but here's the comment from my pet tester: The legend is the only bit that looks right on this chart...It appears to be a large penis.

image

CupcakeThief commented 4 years ago

Here's the same graph, using the older plugin: image

benmccann commented 4 years ago

I think you can call .valueOf() instead of .unix()*1000. Side note, I highly recommend against using Moment because it's a huge file for the user to download to the browser. date-fns is much smaller alternative for simple stuff and Luxon is a much more feature complete alternative by one of the authors of Moment which supports timezones and i18n.

benmccann commented 4 years ago

While the picture is very amusing :smile: , there's not enough information to be able to tell what's wrong. Is this something you could put in a site like Plnkr to share with me?

CupcakeThief commented 4 years ago

my first ever plunk, I'm so proud... https://plnkr.co/edit/BF1XCbBXlmSoVZJj?open=lib%2Fscript.js

benmccann commented 4 years ago

Thanks for that. The issue is that you're not using t and timestamps everywhere. Some places you are using x and some places you have strings as values

CupcakeThief commented 4 years ago

Thanks - I have a few other tickets to look at, will post an updated plunkr once I get back round to this