<p>Three questions for the team wrt combo (bar + line) . I am using the Apex Chart rendering engine for these use cases and the source is MySQL. </p><p>1. Is it possible to display text on the background? I would like to use the text from an existing column and display it in the background put a text that is picked from one of the existing columns. Example below, where SPX is painted on the background. <img src="https://quantnomad.com/wp-content/uploads/2021/03/image-7.png"> </p><p>2. When drawing a line on a combo chart, is there a way to extend the line out completely from one end to another? Currently the line starts from the middle of the first data point and ends at the middle of the last data point.</p><p>3. When using a combo chart, is there a way to display the label value for the line once and on the right side of the chart? I would still like to maintain the labels within the bars.</p><p>Example below:</p><figure><img src="https://ticksy_attachments.s3.amazonaws.com/9939628261.png" data-image="9939628261"></figure><p>Thanks!</p><p></p>
Dunno why but the formatting for original post doesn't looks right. Trying again:
Three questions for the team wrt combo (bar + line). I am using the Apex Chart rendering engine for these use cases and the source is MySQL.
Is it possible to display text on the background? I would like to use the text from an existing column and display it in the background. The text needs to be picked from one of the existing columns. Example in the attached chart, where SPX is painted on the background.
When drawing a line on a combo chart, is there a way to extend the line out completely from one end to another? Currently the line starts from the middle of the first data point and ends at the middle of the last data point.
When using a combo chart, is there a way to display the label value for the line once and on the right side of the chart? I would still like to maintain the labels within the bars.
Managed to solve (sort off) at least one problem (#3) using callbacks. I decided not to display the labels on the line.
Code below for anyone who might be interested, which needs to be inserted on the page where the table and chart is. Change the number 10 with your chart id and 0 in enabledOnSeries indicates that it's the first index aka first series that will have labels. You can provide comma separate values if you want to display labels on more than one series.
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.
-
Thank you so much for sharing this solution for problem 3 with us, and with other users.
I am sure that other users who need the same solution will find this useful - we will certainly make note of this.
-
In regards to the other points, and generally for changing/customizing the charts,
Every chart engine has its own layout and its settings.
We use free libraries for chart engines, and they are limited as to what we can change from within the plugin's UI.
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.
Dunno why but the formatting for original post doesn't looks right. Trying again:
Three questions for the team wrt combo (bar + line). I am using the Apex Chart rendering engine for these use cases and the source is MySQL.
Managed to solve (sort off) at least one problem (#3) using callbacks. I decided not to display the labels on the line.
Code below for anyone who might be interested, which needs to be inserted on the page where the table and chart is. Change the number 10 with your chart id and 0 in enabledOnSeries indicates that it's the first index aka first series that will have labels. You can provide comma separate values if you want to display labels on more than one series.
<script type="text/javascript"> jQuery(window).on('load', function(){ if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; } wpDataChartsCallbacks[10] = function(obj){ obj.options.dataLabels = { enabledOnSeries: [0] } }; }); </script>Hi, Sabi
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.
-
Thank you so much for sharing this solution for problem 3 with us, and with other users.
I am sure that other users who need the same solution will find this useful - we will certainly make note of this.
-
In regards to the other points, and generally for changing/customizing the charts,
Every chart engine has its own layout and its settings.
We use free libraries for chart engines, and they are limited as to what we can change from within the plugin's UI.
You can check out all the available chart engines and examples of wpDataCharts documentation here .
If the options you need are not in the chart creation wizard, you can try to find a custom solution using chart callbacks.
You can check our documentation about wpDataCharts callbacks.
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 | Instagram | Front-end and back-end demo | Docs
Amelia: FAQ | Facebook | Twitter | Instagram | Amelia 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