Okay
  Public Ticket #3576428
Stacked column charts with two string columns
Closed

Comments

  • Pablo started the conversation

    Hi! ;-)

    All our environmental data tables are organised with two principal string columns ( year and centre/facility). We want to create a stacked column chart like the example attached but with the Centre values separated in each column or different columns in the case of basic column charts (not values grouped). 

    Our year column is a string because some users need to use an aperiode like "2022-2023" instead of a date column.  

    So, we have tried every type of column chart, and the system tells us that using two-string columns is impossible. 

    How can we make this graphic without changing our data year column?

    Thank you in advance.

    Pablo

    Attached files:  Captura de pantalla 2024-02-03 a las 12.42.03.png

  •  1,846
    Miloš replied

    Hi Pablo,

    Firstly, I would like to sincerely apologize for the delayed response as we have been experiencing an unusually high number of tickets. I am sorry that it has taken longer than usual to respond to your concern and your patience is highly appreciated.

    -

    1. When it comes to trying a method with two ( or more) String Columns - That will not be possible in any way, this is the nature of the Chart Engines themselves.

    In any Chart, you will not be able to use more than one String or Date column, so that will not work.


    The only way, if you need to present data compared on Charts with multiple String Columns, can be to use multiple Charts, set them up next to each other on the same Page, then have each Chart have one String Column in it.


    We will do our best to try to advise you on alternate ways what you can try to 'present this data' in a certain way, such as if you wish to 'compare' some data by filtering, or by transforming the "year" data to "integer" type.


    2. If you wish to try with filtering of the data on a Page;

    You can achieve this with the "Follow table filtering" and the Table on the same Page.

    It seems to me you are maybe already doing this - but not sure from your screenshot?

    I will share this workaround if it might be useful, you can also hide the source Table and just have filters with Chart on Page( if you already tried it and you know it, then my apology for unnecessary details) :

    By default, the charts will not follow any filtering from their source table if you just put the chart "on its own" on the page.

    But If you place the source table together with its chart on the same page,

    and activate " Follow Table filtering"  on the chart Wizard settings,  it is going to follow any filtering/sorting you do on the table.

    -

    Now, depending if you wish to hide the table and have a filtering for Charts, we can have two workarounds available.

    1. If you wish to hide the entire table along with table filters;

    you can add this CSS to the table's back-end settings/Customize/Custom CSS.

    .wpdt-c .wpDataTables.wpDataTablesWrapper {
    display: none !important;
    }

    This will completely hide the table from the page, but you can still pass the table shortcode with the chart, and you will get the "follow table filtering" effect on this chart.


    2. Or if you wish just to hide the table while leaving the filters with the chart,

    we would first need to disable the following in the table settings:

    "Show X entries" drop-down; "Info Block" from Display tab:

    5739555450.png

    Then, "Enable main search block"  and "show filters in a form above the table" from the Sorting and Filtering tab:

    7822122957.png

    Then, you can add this CSS in the table settings/Customize/Custom CSS:

    .wpdt-c .wpDataTablesWrapper table {
    display: none !important;
    }
    

    That will just leave the chart visible with the filters on the page,

    if you pass both table and chart shortcodes.

    -


    So this way, a User can go in, and only filter the data for the specific Year, or any other filter you need.

    Any filter you do on the Table, will reflect the Chart.


    3. Or, if you try to change the Data type for the "year" Column- if you make them Integer, like "2019", "2020", etc, it can work to be added as multiple Fields in the same Chart.

    But it won't be possible to use any value in any cell as "2022-2023".

    In that case, you can only add a "number range" filter on this integer Year Field in the source Table, so some user could still go in the Number range, and say " i want to see years from 2022 to 2023" with the Number Range filter, and this will reflect the Chart.

    I hope that helps. Those are the only possible workarounds at the moment.

    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables