Have you ever found yourself curious if you could add a tweek here or their on charts that come in Rock? The 2 built in are great examples but might not fit your church theme or needs.  Here are a couple of sample you can use. We hope you enjoy them and post below if you have any questions.


Step 1: Navigate to Defined Types

To add chart styles head to Admin Tools =>  General Settings =>  Defined Types =>  Scroll down to Global: Chart Styles and click on the row


Step 2: Adding the charts

You shold see the current list of Chart Styles of "Flot" And "Rock" in the list. Now we will need to add the below 5 examples and feel free to tweek as you see fit. Note that these have been designed for YOY and the year has been removed. It is a good idea to have the year be in the series.

Flot Red/Orange Lines


{
  "seriescolors": [
    "#ff4444",
    "#ffbb33",
    "#00C851",
    "#33b5e5"
  ],
  "goalseriescolor": "blue",
  "grid": {  
    "colorgradient": null,
    "color": "black",
    "backgroundcolorgradient": null,
    "backgroundcolor": null,
    "borderwidth": {
      "top": 2,
      "right": 2,
      "bottom": 2,
      "left": 2
    },
    "bordercolor": {
      "top": "black",
      "right": "black",
      "bottom": "black",
      "left": "black"
    }
  },
  "xaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": "%b %d"
  },
  "yaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": null
  },
  "fillopacity": null,
  "fillcolor": null,
  "legend": {
    "backgroundcolor": "transparent",
    "backgroundopacity": null,
    "labelboxbordercolor": null
  },
  "title": {
    "font": {
      "size": 18,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "left"
  },
  "subtitle": {
    "font": {
      "size": 12,
      "family": "terminal",
      "color": "#EC407A"
    },
    "align": "right"
  }
}

Flot Blue/Purple Lines


{
  "seriescolors": [
    "#4285F4",
    "#aa66cc",
    "#2E2E2E",
    "#2BBBAD"
  ],
  "goalseriescolor": "#4B515D",
  "grid": {  
    "colorgradient": null,
    "color": "black",
    "backgroundcolorgradient": null,
    "backgroundcolor": null,
    "borderwidth": {
      "top": 2,
      "right": 2,
      "bottom": 2,
      "left": 2
    },
    "bordercolor": {
      "top": "black",
      "right": "black",
      "bottom": "black",
      "left": "black"
    }
  },
  "xaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": "%b %d"
  },
  "yaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": null
  },
  "fillopacity": null,
  "fillcolor": null,
  "legend": {
    "backgroundcolor": "transparent",
    "backgroundopacity": null,
    "labelboxbordercolor": null
  },
  "title": {
    "font": {
      "size": 18,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "left"
  },
  "subtitle": {
    "font": {
      "size": 12,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "right"
  }
}

Flot Green/Lime Lines


{
  "seriescolors": [
    "#43a047",
    "#c0ca33",
    "#fdd835",
    "#fb8c00"
  ],
  "goalseriescolor": "green",
  "grid": {  
    "colorgradient": null,
    "color": "black",
    "backgroundcolorgradient": null,
    "backgroundcolor": null,
    "borderwidth": {
      "top": 2,
      "right": 2,
      "bottom": 2,
      "left": 2
    },
    "bordercolor": {
      "top": "black",
      "right": "black",
      "bottom": "black",
      "left": "black"
    }
  },
  "xaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": "%b %d"
  },
  "yaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": null
  },
  "fillopacity": null,
  "fillcolor": null,
  "legend": {
    "backgroundcolor": "transparent",
    "backgroundopacity": null,
    "labelboxbordercolor": null
  },
  "title": {
    "font": {
      "size": 18,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "left"
  },
  "subtitle": {
    "font": {
      "size": 12,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "right"
  }
}

Flot Blue/Black Lines


{
  "seriescolors": [
     "#3498DB",
     "black",
    "#95A5A6",
    "#2C3E50"
   
  ],
  "goalseriescolor": "gray",
  "grid": {  
    "colorgradient": null,
    "color": "black",
    "backgroundcolorgradient": null,
    "backgroundcolor": null,
    "borderwidth": {
      "top": 2,
      "right": 2,
      "bottom": 2,
      "left": 2
    },
    "bordercolor": {
      "top": "black",
      "right": "black",
      "bottom": "black",
      "left": "black"
    }
  },
  "xaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": "%b %d"
  },
  "yaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": null
  },
  "fillopacity": null,
  "fillcolor": null,
  "legend": {
    "backgroundcolor": "transparent",
    "backgroundopacity": null,
    "labelboxbordercolor": null
  },
  "title": {
    "font": {
      "size": 18,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "left"
  },
  "subtitle": {
    "font": {
      "size": 12,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "right"
  }
}

Flot Yellow/Purple Lines


{
  "seriescolors": [
     "#F1C40F",
     "#8E44AD",
    "#D35400",
    "#C0392B"
   
  ],
  "goalseriescolor": "gray",
  "grid": {  
    "colorgradient": null,
    "color": "black",
    "backgroundcolorgradient": null,
    "backgroundcolor": null,
    "borderwidth": {
      "top": 2,
      "right": 2,
      "bottom": 2,
      "left": 2
    },
    "bordercolor": {
      "top": "black",
      "right": "black",
      "bottom": "black",
      "left": "black"
    }
  },
  "xaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": "%b %d"
  },
  "yaxis": {
    "color": "#99c2ff",
    "font": {
      "size": null,
      "family": null,
      "color": "black"
    },
    "datetimeformat": null
  },
  "fillopacity": null,
  "fillcolor": null,
  "legend": {
    "backgroundcolor": "transparent",
    "backgroundopacity": null,
    "labelboxbordercolor": null
  },
  "title": {
    "font": {
      "size": 18,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "left"
  },
  "subtitle": {
    "font": {
      "size": 12,
      "family": "terminal",
      "color": "#296629"
    },
    "align": "right"
  }
}

Wrapping it all up

And thats it. If you see any changes that you would like we hope this give you enough to be dangerous! We hope that you have fun and enjoy using Rock! Now you should have the colors to help make charts pop!