anychart / anychart-nodejs Goto Github PK

ARCHIVED. AnyChart NodeJS module provides an easy way to generate SVG, JPG and PNG images of the charts on the server side.

Home Page: https://www.anychart.com

License: Apache License 2.0

JavaScript 100.00%

anychart-nodejs's Introduction

AnyChart Data Visualization Framework

AnyChart is a flexible JavaScript (HTML5, SVG, VML) charting framework that fits any solution in need of data visualization.

Download and install
Getting started
Plugins
Using AnyChart with TypeScript
Using AnyChart with ECMAScript 6
Technical Integrations
Contribution guide
Build and debug
Module system
Package directory
Contacts
Links
License

Download and install

There are several ways to download/install AnyChart.

Direct download

All binaries are located in dist folder.

CDN

If you don't want to download and host AnyChart yourself, you can include it from the AnyChart CDN (Content Delivery Network): https://www.anychart.com/download/cdn

<head>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-base.min.js"></script>
</head>

Package managers

You can install AnyChart using npm, bower or yarn:

npm install anychart
bower install anychart
yarn add anychart

Getting started

The fastest way to start with AnyChart is to include framework into a webpage and write some code. Look at this simple HTML snippet below:

<!doctype html>
<body>
<div id="container" style="width: 500px; height: 400px;"></div>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-base.min.js" type="text/javascript"></script>
<script>
    anychart.onDocumentReady(function() {
        // create a pie chart
        var chart = anychart.pie([
            ["Chocolate", 5],
            ["Rhubarb compote", 2],
            ["Crêpe Suzette", 2],
            ["American blueberry", 2],
            ["Buttermilk", 1]
        ]);
        chart.title("Top 5 pancake fillings");
        // set the container where chart will be drawn
        chart.container("container");
        //  draw the chart on the page
        chart.draw();
    });
</script>
</body>
</html>

Step by step quick start guides

Plugins

AnyChart provides wide variety of plugins for different kind of technologies, which includes:

Using AnyChart with TypeScript

You can use AnyChart in your TypeScript projects - we have definition file for our library which you can find in distribution folder. Please, take a look at webpack and typescript integration example for more details.

Using AnyChart with ECMAScript 6

You can use AnyChart in your ECMAScript 6 projects over two ways:

Plain ECMAScript 6

To add AnyChart on a page use <script> section with type="module" attribute.

<script type="module">
    import '_localpath_to_anychart/anychart-bundle.min.js'
    
    // regular AnyChart code here
</script>

For more details, take a look at AnyChart ES6 example.

Bundling tools and Module Loaders

You can use AnyChart with any bundling tool or module loader such as WebPack, Browserify, Require.js and others. For more details, take a look at AnyChart Webpack example.

Technical Integrations

AnyChart can run on any platform and with any database. These samples were created to demonstrate how AnyChart can be easily integrated into your environment. All examples are distributed under an Apache 2.0 License and can be customized to your application. If you are interested in a particular integration not listed here, please contact us.

ASP.NET, C# and MySQL	ASP.NET, VB.NET and MySQL	ASP.NET, C#, SignalR and MySQL
Go, Revel and MySQL	Go and MySQL	Java Servlets, Maven, JDBC, JSP and MySQL
NodeJS and MongoDB using socket.io	Java Spring, Maven, Hibernate and MySQL	Julia and MySQL
NodeJS Express, Jade and MongoDB	PHP, Symfony and MySQL	PHP, Laravel and MySQL
PHP, Slim and MySQL	Perl, Catalyst Web Framework and MySQL	Python, Flask and MySQL
Python, Django and MySQL	R, Shiny and MySQL	Ruby, Sinatra and MySQL
Ruby on Rails and MySQL	Scala, Akka and MySQL	Scala, Play and MySQL

Contribution guide

To contribute to AnyChart project please:

Fork AnyChart repository.
Create a branch from the develop branch.
Make any changes you want to contribute.
Create a pull request against the develop branch.

GitHub documentation: Forking repositories.
GitHub documentation: Collaborating using pull requests.

Please, note:

AnyChart bears no responsibility for the code written by third-party developers until pull request is accepted.
After pull request is accepted the author of pull request sign over all rights to the code to AnyChart.

Build and debug

Dependencies

AnyChart uses several third-party libraries and tools to work with JavaScript and CSS.

