Hi, Hajer 

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.

Absolutely, you can select, for each series to have a different chart type.

You can check out all the available chart engines and examples of wpDataCharts documentation here : 

Examples of tables and charts;

Charts.JS

HighCharts

Google charts

Apex charts

Let me know if you have any questions. Thanks

 Hi, Hajer 

Sorry for the delay

Yes, here is an example of our Apex Charts engine.

Here i select one series to be a Line type; and another to be column type;

You can try this out on our Demo,  on this link, 

and you can see the capabilities of our plugin for tables and charts.

and there is a 15-day money-back guarantee period, So if you purchase the plugin, you can safely fully test it out, and if it doesn't fit your needs you can request and receive a refund in that period. ( same goes for all plugins and add-ons)

Let me know how that seems. Thank you

Hi, Hajer 

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.

-

That is the default behavior of the charts engine, but if you need some custom solution you can check our documentation about wpDataCharts callbacks. 

• Every chart exposes several options that customize its look and feel. Charts usually support custom options appropriate to that visualization. wpDataChart callbacks allow adding options that are available in Google Charts API, Highcharts API, and Chart.js API. 

• All necessary resources are available in charts engines API (depends on which one you use). Every engine has a different approach to chart settings. 
• In wpDataChart callbacks, you have to adopt those settings to the wpDataChart object (you can take a look at examples for each engine in our documentation, and also in the Support help center). 
• A huge number of examples for any area of programming can be found on stackoverflow.com (typing your problem in google and at the end add "site: stackoverflow.com" and Google will search only that website).

 Also, a lot of examples of charts, chart settings, and customization can be found on jsffidle.net (typing in google for example "line chart highcharts jsffidle")

• Please note that using hooks or wpDataTable and wpDataChart callbacks requires a certain level of programming skills and included support refers only to advice.

Hi, Hajer 

Sorry for the delay

I believe there might be a way, perhaps by inserting a global script into the plugin somehow, that would select all the chart ID's.

I think our developers showed me a similar solution some time ago, but not sure...

I will have to check with them - and as soon as they confirm, i will immediately report back to you.

Thank you for your patience.

Hi, Hajer 

I almost forgot - Could you show us the callback that you used, please?

It will probably help, if the devs need to test anything on our end, so that it will be easier to see exactly what you did.

And if possible, if you could give us a link to the page with the chart?

If it has any sensitive data, you can respond in a Private message.

Thank you

Hi, Hajer 

Firstly my sincerest apologies for all the waiting time.

I got confirmation from the senior Team , and we additionaly asked the developers.

-

Basically, with our built-in functionalities, we are not able to set a callback that will cover multiple charts. For each, we have to add chart ID in the script.

-

There can be workarounds, but we haven't tested everything yet.  We plan to add solutions in the future, i can't say an ETA though.

For the time being, i can only offer you some examples with custom solutions, i hope it can help.

We have these hooks available :

wpdatatables_filter_google_charts_render_data
wpdatatables_filter_highcharts_render_data
wpdatatables_filter_chartjs_render_data
wpdatatables_filter_apexcharts_render_data

-

This is a custom solution, so we can only give you an example.

This was used to move "Reset zoom" button of a HighChart, from right side to the left side of the chart;

We have first used this script only on the page with the chart, i will first show how we did it for one chart on the page :

We place this script text on the same page where your graph is;

we used Gutenberg editor, and used a custom HTML block for it to work-

here is the script text :

<script type="text/javascript">
jQuery(window).on('load', function(){
    if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
    wpDataChartsCallbacks[3] = function(obj){
        obj.options.chart.resetZoomButton = {
            position: {
                align: 'left'
            }
        };
    }
});
</script>

( change the ID in square brackets to your chart ID, at the  ' wpDataChartsCallbacks[ ]  ' part. )

- And here is an example how to use wpDataChart callbacks from our documentation, in case you struggle how to do this - https://wpdatatables.com/documentation/information-for-developers/wpdatacharts-callbacks/

-

Now, i will show you a custom workaround our developers used to apply this to all the charts.

A solution that should work for all the HighCharts on the plugin ; then you wouldn't have to use the callback on the page anymore.

For this to work, you have to edit the code in a couple of PHP files.

- The first one is in the path:  wp-content/plugins/wpdatatables/source/class.wpdatachart.php

Around line 2211, you will find this :

$this->_highcharts_render_data['options']['credits']['text'] = $this->getCreditsText();

underneath that, add this hook :

$this->_highcharts_render_data = apply_filters('wpdatatables_filter_highcharts_render_data', $this->_highcharts_render_data, $this->getId(), $this);

and then, in the functions file of your theme, or child theme; insert this :

add_filter( 'wpdatatables_filter_highcharts_render_data', 'updateHighchartsRenderData', 10, 3 );
function updateHighchartsRenderData ($highcharts_render_data, $chartID, $chart_object){    $highcharts_render_data['options']['chart']['resetZoomButton']['position']['align'] = 'left';    return $highcharts_render_data;
}

- This way, it will be applied to all the HighCharts. You can remove that first callback that we gave you if this is implemented correctly.

- This hook takes three parameters:

The first one is the HighCharts render data which is an array with all the options,

the second one is "chart ID", in case you need it for only some specific charts;

and the last one is the chart object.

- Please let us know if this solution works for you, and later on, we can work on adding this to the core of the plugin; not just for HighCharts but the other engines, as well.

In the end, you can choose to use/change this through the PHP filter in the theme's files, and also with callbacks on the page - depending on what works best for you.

-

I hope that helps.