Building a Custom Bar Chart

Building a Custom Bar Chart on the Configurable Dashboard

The Configurable Dashboard offers three bar chart options, Bar Chart, Custom Bar Chart, and Stacked Bar Chart. We’re here to discuss the specifics of building out the Custom Bar Chart widget, so if you’re looking for instructions on how to build out a dashboard, look here.

Widget Configuration - Custom Bar Chart

To get right into it, let’s have a look at the Configuration options for the Custom Bar Chart widget. The first field you’re going to see is the Name. No catches here BUT some slight differences between the Standard Dashboard and the Configurable Dashboard to be aware of. In the Name field, you just need to enter the name of the widget, nothing wild there. However, you do have to make the choice of whether you want the widget name to display or not. If you want the name of the widget to be visible to viewers, click the Display Title checkbox as well. You can also select if you want the widget to have a border around it.

Next, if you want to, you can choose to adjust the height settings on the widget. The default will be Enforce exact height. Your other options are: Dynamically expand and reduce height, dynamically expand only, and dynamically reduce only.

What does any of this mean? Let’s define some terms.

• Enforce Exact Height
  • The default and recommended option. This option uses the template defined height and will not vary from that. If the data field is larger than possible to display at one time (unlikely in a bar chart but a possibility in others), scrolling will be required to view the data.
• Dynamically Expand and Reduce Height
  • The most flexible option wherein the widget will grow or shrink as necessary to display all data at one time with no scrolling required. This option may change the layout of the dashboard as the widget will not be a fixed size.
• Dynamically Expand Only
  • This will allow the widget to expand as needed to display all data but the widget will not shrink beyond the defined size set for the template.
• Dynamically Reduce Only
  • The widget may get smaller based on display needs but will not expand beyond the set size on the template.

Then, you get to select your Chart Type. Your options are: Column, Bar, and Line. Let’s have a look at what those options mean.

Column

The chart you’re immediately thinking of when you think ‘bar chart’.

Bar

The standard bar chart, set on its side.

Line

Show Legend

Will display a menu of all data points within the chart

Y-axis

Remembering what my 9th grade math teacher taught me, a chart is made up of two axes (which is the correct spelling, I checked!), in this case ‘x’ and ‘y’. We’re going to get into X a little later, right now we’re here to focus on the Y.

First up, you can add a label for the Y axis. Then you select the Display Method. Options are: Series Values or Series Stack Percentages.

Series Values

The straight numbers, each value gets a column all to itself.

Series Stack Percentages

A stacked bar chart with a total of 100 spread out across all values.

Data Lineup

Now that you’ve got your axes lined up, you can look at the bigger picture, more specifically how much data you want to display and how you want to break it up.

Chart Category

How do you want to break up the data? Options are: None, Event, Market, Day of the Week.

Number of Data Series

How many different data points do you want to include in your chart? Set the number here. Use manual text entry or the arrow buttons to put the number in.

Data Series Configuration

Now that we’ve got the widget setup complete, we need to focus on the individual bars. So, start by selecting which Series you’re going to build out. From the dropdown, make your selection. There will be one entry per data series that you entered in the Number of Data Series above.

Formatting

Then you can get into the formatting. First up, you can enter a Data Series Name.

Next you can select the color. You will use your device’s default color selection tool for this. The default color is black. Click on the color to open the color selector.

If you’ve added an extra data set but don’t want it displaying (ie. you want to use it for a calculation later), you can now click the Hide Data Series checkbox.

Want to stack your data? Click Use Stacks.

Data Setup

Now that the looks have been settled, it’s time to figure out what we’re actually going to display. Click Data, up next to Format.

Your first choice is Series Type. Your options are: Field or Calculation.

Field

A scheduling field, recap field, or venue custom field.

Calculation

Using PEDMAS create a calculation based on your data.  You may also pull in data fields by writing Cat1, Cat2, etc.  

Now, calculations are fairly straightforward so we’ll focus on the more complicated option, field.

As mentioned above, you’ve got options for the field type, and you make that decision with the Data Table. Your options are: Events and Venues.

Events

Scheduling or recap fields

Venues

Venue Custom fields

As we did with the Series Type, for the Data Table, we’re going with the more complicated option so you can see all the options. This means we’re picking Events.

With that choice, you’ll suddenly face four new fields, all related to the X-axis. We’ve already looked at the Y, so now we’re going to look at the options available for X. The fields are: 1st x-axis key, 2nd x-axis key, Special formatting for 1st key, and Special formatting for 2nd key.

For the axis key fields, your options are: Event Name, Event ID, and Integration Field

Event Name

The name entered at the time the event is added to the system. If your event names have duplicates, please be aware that the names will not be differentiated.

Event ID

The unique identifier for each event. Cannot have duplicates, unlike event names, harder to remember off-hand though.

Integration Field

If a Sales ID or other identifying integration field is used, it can be pulled here to differentiate data points.

Keep in mind, you have the option to use two of these, if you want. So if you want to use Event Name and Event ID, have at it!

For the Special Formatting fields, your options are: None, Date (YY/MM/DD), Date (Hour:Minute:Second AM/PM), and Date (Hour)

These kind of speak for themselves so I won’t bore you with a full definition of each. Just know that you can apply one of these to each of the x-axis keys if you choose. They are optional fields.

Now, you get to select the Data Category. Your options are: Standard, Integration, and Integration - Product Grouping.

Standard

The usual suspects, but there’s no Kaiser Soze here, just recap, scheduling, and leads fields.

Integration Fields

Fields related to any integrations (you may not have integrations on your site so if you don’t know what we’re talking about, you can ignore this)

Integration - Product Grouping

Product fields related to integrations

We’re going to select the most commonly used option and go with Standard.

Next choice is Field Type. As we outlined above, your options here are: Scheduling, Recap, and Leads. Following precedent, we’re going with the most common choice, Recap.

Now you get to pick the actual field you want.

Now, here’s where things get a bit more complicated, or at least, more considered. You need to think about how you plan to display the data. Some of the fields will lend themselves nicely to having their responses displayed, ie. ‘Approximately how many people attended’, while a text field such as ‘Enter the name of your on-site contact’, clearly does not. But you may not be planning to display the actual data collected, you could instead be planning to display how many responses you had to a question and in that case, you could still pull a text field or whatever field type you wanted, really. This was a roundabout way of telling you to think about what you’re going to show when you pick your field.

Another thing to keep in mind is that you will be able to add filters to each of these slices, so if you’re looking at comparing responses to a single question, you will be able to accomplish that in the coming steps. We’re going to pick exactly this type of question, ‘Which giveaway items did you have on-site?’.

Now, remember just a moment ago when we talked about choosing between using the data vs. using the number of responses? Let’s get into that a bit more here. First, the number in parentheses next to your field name is a count for how many responses you have on that field, so you’ll know straight away if you’re pulling a field with data associated or not. Also, the next field is called Value Type, and this is where you decide if you’re pulling based on the content of the response OR the number of responses.

Use Values

Uses the response data to generate the chart

Use Counts

Tallies the number of responses to the question to populate the chart

Let’s look at building each of these out, shall we?

Use Values

When you select this option, two new fields will display. “If this field has multiple values for a single event’ and ‘If displaying values for this field across multiple events’. Perhaps you immediately know what that means, but if you’re more inclined to think ‘huh?’, let’s see what those actually mean.

If this field has multiple values for a single event

This is to be applied in situations where you have more than once response to the same question at the same event. If you’re using survey fields, for example. Or even if you’re repeating a question in a recap for some reason or another. Here you have two options: Use Average or Use Sum.

If displaying values for this field across multiple events

Once again, you have two options: Use Average or Use Sum. This one will be applied to the more common situation in which you have more than one event with submitted responses to the question. So if you have 100 events with responses, do you want the sum of those responses? Or do you want the average? That’s what you decide here.

Use Counts

This is initially more simple, only one new field will appear when you make this selection, “Count Method”.

Count Method

