PrimeFaces pieChart定制

时间:2016-09-30 10:43:40

标签: primefaces pie-chart jqplot

我正在尝试将工具提示添加到饼图的图例并从中删除描述。这是对此的基本演示(我添加了对图片的解释): enter image description here 根据这张图片,我想完成两件事:

1 - 首先,我想从图例部分删除描述。据我所知,当我像这样设置数据源时,它都设置了图表和图例标签的工具提示:

pie.set(String category, Number data)

但是,由于我从数据库获取描述,它可能会很长,这会导致图例重叠图表,如下所示: enter image description here

因此,我只想在图表和图例部分(标签上)显示数据作为工具提示,并从图例中删除说明 。这是我试过的javascript代码:

function chartExtender() {

    this.cfg.legend = {
        show: true,
        highlighter: {
            show: true,
            useAxesFormatters: false
        },
        tooltipLocation: 'nw',
        placement: 'inside',
        rendererOptions: {//I tried that one and above highlighter respectively.
            highlighter: {
                tooltipFadeSpeed: 'slow',
                tooltipLocation: 'n',
                show: true
            }
        }
    };
    this.cfg.highlighter = {
        show: true,
        useAxesFormatters: false, // must be false for piechart   
        tooltipLocation: 'n',
        formatString: '%s = %d'
    };
}

2-其次,有没有办法完全自定义图例和图表部分的数据源?我不希望他们这样受限制。

以下是我看过的链接:

http://stackoverflow.com/questions/23846494/customize-primefaces-chart?rq=1  
http://stackoverflow.com/questions/30644676/how-to-use-line-chart-extender-attribute-in-primefaces-5-2
http://www.jqplot.com/deploy/dist/examples/pieTest.html
http://stackoverflow.com/questions/4889464/jqplot-tooltip-on-bar-chart
http://stackoverflow.com/questions/12050008/primefaces-3-4-charts-datatipformat
http://forum.primefaces.org/viewtopic.php?f=3&t=18445
http://forum.primefaces.org/viewtopic.php?f=3&t=32166
http://stackoverflow.com/questions/15474242/jqplot-pie-chart-tooltips 
http://stackoverflow.com/questions/30224074/primefaces-piechart-tooltips-are-not-displaying-in-my-local-environment  

0 个答案:

没有答案