Meta Box

Displaying Form Data as a visual chart

Support › General › Displaying Form Data as a visual chartResolved

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • November 25, 2018 at 4:14 AM #12232
    @mindspark@mindspark
    Participant

    Hi Anh!

    I just submitted another question about performing calculations using form data and then displaying the results in numerical format. This question is an extension of that previous thread.

    I'm building a complex CPT that uses several different custom fields to collect data. The goal is to take the collected data and then generate a nice and well-organized file, and part of the output will also be financial information.

    So, not only do I need to perform calculations, but I would also like to display certain data in a visual manner - like graphs and charts.

    I'm expecting you to tell me that I will need to use a third party solution for this, but I'm hoping you might help me by pointing me in a direction with something that you know will integrate with MB?

    November 27, 2018 at 7:14 AM #12268
    @mindspark@mindspark
    Participant

    any updates here?

    November 27, 2018 at 2:12 PM #12287
    Anh TranAnh Tran
    Keymaster

    Hi Neil,

    As I answer in the other topic, showing the value of custom fields in a different way need some coding. In this case, you want to display in a chart or graph, then the steps will be:

    • Download a chart/graph library required CSS/JS. Depends on which library you use, the files are different.
    • Enqueue a chart/graph library's JS/CSS. This can be done in the theme with wp_enqueue_script and wp_enqueue_style.
    • Get the field values (via helper functions).
    • Output the values in the format required by the chart/graph library. If they required the data in JavaScript, you need to use wp_localize_script to enqueue the data.
    • Write some custom JS to initialize the graph/chart.

    That might sound complicated, but the whole process is just trying to pass the data of custom fields to the JS of the library. Depends on which library you use, the code might be different.

    November 28, 2018 at 4:44 AM #12305
    @mindspark@mindspark
    Participant

    Thanks Anh!

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.