It’s counting, how complicated could we possibly make it? Well the answer is plenty! You have five methods of counting available to you here. Count All Values, Count Unique Values, Count Duplicate Values, Count Duplicate Values Minus Their First Occurrence, and Count Unique Values Amongst Duplicates.

• Count All Values
  • Every answer is counted
• Count Unique Values
  • Only one value per event will get counted
• Count Duplicate Values
  • Values will get counted only after they’ve been entered more than once
• Count Duplicate Values Minus Their First Occurrence
  • Values will be counted only after they are entered once and will exclude the first instance
• Count Unique Values Amongst Duplicates
  • When values are entered more than once, only the first instance will be counted.

One final note on using counts, if you select any of the Duplicate options, you will also see a new field: Duplicate Assessment - Population Approach. Your options here are Per Event or All Events.

For our example, we’re going with Use Values and we’re going to Use Sum.

Good news! We’re at the end of the required fields, and now we can look at some optional ones instead. At this point, you could hit save and move on, but we’re going to outline all the options all the same.

The next two fields relate to text before or after the field value. If you want to have your numbers speak for themselves, leave these two fields blank. If you want to include some text, either before or after the value, enter it in the corresponding field.

The final field for this section is Decimals, which actually means, how many places after the decimal you want to have displayed. So if you have a number that’s actually 3.141592653589793238462643383279502, you may want to shorten that down to a more manageable 3.14. In that instance, you would enter 2 in Decimals. You can either enter the number manually, or use the arrow buttons to move the value up or down.

Filters

Alright, you’ve configured the data series, you’ve set up the data, now you get to decide if you need to filter that at all. Filtering at the bar-level is certainly not required and it’s worth giving thought to whether you need to filter at the bar, widget, or dashboard level before you go any further. If you’re going to be applying identical filtering to all your bars, hold tight and filter the widget as a whole (which we’ll get to shortly). But, if you need to differentiate between two otherwise identical bars, this is the place to do it.

To get started, you’ll want to click Filters up next to Format and Data.

Then click Add Filter.

Now we’ll take a second to talk about the structure of filters. Filtering can be broken into two pieces, the filter and the clause. Think of it this way, with each additional filter you’re adding OR logic, meaning something could be this OR this. When you add a Clause to a filter, it’s adding AND logic, meaning both criteria need to be met to get a result. You can have a filter without a clause but you cannot have a clause without a filter.

So let’s see about starting out with just the filter. From the Type field, select one of the filter type options. They are: Specific Value, Another Field, Venue Type, Market, Event Types, Event Statuses, Programs, Venue Event Count, Date Range.

• Specific Value
  • If your field has multiple options, this is where you would specify which value you wanted to pull into a specific portion of the chart.
  • You will assign a logic field of either ‘equals’ or ‘does not equal’ and then select the value you want.
• Another Field
  • If you want to filter based on responses to another question, this would be the option you want to pick.
  • You’ll once again select the Field Category (Standard, Integration, or Venue Profile). For Standard and Venue fields, you’ll also assign Field Type, Field Logic (equals, does not equal) and then you’ll enter the Field ID Value.
• Venue Type
  • Narrow results to specific venue type(s)
  • Select from list of venue types. Each venue type will need to be added individually.
• Market
  • Narrow results to specific Market(s)
  • Select the market(s) from a list. Each market will need to be added individually.
• Event Types
  • Narrow results to specific event type(s)
  • Apply Logic (Is Any Of, Is Not Any Of) then select event types from a list. Each event type will need to be added individually.
• Event Statuses
  • Narrow results to specific event statuses
  • Select the statuses from a list. Each status will need to be added individually.
• Programs
  • Narrow results to specific programs within the client site
  • Apply Logic (Is Any Of, Is Not Any Of) then select programs from a list. Each program will need to be added individually.
• Venue Event Count
  • Narrow results to only include events where the venue meets set criteria
  • Apply Logic (Equals, Does Not Equal, Greater Than, Greater Than or Equal, Less Than, Less Than or Equal) then enter the integer value.
