Search code examples
node.jsjsdomanychart

Anystock not working with Anychart-NodeJS

I'm setting up a node.js server that renders static jpg/png images using Anychart.

It is possible for me to return the simple example pie charts in the examples but when I try to return the examples for AnyStock, I get some weird results.

The code should create and return a stock chart on the url: xx.xxx.xxx.xx:3000/insert. Instead the code returns this chart without any graphs or candlesticks: The result from node.js

When I set the same graph up on a plain html site, I get following result: The result on web page

The node.js code:

var fs = require('fs');
var express = require('express');
var app = express();
var path = require('path');
var router = express.Router();


app.get('/', function(req, res) {

    var query = require('url').parse(req.url, true).query;

    var stock_id = query.stock_id;
    var type = query.type;

    if (type == "insert") {

        var JSDOM = require('jsdom').JSDOM;
        var jsdom = new JSDOM('<head><script src="https://cdn.anychart.com/releases/8.9.0/js/anychart-core.min.js" type="text/javascript"></script><script src="https://cdn.anychart.com/releases/8.9.0/js/anychart-stock.min.js" type="text/javascript"></script></head><body><div id="container" style="width: 500px; height: 400px;"></div></body>', {
            runScripts: 'dangerously'
        });

        var window = jsdom.window;
        var anychart = require('anychart')(window);
        var anychartExport = require('anychart-nodejs')(anychart);


        var table, mapping, chart;

        table = anychart.data.table();
        table.addData([
            ['2015-12-24', 511.53, 514.98, 505.79, 506.40],
            ['2015-12-25', 512.53, 514.88, 505.69, 507.34],
            ['2015-12-26', 511.83, 514.98, 505.59, 506.23],
            ['2015-12-27', 511.22, 515.30, 505.49, 506.47],
            ['2015-12-28', 510.35, 515.72, 505.23, 505.80],
            ['2015-12-29', 510.53, 515.86, 505.38, 508.25],
            ['2015-12-30', 511.43, 515.98, 505.66, 507.45],
            ['2015-12-31', 511.50, 515.33, 505.99, 507.98],
            ['2016-01-01', 511.32, 514.29, 505.99, 506.37],
            ['2016-01-02', 511.70, 514.87, 506.18, 506.75],
            ['2016-01-03', 512.30, 514.78, 505.87, 508.67],
            ['2016-01-04', 512.50, 514.77, 505.83, 508.35],
            ['2016-01-05', 511.53, 516.18, 505.91, 509.42],
            ['2016-01-06', 511.13, 516.01, 506.00, 509.26],
            ['2016-01-07', 510.93, 516.07, 506.00, 510.99],
            ['2016-01-08', 510.88, 515.93, 505.22, 509.95],
            ['2016-01-09', 509.12, 515.97, 505.15, 510.12],
            ['2016-01-10', 508.53, 516.13, 505.66, 510.42],
            ['2016-01-11', 508.90, 516.24, 505.73, 510.40]
        ]);

        mapping = table.mapAs();
        mapping.addField('open', 1, 'first');
        mapping.addField('high', 2, 'max');
        mapping.addField('low', 3, 'min');
        mapping.addField('close', 4, 'last');
        mapping.addField('value', 4, 'last');

        chart = anychart.stock();
        chart.plot(0).ohlc(mapping).name('ACME Corp.');
        chart.title('AnyStock Basic Sample');
        chart.container('container');
        chart.draw();

        anychartExport.exportTo(chart, 'jpg').then(function(image) {
            fs.writeFile('anychart.jpg', image, function(fsWriteError) {
                if (fsWriteError) {
                    console.log(fsWriteError);
                } else {
                    res.sendFile(path.join(__dirname + '/anychart.jpg'));

                }
            });
        }, function(generationError) {
            console.log(generationError);

        });
    } else if (type == "image") {
        res.sendFile(path.join(__dirname + '/anychart.jpg'));
    }
});

app.listen(3000);

I suspect there's something wrong with the way I includes the JS-files in the jsdom. If I exclude the two files in the jsdom, I get the same result..

Please let me know if you have any suggestions.

Solution

  • So after a few days of waiting time, the AnyChart Support returned to me with the following answer for my question above:

    we can't guarantee that this module will work as expected. It depends on many other libraries that can't provide stable versions in different OS.

    Instead they recommend to use their Export Server solution which is different from what I was looking for.

    Our setup is built on a LAMP-server, so we don't want to run another server just for a few images a day.

    If any of you have a suggestion for a solution where I can export my AnyStock charts to JPG, PNG or GIFs please let me know.

    Thanks :-)