Modena CHART SKIN

Locked
david.chacon
Posts: 17
Joined: 23 Jun 2011, 23:33

08 Sep 2015, 16:34

How to skin my chart with modena layout as dashboard in http://www.primefaces.org/modena/

Section "Your Cellular Data Usage Statistics"

Please help me
David Andrade B
Oracle Certified

aragorn
Posts: 3777
Joined: 29 Jun 2013, 12:38

09 Sep 2015, 12:00

Please try with;

XHTML

Code: Select all

<p:chart type="line" model="#{bean.lineModel1}" style="height:350px;" responsive="true"/>
Bean.java

Code: Select all

 private void createLineModels() {
        lineModel1 = initLinearModel();
        lineModel1.setTitle("Linear Chart");
        lineModel1.setLegendPosition("e");
        lineModel1.setExtender("skinChart"); // JS function
        lineModel1.setAnimate(true);
        Axis yAxis = lineModel1.getAxis(AxisType.Y);
        yAxis.setMin(0);
        yAxis.setMax(10);
}
JS

Code: Select all

function skinChart() {
    this.cfg.shadow = false;
    this.cfg.title = '';
    this.cfg.seriesColors = ['#8E24AA', '#C6FF00'];
    this.cfg.grid = {
        background: '#ffffff',
        borderColor: '#ffffff',
        gridLineColor: '#F5F5F5',
        shadow: false,
    };
    this.cfg.axesDefaults = {
        rendererOptions: {
            textColor: '#546E7A'
        }
    };
    this.cfg.seriesDefaults = {
        shadow: false,
        markerOptions: {
            shadow: false
        }
    }
}

david.chacon
Posts: 17
Joined: 23 Jun 2011, 23:33

15 Sep 2015, 23:17

Yes this work for me thks
David Andrade B
Oracle Certified

aragorn
Posts: 3777
Joined: 29 Jun 2013, 12:38

16 Sep 2015, 08:25

Glad to hear, thanks ;)

Locked

Return to “Modena”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest