• Payment Plugins Poll

    We need your feedback on the need for updated payment plugins. Please go here and give us your feedback.

  • Joomla 5.1

    For running J!5.1 you must install Fabrik 4.1
    See also Announcements

  • Subscription and download (Fabrik 4.1 for J!4.2+ and J!5.1) are working now

    See Announcement
    Please post subscription questions and issues here

    We have resolved the issue with the J! updater and this will be fixed in the next release.

Fusion Charts visualization

  • Views Views: 23,330
  • Last updated Last updated:
  • Installation Tasks​

    Install the Fabrik Fusion Charts plug-in​
    Download and install
    Create a folder fusioncharts-suite-xt at ./plugins/fabrik_visualization/fusionchart/libs

    Installing Fusion Charts​
    (Fabrik3.9+) This plugin works with the FusionCharts XT product. You can obtain a fully working trial version from https://www.fusioncharts.com/download/fusioncharts-suite-xt?framework=php

    Unzip fusioncharts-suite-xt.zip, upload the entire package to the 'libs/fusioncharts-suite-xt' folder in the Fabrik Fusion Chart plugin, such that the fusioncharts.php wrapper is at ./plugins/fabrik_visualization/fusionchart/libs/fusioncharts-suite-xt/integrations/php/fusioncharts-wrapper/fusioncharts.php.
    Make sure to have correct folder access settings (755 for fusioncharts-suite-xt).

    Then select the fusioncharts-suite-xt folder in the FusionChart Library selection in the Graph Atttributes tab, If you have a licensed copy or different versions, you can upload them to the same libs location and select the version you want to use.
    upload_2020-6-11_21-20-42.png


    Repeatable Options​

    For chart examples, fusionchart Options, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    index.php
    index.php

    • Connection - the Fabrik connection containing the list you wish to render
    • List - the list containing the data you wish to chart
    • Element - the element which contains the data to plot
    • Chart label - if you want a legend on your chart enter a label here
    • Element Type
      • data set
      • trend line - Trend lines are horizontal/vertical lines spanning the chart canvas which aid in interpretation of data with respect to some pre-determined value.
    • Colour - Sets the background colour for the canvas. HEX colour code WITHOUT "#" at the beginning (e.g. ff0000). FusionCharts Attribute: canvasBgColor
    • Alpha
    • Label Step Ratio
    • Label
    • Axis measurement unit
    • Dual Y Label
    • Multi Axis Attrs
    • Where - (Like a list pre-filter) Add a where SQL statement to filter the table results. E.g. name = 'rob'. You may use {Placeholders} for query string args, but if you do, don't use quotes, as we automagically urldecode, sanitize and quote any query string substitutions, so just foo={bar} becomes foo='whatever bar qs arg was'.
    Graph Attributes​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Version
    • Chart type
    • Chart Palette
    • Palette Colors
    • Width
    • Height
    • Template
    • Loading Message
    • Parsing Data Message
    • No Data Message
    • Custom attributes
    Trend Line specific attributes​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Label - The label to use for this element
    • Start Value
    • End Value
    • Show on top
    • Is a Zone
    Background Properties​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Color
    • Alpha
    • Image
    Canvas or Pies Properties​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Color
    • Alpha
    • Border color
    • Border Thickness
    Chart and Axis Titles​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Caption
    • Sub-caption
    • x-Axis name
    • y-Axis name
    Chart Numerical Limits​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • y-Axis Min value
    • y-Axis Max value
    General Properties​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Show Names
    • Show Values
    • Show Limits
    • Rotate Names x-Axis
    • Slant Names x-Axis
    • Rotate Values
    • Values inside
    • Animation - Whether the animation is to be played or whether the entire chart would be rendered at one go. FusionCharts Attribute: animation
    • Column Shadow
    • Num. Visible
    Font Properties​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Base Font
    • Base Font Size
    • Base Font Color
    • Out-Canvas Base Font
    • Out-Canvas Base Font Size
    • Out-Canvas Base Font Color
    Number Formatting Options
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Number Prefix
    • Number Suffix
    • Format Number
    • Format Number Scale
    • Decimal Separator
    • Thousand Separator
    • Decimal Precision
    • Division Line Decimal Precision
    • Limits Decimal Precision
    Zero Plane​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Thickness
    • Color
    • Alpha
    Divisional Lines (Horizontal)​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Number
    • Color
    • Thickness
    • Alpha
    • Show Value
    • NoYes
    • Alternate Horizontal Grid Color
    • Alpha
    Divisional Lines (Vertical)​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Number
    • Color
    • Thickness
    • Alpha
    • Alternate Vertical Grid Color
    • Alpha
    Hover Caption Properties​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Show Caption
    • Background Color
    • Border Color
    • Separator character
    Chart Margins​
    For details see tooltips (hover the labels), for examples, fusionchart attributes, settings, best practice of charts etc. see https://www.fusioncharts.com/fusioncharts
    • Left Margin
    • Right Margin
    • Top Margin
    • Bottom Margin

    Simple example​


    Assuming a Fabrik list "Parties" with id element, party names (name) and percentages of votes (datavalue)
    upload_2022-2-25_13-4-31.png

    In your fusionchart visualization set
    upload_2022-2-25_13-6-9.png

    upload_2022-2-25_13-8-4.png

    upload_2022-2-25_13-7-7.png

    all other Options are default.
    You'll get
    upload_2022-2-25_13-8-55.png


    Example Options:
    Where: [ id > 3 ] will show only columns for "Party4" and "Party5"
    Where: [ 1=1 order by datavalue ] will show the columns ordered by percentages
Back
Top