Buy it now

Bar Chart Pro Example #6:

Data structure: 1 dataset

Display option: Data in bars and link to external urls

See below how this chart is configured and how the data is filled

Config Example 6

Config Example 6

To add links to every bar:
  • Data id is the position of the data in the list. 0 for the first one, 1 for the second one and so on.
  • Select "external url" or "menu item"
  • you can jump a bar if you don't want to link it.
  • Enter a full url for external link, or select the menu item in the list
  • Select a target
Data Example 6

Data Example 6

  • Click on the 'Add data' button to create a new line
  • Only one title by line
  • up to 10 numbers separated by commas ','.
  • Numbers can be integer (1,2,3,845...) or float (2.5, 12.756...)

Buy it now

Bar Chart Pro Example #5:

Click on the button "Dataset 1", "Dataset 2" & "Dataset 3" to see how the filter works

Roll over each day to see the tooltip in action with the data inside

Data structure : 7 datasets

 

See below how this chart is configured and how the data is filled

Config Example 5

Config Example 5

  • Important: Each Dataset has its own id
  • The first dataset id have id 0, the second dataset must have id 1, the third must have id 2 and so on
  • Don't jump an Id, for example, id: 0, 1 and 3 (the third one (3) won't be displayed)
  • In this example, datasets 7, 8 and 9 are set to "Line" chart type
  • Background color is useless for line chart type, and border is mandatory for the dataset to be displayed. "Border width" has to be set to "1" at least as "Border opacity"
  • Line chart type doesn't work in the "horizontal" mode, if set, data of this set won't be displayed
Data Example 5

Data Example 5

  • Click on the 'Add data' button to create a new line
  • Only one title by line
  • up to 10 numbers separated by commas ',' (9 in this example).
  • Numbers can be integer (1,2,3,845...) or float (2.5, 12.756...)

Buy it now

Bar Chart Pro Example #4:

Click on the button "Dataset 1", "Dataset 2" & "Dataset 3" to see how the filter works

Roll over each day to see the tooltip in action with the data inside

Data structure : 3 datasets

Datasets 1 & 2 are stacked. Mixed Bar and Line chart type.

See below how this chart is configured and how the data is filled

Config Example 4

Config Example 4

  • Important: Each Dataset has its own id
  • The first dataset id have id 0, the second dataset must have id 1, the third must have id 2 and so on
  • Don't jump an Id, for example, id: 0, 1 and 3 (the third one (3) won't be displayed)
  • Third dataset is set to "Line" chart type
  • Line chart type doesn't work in the "horizontal" mode, if set, data of this set won't be displayed
Data Example 4

Data Example 4

Same data as "Example 1"
  • Click on the 'Add data' button to create a new line
  • Only one title by line
  • up to 10 datas separated by commas ','

Buy it now

Bar Chart Pro Example #3:

Click on the button "Dataset 1", "Dataset 2" & "Dataset 3" to see how the filter works

Roll over each day to see the tooltip in action with the data inside

Data structure : 3 datasets

Datasets 0, 1 and 2 are in the same stacked group (0). Dataset "2" has three different colors.

See below how this chart is configured and how the data is filled

Config Example 3

Config Example 3

  • Important: Each Dataset has its own id
  • The first dataset id have id 0, the second dataset must have id 1, the third must have id 2 and so on
  • Don't jump an Id, for example, id: 0, 1 and 3 (the third one (3) won't be displayed)
  • Stacked option is set to "x-axis"
Config display Example 3

Config display Example 3

  • Height is a little larger (550px instead of 350px by default)
  • Bar Chart axis is set to horizontal
Data Example 3

Data Example 3

Same data as "Example 1"
  • Click on the 'Add data' button to create a new line
  • Only one title by line
  • up to 10 datas separated by commas ','

Buy it now

Bar Chart Pro Example #2:

Click on the button "Dataset 1", "Dataset 2" & "Dataset 3" to see how the filter works

Roll over each day to see the tooltip in action with the data inside

Data structure : 3 datasets

Datasets 0, 1 and 2 are in the same stacked group (0). Dataset 2 has three different colors

See below how this chart is configured and how the data is filled

Config Example 2

Config Example 2

  • Important: Each Dataset has its own id
  • The first dataset id have id 0, the second dataset must have id 1, the third must have id 2 and so on
  • Don't jump an Id, for example: id, 0, 1 and 3 (the third one won't be displayed)
Data Example 2

Data Example 2

Same data as "Example 1"
  • Click on the 'Add data' button to create a new line
  • Only one title by line
  • up to 10 datas separated by commas ','

Buy it now

Bar Chart Pro Example #1:

Click on the button "Dataset 1", "Dataset 2" & "Dataset 3" to see how the filter works

Roll over each day to see the tooltip in action with the data inside

Data structure : 3 datasets

Datasets 0 and 1 are in the same stacked group (0), dataset 2 is on its own

See below how this chart is configured and how the data is filled

Config Example 1

Config Example 1

  • Important: Each Dataset has its own id
  • The first dataset id have id 0, the second dataset must have id 1, the third must have id 2 and so on
  • Don't jump an Id, for example: id, 0, 1 and 3 (the third one won't be displayed)
Data Example 1

Data Example 1

  • Click on the 'Add data' button to create a new line
  • Only one title by line
  • up to 10 datas separated by commas ','