GraphicsJS - High-performance SVG/VML drawing library.
Google Closure Library - powerful, low-level JavaScript library.
Google Closure Compiler - compiles JavaScript code to better JavaScript.
lesscpy - Python LESS Compiler. Used to compile and minify AnyChart UI css.

Building options

build.py python script is used to work with AnyChart project. You need to install python to use it.

To see all available options of the build script use -h or --help command:

./build.py -h.

To see command options use:

./build.py <command_name> -h

To install all dependencies use the deps command:

./build.py deps.

After running this command you can compile the project using the compile command:

./build.py compile

This compiles production version of anychart-bundle and all modules and puts them into the out folder. You can read more about modules in our Modules article.

To create a dev build for the debug purposes use -d or --develop option:

./build.py compile -d

The -df option generates property renaming report, variable renaming report, and source map location mapping files:

./build.py compile -df

Source map maps minified code to source code. Read more about using source maps in Chrome or source maps in Firefox.

Module system

AnyChart since v8.0.0 is structured as a modules, so you can use only what you need. Please look at our article Modules to start working with modules.

Package directory

├── css
│   ├── anychart.less
│   ...
├── dist
│   ├── json-schema.json
│   ├── xml-schema.xsd
│       ...
├── src
│   ├── charts
│   ├── core
│   ├── modules
│   ├── themes
│       ...
│   README.md
│   LICENSE
│   ...

css

The css folder contains .less CSS files that are compiled into one .css file.

src

The src folder contains AnyChart source code files organized according to the project structure. For example:

charts subfolder contains chart classes
core subfolder contains core classes
modules subfolder contains modules
themes contains themes

dist

The dist folder contains binaries and JSON/XML Schemas.

Contacts

Web: www.anychart.com
Email: [email protected]
Twitter: anychart
Facebook: AnyCharts
LinkedIn: anychart

License

anychart-nodejs's People

Contributors

Stargazers

Watchers

Forkers

strogo spica07 lvxiaojia stoodkev gluneau mathew-kurian radicaldrew cyberstormdotmu

anychart-nodejs's Issues

Missing part of information in the chart

HI, i got a problem. When i export to png, jpg format.,it just show up x-Axis line and chart line.But it is fine with PDF and SVG.

Can't create a chart column

Why can't I create a chart column
My source:
// require file system and jsdom
var fs = require('fs');

// For jsdom version 10 or higher.
// Require JSDOM Class.
var JSDOM = require('jsdom').JSDOM;
// Create instance of JSDOM.
var jsdom = new JSDOM('

', {runScripts: 'dangerously'});
// Get window
var window = jsdom.window;

// require anychart and anychart export modules
var anychart = require('anychart')(window);
var anychartExport = require('anychart-nodejs')(anychart);

async function renderChart(chart, img_name){
var chart_img = await anychartExport.exportToSync(chart, 'png');
fs.writeFile(img_name, chart_img, function(fsWriteError) {
if (fsWriteError) {
console.log(fsWriteError);
} else {
console.log('Complete');
}
});
}

renderChart(c0, 'column0.png');
renderChart(c1, 'column1.png');
C1: PIE - Created
C0: Column - Not Create

Integrating with Node js Application on windows

I have installed rsvg and imagemgick but still when I run the application it says
Warning! Please install imagemagick utility. (https://www.imagemagick.org/script/binary-releases.php)
Warning! Please install rsvglib utility. (https://github.com/AnyChart/AnyChart-NodeJS)
Error: Stream yields empty buffer

Is there anything else that needs to be done ?

Blank chart when creating a timeline

When` using the latest version of anychart, im running into a issue with creating a timeline image:

const fs = require('fs')
const path = require('path')

// Require JSDOM Class.
const JSDOM = require('jsdom').JSDOM
// Create instance of JSDOM.
const jsdom = new JSDOM('<body><div id="container"></div></body>', {runScripts: 'dangerously'})
// Get window
const window = jsdom.window

// require anychart and anychart export modules
const anychart = require('anychart')(window)
const anychartExport = require('anychart-nodejs')(anychart)

var chart = anychart.column();

// create data

var rangeData1 = [
    ["Task 1", Date.UTC(2004,0,4), Date.UTC(2004,7,1)],
    ["Task 2", Date.UTC(2004,7,1), Date.UTC(2005,8,10)]
  ];
  
  var rangeData2 = [
    ["New Task 1", Date.UTC(2005,10,1), Date.UTC(2006,5,1)],
    ["New Task 2", Date.UTC(2006,5,15), Date.UTC(2006,11,1)]
  ];
  
  var momentData1 = [
    [Date.UTC(2004,2,21), "Meeting 1"],
    [Date.UTC(2005,3,19), "Meeting 2"],
    [Date.UTC(2006,1,1),  "Meeting 3"]
  ];
  
  var momentData2 = [
    [Date.UTC(2004,5,12), "Training 1"],
    [Date.UTC(2005,5,1),  "Training 2"],
    [Date.UTC(2006,1,26), "Training 3"]
  ];
  
  // create a chart
  var chart = anychart.timeline();
  
  // create the first range series
  var rangeSeries1 = chart.range(rangeData1);
  
  // create the second range series
  var rangeSeries2 = chart.range(rangeData2);
  
  // create the first moment series
  var momentSeries1 = chart.moment(momentData1);
  
  // create the second moment series
  var momentSeries2 = chart.moment(momentData2);
  
  // set the container id
  chart.container("container");
  
  // initiate drawing the chart  
  chart.draw();


  
anychartExport.exportTo(chart, 'jpeg').then(function(image) {
    fs.writeFile(path.join(__dirname, 'example.jpg'), image, function(fsWriteError) {
      if (fsWriteError) {
        console.log(fsWriteError);
      } else {
        console.log('Complete');
      }
    });
    
  }, function(generationError) {
    console.log(generationError);
  });

rsvglib utility

How do I install rsvglib utility in windows?

Black border around graph as shown in attached image

How to remove the following black border around image?

ReferenceError: window is not defined

use the latest version of anychart and anychart-nodejs and the example code in Quick Start

/private/tmp/node_modules/anychart/dist/anychart-bundle.min.js:242
function K(){return this.x}function N(){return this.name||this.getDataValue("id")}function S(){return aa(this.value,10)}function V(){return aa(this.value)}function aa(a,b){var c=null===a||"boolean"==typeof a||""==a?NaN:+a;return isNaN(c)?a:window.anychart.format.number(c,b,void 0,void 0,void 0,void 0,void 0,void 0)}window.anychart=window.anychart||{};window.anychart.themes=window.anychart.themes||{};window.anychart.themes.defaultTheme={palette:{type:"distinct",items:"#64b5f6 #1976d2 #ef6c00 #ffd54f #455a64 #96a6a6 #dd2c00 #00838f #00bfa5 #ffa000".split(" ")},
                                                                                                                                                                                                                                                                                                                             ^

ReferenceError: window is not defined
    at /private/tmp/node_modules/anychart/dist/anychart-bundle.min.js:242:318
    at /private/tmp/node_modules/anychart/dist/anychart-bundle.min.js:358:430
    at Object.<anonymous> (/private/tmp/node_modules/anychart/dist/anychart-bundle.min.js:4123:529)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)

anychart cpu 100%

all timer ref in anychart-bundle.min.js should prefix by window. to ensure jsdom will remove all listener after window.close()

stage.image not showing?

I am using the "string" method to create a stage with multiple charts and an image:

var stage = anychart.graphics.create("container");var c0=anychart.fromJson({"chart":{"title":"Vodafone visits over time","type":"column","series":[{"data":[1,3,6,12,24,4,16,16,17,22,3,2,34,61,63,49,27,4,42,26,26,9,12,2,12,14,42,29,43,3,41,53,75,310,1176,244,144,638,387,270,223,152,105,91,167,175,393,694,704,233,232,527,395,325,414,416,179,186,418,941,351,302,295,142,162,290,221,236,278,839,153,122,193],"fill":"#0da6e0","stroke":"#0da6e0"}]}});c0.bounds('5%','5%','90%','25%').container(stage);c0.draw();var c1=anychart.fromJson({"chart":{"type":"pie","innerRadius":"0%","data":[{"x":"Apples","value":"18.14","fill":"#0da6e0"},{"x":"Oranges","value":"8.14","fill":"#61c6e5"}]}});c1.bounds('5%','35%','25%','25%').container(stage);c1.draw();var c2=anychart.fromJson({"chart":{"type":"pie","innerRadius":"0%","data":[{"x":"Apples","value":"28.14","fill":"#92d9ed"},{"x":"Oranges","value":"128.14","fill":"#1c6b8d"}]}});c2.bounds('35%','35%','25%','25%').container(stage);c2.draw();stage.image("https://vignette.wikia.nocookie.net/newtendo/images/0/08/Mariossbi.png", 10, 10, 200, 200);

Any reason why everything but the image appears? No matter what I try, I cannot get the image to show.

TypeError when running the example

After installation and copying the example code (from the Quick start example), I get the following error when running:

TypeError: Cannot read properties of undefined (reading 'insertBefore') thrown inside /node_modules/anychart/dist/js/anychart-bundle.min.js:84:440

Node: 16.15.1
anychart-nodejs: 1.3.8
OS: MacOS Big Sur 11.6.8

always running?

I use the example code from Quick Start, but program is always running without exit

why?

AnyChart and Angular 6

How do I use Anychart with Angular 6?

Couldnt get Graph legend shown on JPG using AnyChart-nodeJS

I am trying to insert the graph legend on the a combined graph (lines and bars). It seems i cant get the legend shown in any of the graph position. My code is as follow:

var jsdom = new JSDOM('

', {runScripts: 'dangerously'});

var window = jsdom.window;

var anychart = require('anychart')(window);
var anychartExport = require('anychart-nodejs')(anychart);
var dataSet = anychart.data.set([
    ['P1', 174, 5854, 3242],
    ['P2', 197, 4171, 3171],
    ['P3', 155, 1375, 700],
    ['P4', 15, 1875, 1287],
    ['P5', 66, 2246, 1856],
    ['P6', 85, 2696, 1126],
    ['P7', 37, 1287, 987],
    ['P8', 10, 2140, 1610],
    ['P9', 44, 1603, 903],
    ['P10', 322, 1628, 928]
  ]);

  var firstSeriesData = dataSet.mapAs({ x: 0, value: 1 });
  var secondSeriesData = dataSet.mapAs({ x: 0, value: 2 });
  var thirdSeriesData = dataSet.mapAs({ x: 0, value: 3 });


  var chart = anychart.column();
  chart.legend(true)

  chart.title('Combination of Column, Spline-Area and Spline Chart');

  var scale = anychart.scales.linear();

  chart
    .yAxis(1)
    .title('Secondary Y-Axis')
    .orientation('right')
    .scale(scale);

  var columnSeries = chart.column(secondSeriesData);
  columnSeries.name('Column');

  var splineSeries = chart.splineArea(thirdSeriesData);
  splineSeries.name('Spline');

  var lineSeries = chart.spline(firstSeriesData);
  lineSeries.name('Line').yScale(scale).stroke('2.5 #ef6c00');


  chart.container('container');
  chart.bounds(0, 0, 1024, 800);

  chart.draw();
  anychartExport.exportTo(chart, 'jpg').then(function(image) {
    fs.writeFile( localDir+"/test.jpg", image, function(fsWriteError) {
      if (fsWriteError) {
        console.log(fsWriteError);
      } else {
        console.log('Complete');
      }
    });
  }, function(generationError) {
    console.log(generationError);
  });

How do I integrate themes ?

SecurityError: localStorage is not available for opaque origins

This error is generated upon executing the provided example code "Generating PDF image of a chart that requires external resources".

Cannot get AnyChart to work on Elastic Beanstalk / AWS

Tried a bunch of things but can't seem to get AnyChart to generate a file on AWS. I am using the "Quick Start" code.

I am able to get this working locally without issue.

In the logs, I have an error of:

Warning! Please install rsvglib utility. (https://github.com/AnyChart/AnyChart-NodeJS)
Error: Stream yields empty buffer
at Socket. (/var/app/current/node_modules/gm/lib/command.js:57:17)
at emitNone (events.js:91:20)
at Socket.emit (events.js:185:7)
at endReadableNT (_stream_readable.js:978:12)
at _combinedTickCallback (internal/process/next_tick.js:80:11)
at process._tickCallback (internal/process/next_tick.js:104:9)

Which seem to point to an ImageMagick installation issue, however I am trying a packages.config file with:

packages:
yum:
ImageMagick: []
librsvg2-dev: []
librsvg2-bin: []

seems like I can get ImageMagick to install if I remove the librsvg2 packages, but the other two packages are not found.
(Return code: 1 Output: Yum does not have librsvg2-dev available for installation)

In addition, just to see, i was able to install the "GraphicsMagick" module and was able to successfully write an image in AWS.

Any thoughts or any success on getting AnyChart to work on Elastic Beanstalk?

Thanks!

Chart producing server and memory leaks

I created a simple chart producing server (see svr.js below) witch accepts js code and feeds it to anychart and that returns SVG to requestor, run it on windows and after formatting <1000 charts (using format100charts.py, chart generation js is from anycharts examples) it has failed because of not being able to allocate memory. After that I monitored memory usage and run it with memory profiling. After producing 100 charts memory consumption raised by ~1Gb and went on until nodejs failed to allocate more.

Am I doing something wrong or is there a memory leak?

If you want I can attach memory profiling results but probably you can get better ones ( without obfuscation :) ) in ~30mins with two scripts below.

svr.js:

var chartFormattingServer = (function(){

	const http = require('http')
	const port = 3000

	var processChartCallback = function(response, body) {
		
		var anychartExport = require('anychart-nodejs');
		anychartExport.exportTo(body, 'svg').then(function(image) {
			response.end(image);
		}, function(generationError) {
			anychartExport=null;
		  console.log(generationError);
		});
		anychartExport=null;
	}

	const requestHandler = (request, response) => {
	   if (request.method == 'POST') {
			var body = '';

			request.on('data', function (data) {
				body += data;

				// Too much POST data, kill the connection!
				// 1e6 === 1 * Math.pow(10, 6) === 1 * 1000000 ~~~ 1MB
				if (body.length > 1e6)
					request.connection.destroy();
			});

			request.on('end', function () {
				processChartCallback(response, body)
			});
		}

	}

	const server = http.createServer(requestHandler)

	server.listen(port, (err) => {
	  if (err) {
		return console.log('something bad has happened', err)
	  }

	  console.log('server is listening on ${port}')
	})
})();

format100charts.py:

import requests
from time import time
from multiprocessing import Pool

ADDRESS = "localhost"
PORT = 3000

chart = """// create data set on our data
    var dataSet = anychart.data.set([
        ['Nail polish', 12814, 3054, 4376, 4229],
        ['Eyebrow pencil', 13012, 5067, 3987, 3932],
        ['Rouge', 11624, 7004, 3574, 5221],
        ['Lipstick', 8814, 9054, 4376, 9256],
        ['Eyeshadows', 12998, 12043, 4572, 3308],
        ['Eyeliner', 12321, 15067, 3417, 5432],
        ['Foundation', 10342, 10119, 5231, 13701],
        ['Lip gloss', 22998, 12043, 4572, 4008],
        ['Mascara', 11261, 10419, 6134, 18712]
    ]);

    // map data for the first series, take x from the zero area and value from the first area of data set
    var seriesData_1 = dataSet.mapAs({'x': 0, 'value': 1});

    // map data for the second series, take x from the zero area and value from the second area of data set
    var seriesData_2 = dataSet.mapAs({'x': 0, 'value': 2});

    // map data for the second series, take x from the zero area and value from the third area of data set
    var seriesData_3 = dataSet.mapAs({'x': 0, 'value': 3});

    // map data for the fourth series, take x from the zero area and value from the fourth area of data set
    var seriesData_4 = dataSet.mapAs({'x': 0, 'value': 4});

    // create area chart
    var chart = anychart.area3d();

    // force chart to stack values by Y scale.
    chart.yScale().stackMode('percent');

    // turn on the crosshair
    var crosshair = chart.crosshair();
    crosshair.enabled(true)
            .yStroke(null)
            .xStroke('#fff')
            .zIndex(99);
    crosshair.yLabel().enabled(false);
    crosshair.xLabel().enabled(false);

    // set chart title text settings
    chart.title('Regional ratio of cosmetic products sales');

    // set yAxis labels formatting, force it to add % to values
    chart.yAxis(0).labels().format('{%Value}%');

    // helper function to setup label settings for all series
    var setupSeries = function (series, name) {
        series.name(name)
                .stroke('3 #fff 1');
        series.markers().zIndex(100);
        series.hovered().stroke('3 #fff 1');
        series.hovered().markers()
                .enabled(true)
                .type('circle')
                .size(4)
                .stroke('1.5 #fff');
    };

    // temp variable to store series instance
    var series;

    // create first series with mapped data
    series = chart.area(seriesData_1);
    setupSeries(series, 'Florida');

    // create second series with mapped data
    series = chart.area(seriesData_2);
    setupSeries(series, 'Texas');

    // create third series with mapped data
    series = chart.area(seriesData_3);
    setupSeries(series, 'Arizona');

    // create fourth series with mapped data
    series = chart.area(seriesData_4);
    setupSeries(series, 'Nevada');

    // set interactivity and toolitp settings
    chart.interactivity().hoverMode('by-x');
    chart.tooltip().displayMode('union');

    // turn on legend
    chart.legend()
            .enabled(true)
            .fontSize(13)
            .padding([0, 0, 25, 0]);

    // set container id for the chart
    chart.container('container');

    // initiate chart drawing
    chart.draw();"""
startTime = time()
	
for i in range(99):
	iterStartTime = time()
	r = requests.post('http://' + ADDRESS + ':' + str(PORT), data = chart)
	iterEndTime = time()
	print (str(i) + " processed in " + str(iterEndTime-iterStartTime))
	
endTime = time()
	
print("Sequentially processed 100 charts in " + str(endTime-startTime))

Error on example

Output

/home/maxie/Projects/ac-learn/node_modules/anychart-nodejs/lib/anychart-node.js:755
    setAsRootDocument(anychart.global().document);
                               ^

TypeError: anychart.global is not a function
    at AnychartExportWrapper (/home/maxie/Projects/ac-learn/node_modules/anychart-nodejs/lib/anychart-node.js:755:32)
    at Object.<anonymous> (/home/maxie/Projects/ac-learn/src/chart.js:16:18)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
    at Module.load (internal/modules/cjs/loader.js:643:32)
    at Function.Module._load (internal/modules/cjs/loader.js:556:12)
    at Function.Module.runMain (internal/modules/cjs/loader.js:839:10)
    at internal/main/run_main_module.js:17:11

Code:

/* chart.js */
// require file system and jsdom
const fs = require('fs');
const anyc = require('anychart-nodejs');

// For jsdom version 10 or higher.
// Require JSDOM Class.
const JSDOM = require('jsdom').JSDOM;
// Create instance of JSDOM.
const jsdom = new JSDOM('', {runScripts: 'dangerously'});
// Get window
const window = jsdom.window;

// require anychart and anychart export modules
const anychart = anyc(window);
const anychartExport = anyc(anychart);

// create and a chart to the jsdom window.
// chart creating should be called only right after anychart-nodejs module requiring
const chart = anychart.pie([10, 20, 7, 18, 30]);
chart.bounds(0, 0, 800, 600);
chart.container('container');
chart.draw();

// generate JPG image and save it to a file
/* eslint-disable no-console */
anychartExport.exportTo(chart, 'jpg').then((image) => {
  fs.writeFile('anychart.jpg', image, (fsWriteError) => {
    console.log(fsWriteError || 'Complete');
  });
}, (generationError) => {
  console.log(generationError);
});
/* eslint-enable no-console */

How to reproduce:

npm i jsdom anychart-nodejs -D
node chart.js

Blank Chart

var fs = require('fs');
var JSDOM = require('jsdom').JSDOM;
var jsdom = new JSDOM('<body><div id="container"></div></body>', { runScripts: 'dangerously' });
var window = jsdom.window;

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

const chart = anychart.line([100, 300, 200, 300, 100])
chart.padding('10px')
chart.bounds(0, 0, 800, 600);
chart.container('container');
chart.draw();

anychartExport.exportTo(chart, "png").then((image) => {
    fs.writeFile('anychart.png', image, (fsWriteError) => {
        if (fsWriteError) {
            console.log(fsWriteError);
        } else {
            console.log('Complete');
        }
    });
}, (generationError) => {
    console.log(generationError);
});

This is my code. it renders the axes but no lines are plotted. Anything wrong with the code ?

Problem running the example on the website

I have installed anychart and imagemagick, following is the error (I am using manjaro).

/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:714
"font-size",b.fontSize):this.sh.removeAttribute("font-size");b.fontWeight?this.Nb(this.sh,"font-weight",b.fontWeight):this.sh.removeAttribute("font-weight");b.letterSpacing?this.Nb(this.sh,"letter-spacing",b.letterSpacing):this.sh.removeAttribute("letter-spacing");b.decoration?this.Nb(this.sh,"text-decoration",b.decoration):this.sh.removeAttribute("text-decoration");this.Mt.nodeValue=a;c=this.sh.getBBox();this.Mt.nodeValue="";b.fontVariant&&$.Ye&&(this.Mt.nodeValue=a.charAt(0).toUpperCase(),c.height=
^

TypeError: this.sh.getBBox is not a function
at oi.$.g.measure (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:714:400)
at Qg (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:119:486)
at $.vh.$.g.sj (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:697:371)
at jh (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:134:48)
at $.vh.$.g.ou (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:705:48)
at $.vh.$.g.io (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:695:33)
at $.vh.$.g.ob (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:620:125)
at Ur (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:376:39)
at Lr.$.g.kb (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:1008:123)
at gca (/home/ehsan/Code/node_modules/anychart/dist/js/anychart-bundle.min.js:426:188)

Cannot read property split of null

I don't think there is a way to go back to -11_1 so I think -12 is the only option

I upgraded imagemagick to the latest version and am getting this error

(node:29179) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'split' of null
at HTMLUnknownElement.getBBox (/mnt/c/Projects/cryptoBot/node_modules/anychart-nodejs/lib/anychart-node.js:155:29)

It seems in the getBBox function it's looking for a fontfamily and returning null. Any idea why this would be happening?

It is happening on char.draw()
It is happening with many different example charts I've found for anycharts including the one on this repo
It is still happening if I downgrade to 1.3.6

I have reformatted Ubuntu and it's happening on 16.04 and 18.04.

Here's my code just for sanity check. I'm just trying the example chart just to get it running

var jsdom = new JSDOM('<body><div id="container"></div></body>', {runScripts: 'dangerously'});
var window = jsdom.window;
const anychart = require('anychart')(window)
var chart = anychart.pie([
    ["Chocolate", 5],
    ["Rhubarb compote", 2],
    ["Crêpe Suzette", 2],
    ["American blueberry", 2],
    ["Buttermilk", 1]
]);
chart.title("Top 5 pancake fillings");
// set the container where chart will be drawn
chart.container("container");
//  draw the chart on the page
chart.draw();

EDIT:

I have started using the 1.3.0-dev-preview-4 build for anycharts-nodejs and this error is gone. Only I am getting

Error: Stream yields empty buffer
at Socket. (/mnt/c/Projects/cryptoBot/node_modules/gm/lib/command.js:57:17)
when saving my image. It works with svg and pdf, but I need either jpg, or png

Export synchronously

How to export image synchronously?

Error: Stream yields empty buffer

Anychart is able to create the chart. but it is unable to save it to jpg file.
Gives out this error
Error: Stream yields empty buffer
at Socket. (/usr/local/lib/node_modules/anychart-nodejs/node_modules/gm/lib/command.js:57:17)
at Socket.emit (events.js:205:15)
at endReadableNT (_stream_readable.js:1154:12)
at processTicksAndRejections (internal/process/task_queues.js:84:9)

Details:
Server Provider: Digital Ocean
Ubuntu: 16.0.4
node: 12.4.0
anychart: 8.3.0
anychart-nodejs: 1.3.8
ImageMagick : 7.0.8-11
librsvg2-dev: 2.40.13-3
librsvg2-bin: 2.40.13-3

pdf size parameters

I am trying to figure out how I can provide parameters for exportTo to pdf to set the page size (e.g. A4) and/or how to create multiple pages. Any suggestions?

AnyChart NodeJS module Prerequisite is incomplete

Expected behavior

This message should not appear while executing code that requires this library, if you followed the install instructions.

'Warning! Please install rsvglib utility. (https://github.com/AnyChart/AnyChart-NodeJS)'

Actual behavior

As the library test to see if the prerequisite are installed with this code:

childProcess = spawn('rsvg-convert');
childProcess.on('error', function(err) {
  if (err.code === 'ENOENT') {
    console.warn('Warning! Please install rsvglib utility. (https://github.com/AnyChart/AnyChart-NodeJS)');
  }
});

It is clear that rsvg-convert is needed but it could not be found even after installing the repos prerequisites found here.

How to reproduce

Got the error while running @aggroed project Agx:

git clone [email protected]:aggroed/Agx.git
cd Agx
npm install
npm start

Operating system: Ubuntu 17.10

Recording Of The Bug

The bug occurs even after running the install command: apt-get install imagemagick librsvg2-dev

The Proposed fix

While they list apt-get install imagemagick librsvg2-dev as a prerequisite, they need one more: librsvg2-bin

After installing the missing package, the Agx from @aggroed ran as expect.

Posted on Utopian.io - Rewarding Open Source Contributors