Custom Widgets
We're always adding new services to our widget collection. But we understand that your data could be locked up in many places such as your PC or workstation, your company's internal databases and other third party applications.
Let's say you want to see a real-time report of how many people signed up on your site or app. Or maybe your boss wants you to put together a marketing status report on a daily basis. No problem! Using custom widgets, you can hook your dashboards up to almost any data source on the web. Or pull data straight from CSV files.
How It Works
Step 1. Decide on what type of custom widget you would like to use with your data. See the list of available custom widget types below.
Step 2. Create a CSV file with the data you want to see in your custom widget. Make sure your data format matches the data format of the custom widget type you selected in step 1 (data formats found below). You can also dynamically create the CSV file using your favorite programming language such as PHP or ASP and host it on your website.
Step 3. Configure a new custom widget inside your dashboard and either pull the CSV file straight from a private URL or off of your PC. If pulling from a private URL, you can specify how often you want Cyfe to refresh the data (e.g. every 10 secs, 5 mins, 24 hours).
Custom Widget Types
As of today, the following custom widget types are available for you to feed data into.
Line Chart
Line charts are used to show trends and performance over a period of time.
Data Format
The data format for this widget consists of 5 different types of rows. Each row consists of comma separated values. You can group up to 5 separate metrics together into a single widget.
Labels: Required. In the first row of your data, you must specify what labels you would like to use for your metrics. You can also specify the type of value your labels will represent (i.e. dollar value, percentage) by appending "($)" or "(%)" at the end of the label. The first value in this row must always be "Date".
Data: Required. Starting from the second row, append a list of values for your metrics starting with the date (YYYYMMDD) as the first value in each row.
Totals: Optional. You can specify the totals for some or all of your metrics by appending them to the end of your list. The first value in this row must always be "Total".
Colors: Optional. You can use your own color scheme for your metrics by appending a row of hexadecimal color codes to the end of your list. The first value in this row must always be "Color".
Types: Optional. You can specify the type of chart you want to see for each of your metrics by appending a row of chart types to the end of your list. The first value in this row must always be "Type".
Example
20111201,5,2,6.5,0.5
20111202,1,0,8.5,0.25
20111203,45,12,1.5,0.01
20111204,12,4,2.25,0.68
20111205,2,3,0,0.12
Total,1523,120,146.53,20.2
Color,#ff7f00,#00cb13,#ee0000,#009dee
Type,line,line,area,column
Area Chart
Area charts are used to show trends and performance over a period of time.
Data Format
The data format for this widget consists of 5 different types of rows. Each row consists of comma separated values. You can group up to 5 separate metrics together into a single widget.
Labels: Required. In the first row of your data, you must specify what labels you would like to use for your metrics. You can also specify the type of value your labels will represent (i.e. dollar value, percentage) by appending "($)" or "(%)" at the end of the label. The first value in this row must always be "Date".
Data: Required. Starting from the second row, append a list of values for your metrics starting with the date (YYYYMMDD) as the first value in each row.
Totals: Optional. You can specify the totals for some or all of your metrics by appending them to the end of your list. The first value in this row must always be "Total".
Colors: Optional. You can use your own color scheme for your metrics by appending a row of hexadecimal color codes to the end of your list. The first value in this row must always be "Color".
Types: Optional. You can specify the type of chart you want to see for each of your metrics by appending a row of chart types to the end of your list. The first value in this row must always be "Type".
Example
20111201,5,2,6.5,0.5
20111202,1,0,8.5,0.25
20111203,45,12,1.5,0.01
20111204,12,4,2.25,0.68
20111205,2,3,0,0.12
Total,1523,120,146.53,20.2
Color,#ff7f00,#00cb13,#ee0000,#009dee
Type,line,line,area,column
Column Chart
Column charts are used when you want to compare the values of individual data points with another.
Data Format
The data format for this widget consists of 5 different types of rows. Each row consists of comma separated values. You can group up to 5 separate metrics together into a single widget.
Labels: Required. In the first row of your data, you must specify what labels you would like to use for your metrics. You can also specify the type of value your labels will represent (i.e. dollar value, percentage) by appending "($)" or "(%)" at the end of the label. The first value in this row must always be "Date".
Data: Required. Starting from the second row, append a list of values for your metrics starting with the date (YYYYMMDD) as the first value in each row.
Totals: Optional. You can specify the totals for some or all of your metrics by appending them to the end of your list. The first value in this row must always be "Total".
Colors: Optional. You can use your own color scheme for your metrics by appending a row of hexadecimal color codes to the end of your list. The first value in this row must always be "Color".
Types: Optional. You can specify the type of chart you want to see for each of your metrics by appending a row of chart types to the end of your list. The first value in this row must always be "Type".
Example
20111201,5,2,6.5,0.5
20111202,1,0,8.5,0.25
20111203,45,12,1.5,0.01
20111204,12,4,2.25,0.68
20111205,2,3,0,0.12
Total,1523,120,146.53,20.2
Color,#ff7f00,#00cb13,#ee0000,#009dee
Type,line,line,area,column
Pie Chart
Pie charts are used to show the breakdown of data into its constituents, i.e. parts of a whole.
Data Format
The data format for this widget consists of 3 different types of rows. Each row consists of comma separated values. You can only use 1 metric in a single widget.
Labels: Required. In the first row of your data, you must specify what labels you would like to use for your metric. You can also specify the type of value your labels will represent (i.e. dollar value, percentage) by appending "($)" or "(%)" at the end of the label.
Data: Required. In the second row, append a list of values for your metric.
Colors: Optional. You can use your own color scheme for your metric values by appending a row of hexadecimal color codes to the end of your list. The first value in this row must always be "Color".
Example
3,2,4,64,343
Color,#ff7f00,#00cb13,#ee0000,#009dee,#dc00d9
Image
This widget allows you to brand your dashboard with any image on your PC or workstation.
HTML
This widget allows you to pull custom HTML from a private URL. It can be used to display things like custom status messages from your internal systems.
