Okay
  Public Ticket #2266329
Charts
Closed

Comments

  • ILIA SHAPIRA started the conversation

    I have two questions about charts.

    1. I want to filter chart by date, but I don't want to see the table. You mentioned in one of the public tickets that there is an option to hide the table using CSS, so filtering still applies but only the chart is displayed. Can you tell me how ?

    2. Is it possible to display two charts (based on the same table) side by side (instead of the usual one on top of the other) ?

  •  2,572
    Aleksandar replied

    Hello Ilia.

    1. Sure, here's how to do it:

    If you want the charts to follow table filtering, then both the page and the chart need to be displayed on the same page. Also, for the filters to be shown, the table must be present as well.

    Anyone who knows CSS will be able to still display the table if they were to inspect the page, and simply change the properties.

    Since you need to show the filters, a simple CSS like this would not be useful, because it'd hide the filters too:

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

    So, instead you would first need to disable the following in table settings:

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

    2852344743.png

    "Enable main search block" from Sorting and Filtering tab:

    3844294247.png

    And "Table Tools" from Table Tools tab:

    6988162559.png

    Then, you can hide the table, leaving the filters above the chart like this:

    <style>
    .wpdt-c .wpDataTablesWrapper table {
    display: none !important;
    }
    </style>
    [wpdatatable id=1]
    [wpdatachart id=1]
    

    And that's it. This is how you'd create a page where you'd have Chart #1 dependent on wpDataTable #1 so it follows filtering, and the table hidden using CSS.

    2. Could possibly be done, but I'm not sure if defining the chart's width in Chart Creation Wizard will be enough. Try reducing the width of both charts, and see if they are going to appear side by side. If not, I can take a look if there's anything we can do with some CSS, but I can't promise anything.

    Kind Regards, 

    Aleksandar Vuković
    [email protected]

    Rate my support

    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

  • ILIA SHAPIRA replied

    Thank you very much

    CSS worked perfectly

    About the second part I tried to play with the width, but its still not working. It just makes them smaller

    Its not a huge problem I guess we can live with this

  •  2,572
    Aleksandar replied

    Hi again Ilia.

    You're welcome. Glad I could help.

    Are you using a page builder of some sort? If you are, you can add the builder's widgets side by side, and add the shortcodes in them. That way you can avoid any CSS, and you can customize the look of those widgets from the builder.

    Kind Regards, 

    Aleksandar Vuković
    [email protected]

    Rate my support

    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