ZiYa Plugin - S T Y L E S

TutorController::refresh_bar

  # Overrides themes look and feel and define your own labels
  def refresh_bar    
    graph = Ziya::Charts::Bar.new( nil, nil, "my_bar" )         
    graph.add :axis_category_text, @categories
    graph.add :series, "Chickens", @series_a, @labels_a
    graph.add :series, "Rats"    , @series_b, @labels_b
    graph.add :theme, 'commando'
    render :xml => graph.to_s                          
  end

Base style base_chart.yml

<%= chart :base %> 
  <%=component :axis_category %>
    size:   10
    color:  61332b
    bold:   true
    alpha:  100
  
  <%=component :axis_value %>
    color:       a79d91
    skip:        0
    alpha:       100
    size:        10
        
  <%=component :chart_rect %>
    positive_color: f8af68      
    positive_alpha: 40
    negative_color: f88868
    negative_alpha: 40

  <%=component :legend_rect %>
    fill_color: f8af68
    fill_alpha: 40
          
  <%=component :axis_ticks %>
    major_color: 54544c
    minor_color: a19d91
    value_ticks: true
    
  <%=component :chart_border %>
    left_thickness:   2
    bottom_thickness: 1
    top_thickness:    1
    right_thickness:  1 
  
  <%=component :chart_grid_h %>
    thickness: 1
    color:     000000
    alpha:     7
  
  <%=component :chart_grid_v %>
    thickness: 3
    color:     000000
    alpha:     7
  
  <%=component :chart_transition %>
    type:     none
    order:    category  
    duration: 0.2
  
  <%=component :chart_value %>
    position: right
    color:    F5F0BE
    size:     9
    alpha:    100
  
  <%=component :legend_label %>
    color:    000000
    size:     10
    
  <%=component :legend_transition %>
    color: 00ff00  
    type:  none  
  
  <%=component :draw_title %>
    rotation: 90
    color:    61332b
    alpha:    50
    size:     24
    x:        368
    y:        25
    
  <%=component :series_color %>
    colors: 5f5a38,f8af68,4e6b49,e99e57

Extended style bar_chart.yml

<%= chart :bar %>
  <%=component :chart_border %>
    left_thickness:   2
    
  <%=component :chart_grid_h %>
    thickness: 1
  
  <%=component :chart_grid_v %>
    thickness: 5

Override style my_bar.yml

# Overriden bar chart styles
<%=chart :bar%>
  # Change y axis thickness
  <%=component :chart_border%>
    left_thickness: 5
  # Change x axis label colors
  <%=component :axis_value%>
    color:          eeca98
  # Change y axis label colors
  <%=component :axis_category%>
    color:          3097c0
  # Change legend rectangle
  <%=component :legend_rect%>
    x:              35
    width:          360
  # Change chart rectangle
  <%=component :chart_rect%>
    negative_color: c0b15c
    positive_color: f0811c
    negative_alpha: 30
    x:              35
    y:              35
    height:         225
    width:          360    
  # Change series colors
  <%=component :series_color%>
    colors:         657F5C,966E4A        
  # Add a chart title
  <%=component :draw%>   
    components:         
      - <%=drawing :text%>
        transition: drop
        delay:      0
        duration:   0.5
        bold:       true
        rotation:   90
        color:      657F5C
        alpha:      50
        size:       25
        x:          65
        y:          35
        text:       Custom styles