Giter Club home page Giter Club logo

Comments (8)

cvasseng avatar cvasseng commented on July 24, 2024 1

Hi,

To use dark-unica, you can add http://code.highcharts.com/themes/dark-unica.js to resources.files:

    {
        "files": "http://code.highcharts.com/themes/dark-unica.js"
    }

This works both when using the CLI and when doing HTTP requests.

If through the HTTP server, your payload should look something like this:

    {
        "instr": "<chart data here>",
        "resources": {
            "files": "http://code.highcharts.com/themes/dark-unica.js"
        }
    }

If using the CLI:

    highcharts-export-server --resources '{"files": "http://code.highcharts.com/themes/dark-unica.js"}' --instr "<chart data>"

Regarding the exiting - are you using highcharts-export-server directly, or are you using it as a module? In the first case it should exit by itself when done, so if it doesn't, please send me a sample input, and I'll look into it.

from node-export-server.

TorsteinHonsi avatar TorsteinHonsi commented on July 24, 2024

@cvasseng Please note that the theme files also load custom font files, so unless these are installed on the server instance, they also need to be considered. https://github.com/highcharts/highcharts/blob/v5.0.6/js/themes/dark-unica.js#L14-L18.

from node-export-server.

cvasseng avatar cvasseng commented on July 24, 2024

@TorsteinHonsi since the font is included in a <link> tag that should work out of the box (famous last words). There seems to be an issue with the theme loading itself though, so I'm looking into that now.

from node-export-server.

TorsteinHonsi avatar TorsteinHonsi commented on July 24, 2024

that should work out of the box

Yes if it is loaded in sync it should work.

from node-export-server.

cvasseng avatar cvasseng commented on July 24, 2024

So turns out google fonts are "special" - the way they are loaded causes Phantom not to wait for them before executing the onLoadFinished callback. The issue is in the font css, where there's another indirect include - this is the part it doesn't wait for. Working on a solution.

from node-export-server.

webroru avatar webroru commented on July 24, 2024

What I'm doing wrong? I tried any combination but theme is not applied.
Here example with added parameter the resources:

//Include the exporter module
const exporter = require('highcharts-export-server');

//Export settings
var exportSettings = {
  type: 'pdf',
  instr: {
    title: {
      text: 'My Chart'
    },
    xAxis: {
      categories: ["Jan", "Feb", "Mar", "Apr", "Mar", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
    },
    series: [
      {
        type: 'line',
        data: [1, 3, 2, 4]
      },
      {
        type: 'line',
        data: [5, 3, 4, 2]
      }
    ]
  },
  resources: {
    files: 'http://code.highcharts.com/themes/dark-unica.js',
  },
  outfile: 'test.pdf',
};

//Set up a pool of PhantomJS workers
exporter.initPool();
/*
 Export settings corresponds to the available CLI arguments described
 above.
 */
exporter.export(exportSettings, function (err, res) {
  exporter.killPool();
});

Also I try:

resources: {
   files: './node_modules/highcharts/themes/dark-unica.js',
},

And save to file 'resources.json' with:

{
  "files": "http://code.highcharts.com/themes/dark-unica.js"
}

BUT! When I set parameter the themeOptions like JSON.stringify({ // some theme options }); I get exactly what I want.
What I'm doing wrong? I tied any combination but theme is not applied.
Here example with added parameter the resources:

//Include the exporter module
const exporter = require('highcharts-export-server');

//Export settings
var exportSettings = {
  type: 'pdf',
  instr: {
    title: {
      text: 'My Chart'
    },
    xAxis: {
      categories: ["Jan", "Feb", "Mar", "Apr", "Mar", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
    },
    series: [
      {
        type: 'line',
        data: [1, 3, 2, 4]
      },
      {
        type: 'line',
        data: [5, 3, 4, 2]
      }
    ]
  },
  resources: {
    files: 'http://code.highcharts.com/themes/dark-unica.js',
  },
  outfile: 'test.pdf',
};

//Set up a pool of PhantomJS workers
exporter.initPool();
/*
 Export settings corresponds to the available CLI arguments described
 above.
 */
exporter.export(exportSettings, function (err, res) {
  exporter.killPool();
});

Also I try:

resources: {
   files: './node_modules/highcharts/themes/dark-unica.js',
},

And save to file 'resources.json' with:

{
  "files": "http://code.highcharts.com/themes/dark-unica.js"
}

BUT! When I set parameter the themeOptions like JSON.stringify({ // some theme options }); I get exactly what I want.
What I'm doing wrong? I tied any combination but theme is not applied.
Here example with added parameter the resources:

//Include the exporter module
const exporter = require('highcharts-export-server');

//Export settings
var exportSettings = {
  type: 'pdf',
  instr: {
    title: {
      text: 'My Chart'
    },
    xAxis: {
      categories: ["Jan", "Feb", "Mar", "Apr", "Mar", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
    },
    series: [
      {
        type: 'line',
        data: [1, 3, 2, 4]
      },
      {
        type: 'line',
        data: [5, 3, 4, 2]
      }
    ]
  },
  resources: {
    files: 'http://code.highcharts.com/themes/dark-unica.js',
  },
  outfile: 'test.pdf',
};

//Set up a pool of PhantomJS workers
exporter.initPool();
/*
 Export settings corresponds to the available CLI arguments described
 above.
 */
exporter.export(exportSettings, function (err, res) {
  exporter.killPool();
});

Also I try:

resources: {
   files: './node_modules/highcharts/themes/dark-unica.js',
},

And save to file 'resources.json' with:

{
  "files": "http://code.highcharts.com/themes/dark-unica.js"
}

BUT! When I set parameter the themeOptions like JSON.stringify({ // some theme options }); I get exactly what I want.

from node-export-server.

paulrobello avatar paulrobello commented on July 24, 2024

I am having the issue related the the google font not loading in time for the graph to use it.
If i hit the same phantom worker a 2nd time the font loads (probably cached from previous request)

from node-export-server.

cvasseng avatar cvasseng commented on July 24, 2024

Finally got to the bottom of this.

a5ad761 fixes font issues with the Dark Unica and Sand Signika themes. Including them in resources should now work as expected.

The issue with google fonts is that Phantom/WebKit won't actually load the fonts unless there's a reference to it in the DOM. This is problematic both in the sense that the required font won't be loaded, but even more so because the reference to the included font is in place regardless, causing it to think that the font is loaded too. The result is that all text is gone.

Working on finding a more robust/clean/general solution, the progress of which can be tracked in #13.

from node-export-server.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.