Trying to make it work with NodeJS and ChartjsNodeCanvas

[vzhilov]

Hello, thank you for the great plugin!

I do:

Git clone https://github.com/chartjs/chartjs-chart-financial/
cd chartjs-chart-financial
npm install
gulp build

As result I get a file in /dist directory and copy it to me NodeJS project folder.

In my NodeJS app I do:

const Chart = require(‘chart.js’)
const ChartFinancial = require(‘./chartjs-chart-financial.js’)

When I run the app I get:

chartjs-chart-financial.js:227
globalOpts.elements.financial = {
TypeError: Cannot set property ‘financial’ of undefined

I have checked content of Chart.defaults and found that .elements is in ‘global’ so I changed

225 const globalOpts = Chart.defaults.global
316 const globalOpts$1 = Chart.defaults.global
401 const globalOpts$2 = Chart.defaults.global

And eventually Error

Chart.defaults.set(‘ohlc’ ... 

on line 446

So I changed them to:

446 Chart.defaults.ohlc.datasets.barPercentage = 1.0,
447 Chart.defaults.ohlc.datasets.categoryPercentage = 1.0

Then I got

UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'data' of undefined
at CandlestickController.draw (C:\inetpub\github\telegram-stream-trades\chartjs-chart-financial.js:213:32)

So I chagned:

213 const rects = me.getMeta();

That handled all the errors. But still no candles drawn.

So probably the way I initially started is incorrect

[benmccann]

This project requires Chart.js 3.0. I wonder if you're using Chart.js 2.x?

[vzhilov]

Chart.js 3.0 is just only a beta issued just 3 days ago. You mean the upgrade will fix it?

[benmccann]

https://github.com/chartjs/chartjs-chart-financial/blob/f10c04641fe20860cf5070fcd3788f134ea22a4f/package.json#L18

[vzhilov]

I see, thank you very much.

v3.0.0-beta.4 Breaking Changes

7886 Shorten alignment settings for axes

7871 Polar Area elements.arc.angle option now returns degrees

#7843 Provide method to lookup a chart from a canvas

7833 Enable per-dataset circumference and rotation for pie/doughnut charts

After upgrading to chart.js@3.0.0-beta.5

git clone https://github.com/chartjs/chartjs-chart-financial
cd chartjs-chart-financial
npm install
gulp build

take built file from /dist, copy to my project and then:

const chartJsFactory = () => {
        require('./dist/chartjs-chart-financial.js');
        delete require.cache[require.resolve('chart.js')];
        delete require.cache[require.resolve('./dist/chartjs-chart-financial.js')];
        return Chart;
    }

const canvasRenderService = new CanvasRenderService(width, height, undefined, undefined, chartJsFactory);

(node:6428) UnhandledPromiseRejectionWarning: ReferenceError: window is not defined at afterBuildTicks (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\dist\chartjs-chart-financial.js:154:22) at callback (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:305:15) at CategoryScale.afterBuildTicks (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:5112:5) at CategoryScale.update (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:5035:8) at fitBoxes (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:1538:9) at Object.update (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:1654:9) at Chart._updateLayout (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:6733:13) at Chart.update (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:6715:8) at new Chart (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chart.js\dist\chart.js:6477:10) at CanvasRenderService.renderChart (C:\inetpub\wwwroot\streamtrades.ru\telegram-stream-trades\node_modules\chartjs-node-canvas\dist\index.js:151:16)

[reynard80]

Same problem here: (node:6428) UnhandledPromiseRejectionWarning: ReferenceError: window is not defined

I guess no solution is available?