实现Jaspersoft Studio社区（v6.2.2）自定义可视化组件显示Highcharts图表 [英] Implementing Jaspersoft Studio Community (v6.2.2) Custom Visualisation Component showing Highcharts chart

问题描述

我想在Jaspersoft Community 6.2.2的Custom Visualization Component中使用Highcharts。基本设置（用于执行实际可视化的基本配置和Javascript文件的JSON文件）对我来说很清楚。示例在我的设置中工作。但是，我不明白在Javascript文件中写什么才能使Highcharts工作。基本上，我正在寻找Javascript代码，如：

I want to use Highcharts within a Custom Visualisation Component for Jaspersoft Community 6.2.2. The basic setup (JSON file for basic configuration and Javascript file for executing the actual visualisation) is clear to me. Examples work in my setup. However, I don't understand what to write in the Javascript file to make Highcharts work. Basically, I am looking for Javascript code like:

define('example', ['https://code.jquery.com/jquery-3.0.0.js','http://code.highcharts.com/highcharts.js'], 
function ($, Highcharts)     
{

    return function (instanceData) {    

        $('#container').highcharts({
          chart: {type: 'bar'},
          title: {text: 'Fruit Consumption'},
          xAxis: {categories: ['Apples', 'Bananas', 'Oranges']},
          yAxis: {title: {text: 'Fruit eaten'}},
          series: [{name: 'Jane',data: [1, 0, 4]}, {name: 'John',data: [5, 7, 3]}]
        });

    };

});

任何想法如何显示Jaspersoft中的Highcharts图表？帮助赞赏。

Any idea how this should look in order to show the Highcharts chart in Jaspersoft? Help appreciated.

推荐答案

我假设您已经在您的机器中设置了requirejs和phantomjs。如果没有，那么你可以参考这个或这。您可以从这里，您还可以在其中找到其他几个图表示例以及使用d3图表创建圆圈的描述。或者您可以直接从此处下载高级图表。

I am assuming you have already setup requirejs and phantomjs in your machine. If not then you can refer this or this.You can download CVC high charts example from here where you can also find few other charts example as well as description of circle creation using d3 charts. or you can direct download highchart exmple from here.

在使用之前阅读highchart的许可证文件。

Read license document of highchart before utilizing it.

这篇关于实现Jaspersoft Studio社区（v6.2.2）自定义可视化组件显示Highcharts图表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！