在primefaces中自定义折线图

时间:2014-05-23 07:26:01

标签: java jsf primefaces linechart

我在项目的主要面孔中使用了折线图。

我想自定义折线图。

如何更改背景颜色并删除lineChart的网格?

1 个答案:

答案 0 :(得分:3)

您可以使用以下方式设置自定义设计:

<script type="text/javascript">
  function customExtender() {
    this.cfg.grid = {
       ...........
    }
  }
</script>
...
<p:lineChart extender="customExtender" value="..." />

然后查看jqplot文档http://www.jqplot.com/docs/files/jqPlotOptions-txt.html

   grid: {
        drawGridLines: true,        // wether to draw lines across the grid or not.
        gridLineColor: '#cccccc'    // *Color of the grid lines.
        background: '#fffdf6',      // CSS color spec for background color of grid.
        borderColor: '#999999',     // CSS color spec for border around grid.
        borderWidth: 2.0,           // pixel width of border around grid.
        shadow: true,               // draw a shadow for grid.
        shadowAngle: 45,            // angle of the shadow.  Clockwise from x axis.
        shadowOffset: 1.5,          // offset from the line of the shadow.
        shadowWidth: 3,             // width of the stroke for the shadow.
        shadowDepth: 3,             // Number of strokes to make when drawing shadow.
                                    // Each stroke offset by shadowOffset from the last.
        shadowAlpha: 0.07           // Opacity of the shadow
        renderer: $.jqplot.CanvasGridRenderer,  // renderer to use to draw the grid.
        rendererOptions: {}         // options to pass to the renderer.  Note, the default
                                    // CanvasGridRenderer takes no additional options.
    },

你可以在那里看到背景参数和drawGridLines:)