• Date Range
  • Pull results only from within a specified time period
  • Select the Start and End Date from a calendar menu

So, if our Recap Question is “Which giveaway items did you have on-site?”, we could use filtering to differentiate on our chart which item we have. Let’s say our options are Hats, Key Fobs, and Stickers, you might want to know how many times each item was available at an event. So let’s look at how we would built out that filter, shall we?

Under Type you’re going to select Specific Value. Then you pick Logic. Your options are: Equals, Does Not Equal, Greater Than, Greater Than or Equal, Less Than, Less Than or Equal, Is Blank, Is Not Blank, Is True, and Is False.

We’ll pick Equals.

The next field is Value. Here you enter the ID for the specific value. In our case, let’s say we’re picking Hats, the ID for that is 4281. So, that’s what we’re going to enter here.

Now, if we needed to, we could add a clause, which remember is a way to add AND logic, meaning additional criteria must be met for the data point to be included in the chart. To do that, we would click Add Clause.

The steps from here would be the same as building out the initial filter. As well, you could add additional filters by clicking Add Filter again and just repeating the steps. If you add an additional filter instead of a clause, this will apply OR logic which allows for broader options to get pulled into your chart, so just think about how you need your filters to work before you make your choice.

Widget Filters

We’ve looked at filtering on the bar-level, but you can also apply filters to the entire widget. Save yourself the effort of applying filters piece by piece and just add them once here. At the top of the widget builder, click Widget Filters.

If you’ve already added piece-level filtering, this won’t be a big stretch for you, but if you haven’t, we’re going to go through all the steps so don’t worry about missing out on something. The next step is clicking Add Filter.  

This will open the Filter Builder. Your first step here is entering the Name of the filter. Then you need to select your Filter Type. For Filter Type, your options are: Venue Markets, Event Types, Recap Definitions, Programs, Date Range (full date), Date Range (Month and Year), Venue States, Integration Custom Fields, Scheduling Custom Fields, Recap Custom Fields, and Venue Custom Fields.

• Venue Markets
  • Narrow your widget data to specific markets
  • Select the market(s) from the dropdown menu. Markets will need to be added individually. If none are selected, the dashboard will default to including all in the filter.
• Event Types
  • Narrow your results to certain event types.
  • Select the event type(s) from the dropdown menu. Event types will need to be added individually. If none are selected, the dashboard will default to including all in the filter.
• Recap Definitions
  • Pull data only from events with specific recap assignments
  • Select the recap(s) from the dropdown menu. Recap definitions will need to be added individually. If none are selected, the dashboard will default to including all in the filter.
• Programs
  • Display data based on the event’s program assignment
  • Select the program(s) from the dropdown menu. Programs will need to be added individually. If none are selected, the dashboard will default to including all in the filter.
• Date Range (full date)
  • Select a date range for dd/mm/yy
• Date Range (Month and Year)
  • Select a date range for mm/yy
• Venue States
  • Pull data based on the state the venue is in
  • Select the state(s) from the dropdown menu. States will need to be added individually. If none are selected, the dashboard will default to including all in the filter.
• Integration Custom Fields
  • Use Integration Fields to determine what data is pulled into your chart
  • Select the field(s) from the dropdown menu. Fields will need to be added individually. If none are selected, the dashboard will default to including all in the filter.
• Scheduling Custom Fields
  • Pull data based on Scheduling Fields on the event
  • Select the field(s) from the dropdown menu. Fields will need to be added individually. If none are selected, the default will include all in the filter.
• Recap Custom Fields
  • Use specific Recap Fields to determine what event’s pull into your chart
  • Select the field(s) from the dropdown menu. Fields will need to be added individually. If none are selected, the default will include all in the filter.
• Venue Custom Fields
  • Use responses from Venue Fields to populate the widget
  • Select the field(s) from the dropdown menu. Fields will need to be added individually. If none are selected, the default will include all in the filter.

Build out additional filters as needed by repeating the above steps.

When you’ve made all your edits, click Save Changes at the bottom of the modal.

The chart will now display.