king-addons / includes / widgets / Charts / Charts.php

Charts.php in King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder 51.1.65, at includes/widgets/Charts/Charts.php

2,650 lines 89.9 KB

Raw Download Zip

1	<?php
2
3	namespace King_Addons;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Widget_Base;
7	use Elementor\Repeater;
8
9	if (!defined('ABSPATH')) {
10	exit;
11	}
12
13	class Charts extends Widget_Base
14	{
15
16	public function get_name()
17	{
18	return 'king-addons-charts';
19	}
20
21	public function get_title()
22	{
23	return esc_html__('Charts', 'king-addons');
24	}
25
26	public function get_icon()
27	{
28	return 'king-addons-icon king-addons-charts';
29	}
30
31	public function get_script_depends()
32	{
33	return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-charts-charts', KING_ADDONS_ASSETS_UNIQUE_KEY . '-charts-script'];
34	}
35
36	public function get_style_depends()
37	{
38	return [
39	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-timing',
40	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-loading',
41	KING_ADDONS_ASSETS_UNIQUE_KEY . '-charts-style'
42	];
43	}
44
45	public function get_categories()
46	{
47	return ['king-addons'];
48	}
49
50	public function get_keywords()
51	{
52	return ['charts', 'chart', 'polar', 'linear', 'graph', 'pie', 'radar', 'king addons', 'line charts',
53	'radar charts', 'doughnut charts', 'pie charts', 'polararea charts', 'vertical', 'bar', 'polararea',
54	'polar charts', 'bar charts', 'horizontal charts', 'vertical charts', 'horizontal',
55	'king', 'addons', 'kingaddons', 'king-addons'];
56	}
57
58	public function get_custom_help_url()
59	{
60	return 'https://kingaddons.com/elementor/charts/';
61	}
62
63	public function add_control_choose_chart_data_source()
64	{
65	$this->add_control(
66	'data_source',
67	[
68	'label' => esc_html__('Data Source', 'king-addons'),
69	'type' => Controls_Manager::SELECT,
70	'default' => 'custom',
71	'options' => [
72	'custom' => esc_html__('Custom', 'king-addons'),
73	'pro-csv' => 'CSV' . ' ' . esc_html__('File', 'king-addons') . ' (Pro)',
74	],
75	'frontend_available' => true,
76	]
77	);
78	}
79
80	protected function register_controls()
81	{
82
83	$this->start_controls_section(
84	'section_chart_general',
85	[
86	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('General', 'king-addons'),
87	'tab' => Controls_Manager::TAB_CONTENT,
88	]
89	);
90
91	$this->add_control_choose_chart_data_source();
92
93	Core::renderUpgradeProNotice($this, Controls_Manager::RAW_HTML, 'charts', 'data_source', ['pro-csv']);
94
95	$this->add_control(
96	'csv_source',
97	[
98	'label' => esc_html__('CSV Source', 'king-addons'),
99	'type' => Controls_Manager::SELECT,
100	'default' => 'url',
101	'options' => [
102	'url' => esc_html__('Remote URL', 'king-addons'),
103	'file' => esc_html__('File', 'king-addons'),
104	],
105	'condition' => [
106	'data_source' => 'csv',
107	],
108	'frontend_available' => true,
109	]
110	);
111
112	$this->add_control(
113	'data_csv_separator',
114	[
115	'label' => esc_html__('Separator', 'king-addons'),
116	'type' => Controls_Manager::TEXT,
117	'default' => ',',
118	'label_block' => true,
119	'condition' => [
120	'data_source' => 'csv',
121	],
122	]
123	);
124
125	$this->add_control(
126	'data_source_csv_url',
127	[
128	'label' => esc_html__('Remote URL', 'king-addons'),
129	'type' => Controls_Manager::TEXT,
130	'dynamic' => [
131	'active' => true,
132	],
133	'label_block' => true,
134	'condition' => [
135	'data_source' => 'csv',
136	'csv_source' => 'url',
137	],
138	]
139	);
140
141	$this->add_control(
142	'data_source_csv_file',
143	[
144	'label' => esc_html__('Upload CSV File', 'king-addons'),
145	'type' => Controls_Manager::MEDIA,
146	'dynamic' => ['
147	active' => true,
148	],
149	'media_type' => [],
150	'label_block' => true,
151	'condition' => [
152	'data_source' => 'csv',
153	'csv_source' => 'file',
154	],
155	]
156	);
157
158	$this->add_control(
159	'chart_type',
160	[
161	'label' => esc_html__('Chart Styles', 'king-addons'),
162	'type' => Controls_Manager::SELECT,
163	'description' => esc_html__('Doughnut, pie and polar area charts only work with custom data source', 'king-addons'),
164	'default' => 'bar',
165	'options' => [
166	'bar' => esc_html__('Bar Vertical', 'king-addons'),
167	'bar_horizontal' => esc_html__('Bar Horizontal', 'king-addons'),
168	'line' => esc_html__('Line', 'king-addons'),
169	'radar' => esc_html__('Radar', 'king-addons'),
170	'doughnut' => esc_html__('Doughnut', 'king-addons'),
171	'pie' => esc_html__('Pie', 'king-addons'),
172	'polarArea' => esc_html__('Polar Area', 'king-addons'),
173	],
174	'separator' => 'before'
175	]
176	);
177
178	$this->add_control(
179	'data_type',
180	[
181	'label' => esc_html__('Data Grid Type', 'king-addons'),
182	'type' => Controls_Manager::SELECT,
183	'options' => [
184	'linear' => esc_html__('Linear', 'king-addons'),
185	'logarithmic' => esc_html__('Logarithmic', 'king-addons'),
186	],
187	'default' => 'linear',
188	'condition' => [
189	'chart_type' => ['bar', 'bar_horizontal', 'line']
190	],
191	'frontend_available' => true,
192	]
193	);
194
195	$this->add_control(
196	'column_width_x',
197	[
198	'label' => esc_html__('Column Width', 'king-addons'),
199	'type' => Controls_Manager::NUMBER,
200	'default' => 0.5,
201	'step' => 0.1,
202	'min' => 0,
203	'max' => 1,
204	'frontend_available' => true,
205	'separator' => 'before',
206	'condition' => [
207	'chart_type' => ['bar', 'bar_horizontal'],
208	]
209	]
210	);
211
212	$this->add_control(
213	'exclude_dataset_on_click',
214	[
215	'label' => esc_html__('Exclude Data on Legend Click', 'king-addons'),
216	'type' => Controls_Manager::SWITCHER,
217	'default' => 'yes',
218	'return_value' => 'yes',
219	'separator' => 'before'
220	]
221	);
222
223	$this->add_control(
224	'stacked_bar_chart',
225	[
226	'label' => esc_html__('Enable Stacked Chart', 'king-addons'),
227	'type' => Controls_Manager::SWITCHER,
228	'default' => 'yes',
229	'return_value' => 'yes',
230	'condition' => [
231	'chart_type' => ['bar', 'bar_horizontal', 'radar', 'doughnut', 'pie']
232	]
233	]
234	);
235
236	$this->add_control(
237	'inner_datalabels',
238	[
239	'label' => esc_html__('Show Data Values', 'king-addons'),
240	'type' => Controls_Manager::SWITCHER,
241	'default' => 'false',
242	'return_value' => 'true',
243	'condition' => [
244	'chart_type' => ['bar', 'bar_horizontal', 'line', '']
245	]
246	]
247	);
248
249	$this->add_control(
250	'enable_min_max',
251	[
252	'label' => esc_html__('Min-Max Values', 'king-addons'),
253	'type' => Controls_Manager::SWITCHER,
254	'default' => 'no',
255	'return_value' => 'yes',
256	'separator' => 'before',
257	'condition' => [
258	'chart_type!' => ['doughnut', 'polarArea', 'pie'],
259	]
260	]
261	);
262
263	$this->add_control(
264	'min_value',
265	[
266	'label' => esc_html__('Min. Value', 'king-addons'),
267	'type' => Controls_Manager::NUMBER,
268	'default' => -100,
269	'condition' => [
270	'enable_min_max' => 'yes',
271	]
272	]
273	);
274
275	$this->add_control(
276	'max_value',
277	[
278	'label' => esc_html__('Max. Value', 'king-addons'),
279	'type' => Controls_Manager::NUMBER,
280	'default' => 100,
281	'condition' => [
282	'enable_min_max' => 'yes',
283	]
284	]
285	);
286
287	$this->add_control(
288	'animations_heading',
289	[
290	'label' => esc_html__('Animation', 'king-addons'),
291	'type' => Controls_Manager::HEADING,
292	'separator' => 'before',
293	]
294	);
295
296	$this->add_control(
297	'chart_animation',
298	[
299	'label' => esc_html__('Animation', 'king-addons'),
300	'type' => Controls_Manager::SWITCHER,
301	'default' => 'yes',
302	'return_value' => 'yes',
303	'chart_type' => ['line', 'radar']
304	]
305	);
306
307	$this->add_control(
308	'chart_animation_loop',
309	[
310	'label' => esc_html__('Loop', 'king-addons'),
311	'type' => Controls_Manager::SWITCHER,
312	'default' => 'yes',
313	'return_value' => 'yes',
314	'condition' => [
315	'chart_animation' => 'yes',
316	'chart_type' => ['line', 'radar']
317	]
318	]
319	);
320
321	$this->add_control(
322	'chart_animation_duration',
323	[
324	'label' => esc_html__('Animation Duration (ms)', 'king-addons'),
325	'type' => Controls_Manager::NUMBER,
326	'default' => 1000,
327	'min' => 1,
328	'condition' => [
329	'chart_animation' => 'yes',
330	'chart_type' => ['radar', 'line']
331	]
332	]
333	);
334
335	$this->add_control(
336	'animation_transition_type',
337	[
338	'label' => esc_html__('Animation Timing', 'king-addons'),
339	'type' => Controls_Manager::SELECT,
340	'default' => 'linear',
341	'options' => [
342	'linear' => 'linear',
343	'easeInBack' => 'easeInBack',
344	'easeInBounce' => 'easeInBounce',
345	'easeInCirc' => 'easeInCirc',
346	'easeInCubic' => 'easeInCubic',
347	'easeInElastic' => 'easeInElastic',
348	'easeInExpo' => 'easeInExpo',
349	'easeInOutBack' => 'easeInOutBack',
350	'easeInOutBounce' => 'easeInOutBounce',
351	'easeInOutCirc' => 'easeInOutCirc',
352	'easeInOutCubic' => 'easeInOutCubic',
353	'easeInOutElastic' => 'easeInOutElastic',
354	'easeInOutExpo' => 'easeInOutExpo',
355	'easeInOutQuad' => 'easeInOutQuad',
356	'easeInOutQuart' => 'easeInOutQuart',
357	'easeInOutQuint' => 'easeInOutQuint',
358	'easeInOutSine' => 'easeInOutSine',
359	'easeInQuad' => 'easeInQuad',
360	'easeInQuart' => 'easeInQuart',
361	'easeInQuint' => 'easeInQuint',
362	'easeInSine' => 'easeInSine',
363	'easeOutBack' => 'easeOutBack',
364	'easeOutBounce' => 'easeOutBounce',
365	'easeOutCirc' => 'easeOutCirc',
366	'easeOutCubic' => 'easeOutCubic',
367	'easeOutElastic' => 'easeOutElastic',
368	'easeOutExpo' => 'easeOutExpo',
369	'easeOutQuad' => 'easeOutQuad',
370	'easeOutQuart' => 'easeOutQuart',
371	'easeOutQuint' => 'easeOutQuint',
372	'easeOutSine' => 'easeOutSine',
373	],
374	'condition' => [
375	'chart_animation' => 'yes',
376	'chart_type' => ['radar', 'line']
377	]
378	]
379	);
380
381	$this->end_controls_section();
382
383	$this->start_controls_section(
384	'section_chart_data',
385	[
386	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Data', 'king-addons'),
387	'tab' => Controls_Manager::TAB_CONTENT,
388	]
389	);
390
391	$this->add_control(
392	'charts_labels_data', [
393	'label' => esc_html__('Data Labels', 'king-addons'),
394	'type' => Controls_Manager::TEXTAREA,
395	'dynamic' => [
396	'active' => true,
397	],
398	'default' => esc_html__('January, February, March', 'king-addons'),
399	'description' => esc_html__('Enter the comma-separated list of values (Used only with custom data source)', 'king-addons'),
400	'label_block' => true,
401	'condition' => [
402	'data_source' => 'custom',
403
404	],
405	]
406	);
407
408	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
409	$this->add_control(
410	'charts_repeater_labels_data_pro_notice',
411	[
412	'type' => Controls_Manager::RAW_HTML,
413	'raw' => 'More than 3 Data Labels are available<br> in the <strong><a href="https://kingaddons.com/pricing/?ref=kng-module-charts-settings-upgrade-pro" target="_blank">Pro version</a></strong>',
414	'content_classes' => 'king-addons-pro-notice',
415	]
416	);
417	}
418
419	$chart_repeater_labels = new Repeater();
420
421	$chart_repeater_labels->add_control(
422	'chart_data_label', [
423	'label' => esc_html__('Label', 'king-addons'),
424	'type' => Controls_Manager::TEXT,
425	'dynamic' => [
426	'active' => true,
427	],
428	'default' => esc_html__('Label #1', 'king-addons'),
429	'label_block' => true,
430	]
431	);
432
433	$chart_repeater_labels->add_control(
434	'chart_data_set', [
435	'label' => esc_html__('Data', 'king-addons'),
436	'type' => Controls_Manager::TEXT,
437	'dynamic' => [
438	'active' => true,
439	],
440	'default' => '10,23,15',
441	'label_block' => true,
442	'description' => esc_html__("Only works with custom charts. Enter comma separated data values (Shouldn't Exceed number of values provided in Data Labels option).", 'king-addons'),
443	]
444	);
445
446
447	$chart_repeater_labels->start_controls_tabs(
448	'chart_data_bar_background_tab'
449	);
450
451	$chart_repeater_labels->start_controls_tab(
452	'chart_data_bar_background_normal',
453	[
454	'label' => esc_html__('Normal', 'king-addons'),
455	]
456	);
457
458	$chart_repeater_labels->add_control(
459	'chart_data_background_color', [
460	'label' => esc_html__('Background Color', 'king-addons'),
461	'type' => Controls_Manager::COLOR,
462	'default' => '#5B03FF',
463	]
464	);
465
466	$chart_repeater_labels->add_control(
467	'chart_data_border_color', [
468	'label' => esc_html__('Border Color', 'king-addons'),
469	'type' => Controls_Manager::COLOR,
470	'default' => '#5B03FF',
471	]
472	);
473
474	$chart_repeater_labels->end_controls_tab();
475
476
477	$chart_repeater_labels->start_controls_tab(
478	'chart_data_bar_background_hover',
479	[
480	'label' => esc_html__('Hover', 'king-addons'),
481	]
482	);
483	$chart_repeater_labels->add_control(
484	'chart_data_background_color_hover', [
485	'label' => esc_html__('Background Color', 'king-addons'),
486	'type' => Controls_Manager::COLOR,
487	'default' => '#7A7A7ACC'
488	]
489	);
490
491	$chart_repeater_labels->add_control(
492	'chart_data_border_color_hover', [
493	'label' => esc_html__('Border Color', 'king-addons'),
494	'type' => Controls_Manager::COLOR,
495	'default' => '#7A7A7ACC',
496	]
497	);
498	$chart_repeater_labels->end_controls_tab();
499
500	$chart_repeater_labels->end_controls_tabs();
501
502
503	$chart_repeater_labels->add_control(
504	'chart_data_border_width', [
505	'label' => esc_html__('Border Width', 'king-addons'),
506	'type' => Controls_Manager::NUMBER,
507	'default' => '1',
508	]
509	);
510
511	$this->add_control(
512	'charts_data_set',
513	[
514	'label' => esc_html__('Set Data', 'king-addons'),
515	'type' => Controls_Manager::REPEATER,
516	'default' => [
517	[
518	'chart_data_label' => esc_html__('Laptops', 'king-addons'),
519	'chart_data_set' => '13,20,15',
520	'chart_data_background_color' => '#5B03FFCC',
521	'chart_data_border_color' => '#5B03FFCC',
522	'chart_data_border_width' => 1,
523	],
524	[
525	'chart_data_label' => esc_html__('Phones', 'king-addons'),
526	'chart_data_set' => '20,10,33',
527	'chart_data_background_color' => '#E5605BCC',
528	'chart_data_border_color' => '#E5605BCC',
529	'chart_data_border_width' => 1,
530	],
531	[
532	'chart_data_label' => esc_html__('Other', 'king-addons'),
533	'chart_data_set' => '10,3,23',
534	'chart_data_background_color' => '#5BE560CC',
535	'chart_data_border_color' => '#5BE560CC',
536	'chart_data_border_width' => 1,
537	],
538
539	],
540
541	'fields' => $chart_repeater_labels->get_controls(),
542	'title_field' => '{{ chart_data_label }}',
543
544	]
545	);
546
547	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
548	$this->add_control(
549	'charts_repeater_pro_notice',
550	[
551	'type' => Controls_Manager::RAW_HTML,
552	'raw' => 'More than 3 Items are available<br> in the <strong><a href="https://kingaddons.com/pricing/?ref=kng-module-charts-settings-upgrade-pro" target="_blank">Pro version</a></strong>',
553	'content_classes' => 'king-addons-pro-notice',
554	]
555	);
556	}
557
558	$this->end_controls_section();
559
560	$this->start_controls_section(
561	'section_chart_axis_r',
562	[
563	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Axis', 'king-addons'),
564	'tab' => Controls_Manager::TAB_CONTENT,
565	'condition' => [
566	'chart_type' => ['radar', 'polarArea']
567	],
568	]
569	);
570
571	$this->add_control(
572	'r_axis_conditions',
573	[
574	'label' => esc_html__('Axis', 'king-addons'),
575	'type' => Controls_Manager::HEADING,
576	'separator' => 'before'
577	]
578	);
579
580	$this->add_control(
581	'display_r_axis',
582	[
583	'label' => esc_html__('Grid Lines', 'king-addons'),
584	'type' => Controls_Manager::SWITCHER,
585	'default' => 'true',
586	'return_value' => 'true'
587	]
588	);
589
590	$this->add_control(
591	'grid_line_width_r', [
592	'label' => esc_html__('Grid Line Width', 'king-addons'),
593	'type' => Controls_Manager::NUMBER,
594	'default' => '1',
595	'step' => 0.1,
596	'condition' => [
597	'display_r_axis' => 'true'
598	]
599	]
600	);
601
602	$this->add_control(
603	'display_r_ticks',
604	[
605	'label' => esc_html__('Ticks (Labels)', 'king-addons'),
606	'type' => Controls_Manager::SWITCHER,
607	'default' => 'true',
608	'return_value' => 'true'
609	]
610	);
611
612	$this->add_control(
613	'r_step_size',
614	[
615	'label' => esc_html__('Step Size', 'king-addons'),
616	'type' => Controls_Manager::NUMBER,
617	'min' => 0,
618	'max' => 360,
619	'default' => 0,
620	'frontend_available' => true,
621	'condition' => [
622	'display_r_ticks' => 'true'
623	]
624	]
625	);
626
627	$this->add_control(
628	'border_dash_length_r', [
629	'label' => esc_html__('Border Dash length', 'king-addons'),
630	'type' => Controls_Manager::NUMBER,
631	'default' => '1',
632	'separator' => 'before',
633	]
634	);
635
636	$this->add_control(
637	'border_dash_spacing_r', [
638	'label' => esc_html__('Border Dash spacing', 'king-addons'),
639	'type' => Controls_Manager::NUMBER,
640	'default' => '1'
641	]
642	);
643
644	$this->add_control(
645	'border_dash_offset_r', [
646	'label' => esc_html__('Border Dash offset', 'king-addons'),
647	'type' => Controls_Manager::NUMBER,
648	'default' => '1'
649	]
650	);
651
652	$this->end_controls_section();
653
654	$this->start_controls_section(
655	'section_chart_axis',
656	[
657	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Axis', 'king-addons'),
658	'tab' => Controls_Manager::TAB_CONTENT,
659	'condition' => [
660	'chart_type' => ['bar', 'bar_horizontal', 'line']
661	],
662	]
663	);
664
665	$this->add_control(
666	'x_axis_conditions',
667	[
668	'label' => esc_html__('X-Axis', 'king-addons'),
669	'type' => Controls_Manager::HEADING,
670	]
671	);
672
673	$this->add_control(
674	'display_x_axis',
675	[
676	'label' => esc_html__('Grid Lines', 'king-addons'),
677	'type' => Controls_Manager::SWITCHER,
678	'default' => 'true',
679	'return_value' => 'true',
680	]
681	);
682
683	$this->add_control(
684	'grid_line_width_x', [
685	'label' => esc_html__('Grid Line Width', 'king-addons'),
686	'type' => Controls_Manager::NUMBER,
687	'default' => '1',
688	'step' => 0.1,
689	'condition' => [
690	'display_x_axis' => 'true'
691	]
692	]
693	);
694
695	$this->add_control(
696	'display_x_ticks',
697	[
698	'label' => esc_html__('Ticks (Labels)', 'king-addons'),
699	'type' => Controls_Manager::SWITCHER,
700	'default' => 'true',
701	'return_value' => 'true'
702	]
703	);
704
705	$this->add_control(
706	'x_step_size',
707	[
708	'label' => esc_html__('Step Size', 'king-addons'),
709	'type' => Controls_Manager::NUMBER,
710	'min' => 0,
711	'max' => 360,
712	'default' => 0,
713	'frontend_available' => true,
714	'condition' => [
715	'display_x_ticks' => 'true'
716	]
717	]
718	);
719
720	$this->add_control(
721	'display_x_axis_title',
722	[
723	'label' => esc_html__('Show Title', 'king-addons'),
724	'type' => Controls_Manager::SWITCHER,
725	'default' => 'true',
726	'return_value' => 'true'
727	]
728	);
729
730	$this->add_control(
731	'x_axis_title',
732	[
733	'label' => esc_html__('Title', 'king-addons'),
734	'type' => Controls_Manager::TEXT,
735	'dynamic' => [
736	'active' => true,
737	],
738	'placeholder' => esc_html__('X-Axis', 'king-addons'),
739	'default' => esc_html__('X-Axis', 'king-addons'),
740	'condition' => [
741	'display_x_axis_title' => 'true'
742	]
743	]
744	);
745
746	$this->add_control(
747	'labels_rotation_x_axis',
748	[
749	'label' => esc_html__('Ticks (Labels) Rotation', 'king-addons'),
750	'type' => Controls_Manager::NUMBER,
751	'min' => 0,
752	'max' => 360,
753	'default' => 0,
754	'frontend_available' => true
755	]
756	);
757
758	$this->add_control(
759	'y_axis_conditions',
760	[
761	'label' => esc_html__('Y-Axis', 'king-addons'),
762	'type' => Controls_Manager::HEADING,
763	'separator' => 'before'
764	]
765	);
766
767	$this->add_control(
768	'display_y_axis',
769	[
770	'label' => esc_html__('Grid Lines', 'king-addons'),
771	'type' => Controls_Manager::SWITCHER,
772	'default' => 'true',
773	'return_value' => 'true'
774	]
775	);
776
777	$this->add_control(
778	'grid_line_width_y', [
779	'label' => esc_html__('Grid Line Width', 'king-addons'),
780	'type' => Controls_Manager::NUMBER,
781	'default' => '1',
782	'step' => 0.1,
783	'condition' => [
784	'display_y_axis' => 'true'
785	]
786	]
787	);
788
789	$this->add_control(
790	'display_y_ticks',
791	[
792	'label' => esc_html__('Ticks (Labels)', 'king-addons'),
793	'type' => Controls_Manager::SWITCHER,
794	'default' => 'true',
795	'return_value' => 'true'
796	]
797	);
798
799	$this->add_control(
800	'y_step_size',
801	[
802	'label' => esc_html__('Step Size', 'king-addons'),
803	'type' => Controls_Manager::NUMBER,
804	'min' => 0,
805	'max' => 360,
806	'default' => 0,
807	'frontend_available' => true,
808	'condition' => [
809	'display_y_ticks' => 'true'
810	]
811	]
812	);
813
814	$this->add_control(
815	'display_y_axis_title',
816	[
817	'label' => esc_html__('Show Title', 'king-addons'),
818	'type' => Controls_Manager::SWITCHER,
819	'default' => 'true',
820	'return_value' => 'true'
821	]
822	);
823
824	$this->add_control(
825	'y_axis_title',
826	[
827	'label' => esc_html__('Title', 'king-addons'),
828	'type' => Controls_Manager::TEXT,
829	'dynamic' => [
830	'active' => true,
831	],
832	'placeholder' => esc_html__('Y-Axis', 'king-addons'),
833	'default' => esc_html__('Y-Axis', 'king-addons'),
834	'condition' => [
835	'display_y_axis_title' => 'true'
836	]
837	]
838	);
839
840	$this->add_control(
841	'labels_rotation_y_axis',
842	[
843	'label' => esc_html__('Ticks (Labels) Rotation', 'king-addons'),
844	'type' => Controls_Manager::NUMBER,
845	'min' => 0,
846	'max' => 360,
847	'default' => 0,
848	'frontend_available' => true
849	]
850	);
851
852	$this->add_control(
853	'reverse_x',
854	[
855	'label' => esc_html__('Reverse Charts', 'king-addons'),
856	'type' => Controls_Manager::SWITCHER,
857	'default' => 'no',
858	'return_value' => 'yes',
859	'separator' => 'before',
860	'condition' => [
861	'show_chart_legend' => 'yes',
862	'chart_type' => 'bar_horizontal'
863	]
864	]
865	);
866
867	$this->add_control(
868	'reverse_y',
869	[
870	'label' => esc_html__('Reverse Charts', 'king-addons'),
871	'type' => Controls_Manager::SWITCHER,
872	'default' => 'no',
873	'return_value' => 'yes',
874	'separator' => 'before',
875	'condition' => [
876	'show_chart_legend' => 'yes',
877	'chart_type' => ['bar', 'line']
878	]
879	]
880	);
881
882	$this->add_control(
883	'border_dash_length', [
884	'label' => esc_html__('Border Dash length', 'king-addons'),
885	'type' => Controls_Manager::NUMBER,
886	'default' => '1',
887	'separator' => 'before',
888
889	'conditions' => [
890	'relation' => 'or',
891	'terms' => [
892	[
893	'name' => 'display_x_axis',
894	'operator' => '==',
895	'value' => 'true'
896	],
897	[
898	'name' => 'display_y_axis',
899	'operator' => '==',
900	'value' => 'true'
901	]
902	]
903	]
904	]
905	);
906
907	$this->add_control(
908	'border_dash_spacing', [
909	'label' => esc_html__('Border Dash spacing', 'king-addons'),
910	'type' => Controls_Manager::NUMBER,
911	'default' => '1',
912
913	'conditions' => [
914	'relation' => 'or',
915	'terms' => [
916	[
917	'name' => 'display_x_axis',
918	'operator' => '==',
919	'value' => 'true'
920	],
921	[
922	'name' => 'display_y_axis',
923	'operator' => '==',
924	'value' => 'true'
925	]
926	]
927	]
928	]
929	);
930
931	$this->add_control(
932	'border_dash_offset', [
933	'label' => esc_html__('Border Dash offset', 'king-addons'),
934	'type' => Controls_Manager::NUMBER,
935	'default' => '1',
936
937	'conditions' => [
938	'relation' => 'or',
939	'terms' => [
940	[
941	'name' => 'display_x_axis',
942	'operator' => '==',
943	'value' => 'true'
944	],
945	[
946	'name' => 'display_y_axis',
947	'operator' => '==',
948	'value' => 'true'
949	]
950	]
951	]
952	]
953	);
954
955	$this->end_controls_section();
956
957	$this->start_controls_section(
958	'section_chart_title',
959	[
960	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Title', 'king-addons'),
961	'tab' => Controls_Manager::TAB_CONTENT,
962	]
963	);
964
965	$this->add_control(
966	'show_chart_title',
967	[
968	'label' => esc_html__('Show Title', 'king-addons'),
969	'type' => Controls_Manager::SWITCHER,
970	'return_value' => 'yes'
971	]
972	);
973
974	$this->add_control(
975	'chart_title',
976	[
977	'label' => esc_html__('Title', 'king-addons'),
978	'type' => Controls_Manager::TEXT,
979	'dynamic' => [
980	'active' => true,
981	],
982	'placeholder' => esc_html__('To Be Applied', 'king-addons'),
983	'default' => esc_html__('To Be Applied', 'king-addons'),
984	'condition' => [
985	'show_chart_title' => 'yes',
986	],
987	]
988	);
989
990	$this->add_control(
991	'chart_title_position',
992	[
993	'label' => esc_html__('Position', 'king-addons'),
994	'type' => Controls_Manager::SELECT,
995	'default' => 'top',
996	'label_block' => false,
997	'options' => [
998	'top' => esc_html__('Top', 'king-addons'),
999	'right' => esc_html__('Right', 'king-addons'),
1000	'bottom' => esc_html__('Bottom', 'king-addons'),
1001	'left' => esc_html__('Left', 'king-addons'),
1002
1003	],
1004	'condition' => [
1005	'show_chart_title' => 'yes',
1006	]
1007	]
1008	);
1009
1010	$this->add_control(
1011	'chart_title_align',
1012	[
1013	'label' => esc_html__('Align', 'king-addons'),
1014	'type' => Controls_Manager::SELECT,
1015	'default' => 'center',
1016	'label_block' => false,
1017	'options' => [
1018	'start' => esc_html__('Start', 'king-addons'),
1019	'center' => esc_html__('Center', 'king-addons'),
1020	'end' => esc_html__('End', 'king-addons'),
1021	],
1022	'condition' => [
1023	'show_chart_title' => 'yes',
1024	]
1025	]
1026	);
1027
1028	$this->end_controls_section();
1029
1030	$this->start_controls_section(
1031	'section_chart_legend',
1032	[
1033	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Legends', 'king-addons'),
1034	'tab' => Controls_Manager::TAB_CONTENT,
1035	]
1036	);
1037
1038	$this->add_control(
1039	'show_chart_legend',
1040	[
1041	'label' => esc_html__('Show Legends', 'king-addons'),
1042	'type' => Controls_Manager::SWITCHER,
1043	'default' => 'yes',
1044	'return_value' => 'yes',
1045	]
1046	);
1047
1048	$this->add_control(
1049	'reverse_legend',
1050	[
1051	'label' => esc_html__('Reverse', 'king-addons'),
1052	'type' => Controls_Manager::SWITCHER,
1053	'default' => 'no',
1054	'return_value' => 'yes',
1055	'condition' => [
1056	'show_chart_legend' => 'yes',
1057	]
1058	]
1059	);
1060
1061	$this->add_control(
1062	'charts_legend_shape',
1063	[
1064	'label' => esc_html__('Shape', 'king-addons'),
1065	'type' => Controls_Manager::SELECT,
1066	'default' => 'rectangle',
1067	'label_block' => false,
1068	'render_type' => 'template',
1069	'options' => [
1070	'rectangle' => esc_html__('Rectangle', 'king-addons'),
1071	'point' => esc_html__('Point', 'king-addons'),
1072	],
1073	'condition' => [
1074	'show_chart_legend' => 'yes',
1075	]
1076	]
1077	);
1078
1079	$this->add_control(
1080	'charts_legend_position',
1081	[
1082	'label' => esc_html__('Position', 'king-addons'),
1083	'type' => Controls_Manager::SELECT,
1084	'default' => 'top',
1085	'label_block' => false,
1086	'options' => [
1087	'top' => esc_html__('Top', 'king-addons'),
1088	'right' => esc_html__('Right', 'king-addons'),
1089	'bottom' => esc_html__('Bottom', 'king-addons'),
1090	'left' => esc_html__('Left', 'king-addons'),
1091	'chartArea' => esc_html__('chartArea', 'king-addons'),
1092	],
1093	'condition' => [
1094	'show_chart_legend' => 'yes',
1095	]
1096	]
1097	);
1098
1099	$this->add_control(
1100	'charts_legend_align',
1101	[
1102	'label' => esc_html__('Align', 'king-addons'),
1103	'type' => Controls_Manager::SELECT,
1104	'default' => 'center',
1105	'label_block' => false,
1106	'options' => [
1107	'start' => esc_html__('Start', 'king-addons'),
1108	'center' => esc_html__('Center', 'king-addons'),
1109	'end' => esc_html__('End', 'king-addons'),
1110	],
1111	'condition' => [
1112	'show_chart_legend' => 'yes',
1113	]
1114	]
1115	);
1116
1117	$this->end_controls_section();
1118
1119	$this->start_controls_section(
1120	'section_chart_tooltip',
1121	[
1122	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Tooltip', 'king-addons'),
1123	'tab' => Controls_Manager::TAB_CONTENT,
1124	]
1125	);
1126
1127	$this->add_control(
1128	'show_chart_tooltip',
1129	[
1130	'label' => esc_html__('Show Tooltip', 'king-addons'),
1131	'type' => Controls_Manager::SWITCHER,
1132	'default' => 'yes',
1133	'return_value' => 'yes'
1134	]
1135	);
1136
1137	$this->add_control(
1138	'tooltips_percent',
1139	[
1140	'label' => esc_html__('Convert Values to Percents', 'king-addons'),
1141	'type' => Controls_Manager::SWITCHER,
1142	'return_value' => 'true',
1143	'default' => 'true',
1144	'frontend_available' => true,
1145	'condition' => [
1146	'show_chart_tooltip' => 'yes'
1147	]
1148	]
1149	);
1150
1151	$this->add_control(
1152	'trigger_tooltip_on',
1153	[
1154	'label' => esc_html__('Show Tooltip On', 'king-addons'),
1155	'type' => Controls_Manager::SELECT,
1156	'default' => 'mousemove',
1157	'options' => [
1158	'mousemove' => esc_html__('Hover', 'king-addons'),
1159	'click' => esc_html__('Click', 'king-addons'),
1160	],
1161	'condition' => [
1162	'show_chart_tooltip' => 'yes'
1163	]
1164	]
1165	);
1166
1167	$this->add_control(
1168	'chart_interaction_mode',
1169	[
1170	'label' => esc_html__('Interaction Mode', 'king-addons'),
1171	'type' => Controls_Manager::SELECT,
1172	'default' => 'point',
1173	'options' => [
1174
1175	'point' => esc_html__('Point', 'king-addons'),
1176	'index' => esc_html__('Index', 'king-addons'),
1177	'dataset' => esc_html__('Dataset', 'king-addons'),
1178	],
1179	'condition' => [
1180	'show_chart_tooltip' => 'yes'
1181	]
1182	]
1183	);
1184
1185	$this->add_control(
1186	'chart_tooltip_position',
1187	[
1188	'label' => esc_html__('Position', 'king-addons'),
1189	'type' => Controls_Manager::SELECT,
1190	'default' => 'nearest',
1191	'options' => [
1192	'nearest' => esc_html__('Nearest', 'king-addons'),
1193	'average' => esc_html__('Average', 'king-addons'),
1194	],
1195	'condition' => [
1196	'show_chart_tooltip' => 'yes'
1197	]
1198	]
1199	);
1200
1201	$this->end_controls_section();
1202
1203	$this->start_controls_section(
1204	'section_chart_lines',
1205	[
1206	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Lines', 'king-addons'),
1207	'tab' => Controls_Manager::TAB_CONTENT,
1208	'condition' => [
1209	'chart_type' => ['line', 'radar'],
1210	]
1211	]
1212	);
1213
1214	$this->add_control(
1215	'show_lines',
1216	[
1217	'label' => esc_html__('Show Lines', 'king-addons'),
1218	'type' => Controls_Manager::SWITCHER,
1219	'default' => 'yes',
1220	'return_value' => 'yes',
1221	'separator' => 'before',
1222	]
1223	);
1224
1225	$this->add_control(
1226	'chart_type_line_fill',
1227	[
1228	'label' => esc_html__('Show Background Fill', 'king-addons'),
1229	'type' => Controls_Manager::SWITCHER,
1230	'default' => 'yes',
1231	'return_value' => 'yes',
1232	'condition' => [
1233	'chart_type!' => ['bar', 'bar_horizontal'],
1234	]
1235	]
1236	);
1237
1238	$this->add_control(
1239	'line_dots',
1240	[
1241	'label' => esc_html__('Show Dots', 'king-addons'),
1242	'type' => Controls_Manager::SWITCHER,
1243	'default' => 'yes',
1244	'return_value' => 'yes',
1245	'condition' => [
1246	'chart_type!' => ['bar', 'bar_horizontal'],
1247	]
1248	]
1249	);
1250
1251	$this->add_responsive_control(
1252	'line_dots_radius',
1253	[
1254	'label' => esc_html__('Dots Size', 'king-addons'),
1255	'type' => Controls_Manager::SLIDER,
1256	'devices' => ['desktop', 'mobile'],
1257	'exclude' => ['tablet'],
1258	'range' => [
1259	'px' => [
1260	'min' => 0,
1261	'max' => 50,
1262	],
1263	],
1264	'size_units' => ['px'],
1265	'default' => [
1266	'unit' => 'px',
1267	'size' => 10,
1268	],
1269	'mobile_default' => [
1270	'unit' => 'px',
1271	'size' => 5
1272	],
1273	'condition' => [
1274	'chart_type!' => ['bar', 'bar_horizontal'],
1275	'line_dots' => 'yes',
1276	]
1277	]
1278	);
1279
1280	$this->end_controls_section();
1281
1282	$this->start_controls_section(
1283	'chart_section_style_res',
1284	[
1285	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Responsive', 'king-addons'),
1286	'tab' => Controls_Manager::TAB_CONTENT,
1287	]
1288	);
1289
1290	$this->add_control(
1291	'responsive_chart',
1292	[
1293	'label' => esc_html__('Responsive Layout', 'king-addons'),
1294	'description' => esc_html__('Enables scrollbar on tablet and mobile screens', 'king-addons'),
1295	'default' => 'yes',
1296	'type' => Controls_Manager::SWITCHER,
1297	'selectors' => [
1298	'{{WRAPPER}} .king-addons-charts-container' => 'overflow: auto;',
1299	'{{WRAPPER}} .king-addons-charts-wrapper' => 'position: relative; margin: 0 auto;',
1300	],
1301	]
1302	);
1303
1304
1305	$this->add_responsive_control(
1306	'chart_res_width',
1307	[
1308	'label' => esc_html__('Min Width (px)', 'king-addons'),
1309	'type' => Controls_Manager::SLIDER,
1310	'range' => [
1311	'px' => [
1312	'min' => 0,
1313	'max' => 1600
1314	]
1315	],
1316	'default' => [
1317	'size' => 800,
1318	],
1319	'selectors' => [
1320	'{{WRAPPER}} .king-addons-charts-wrapper' => 'min-width: {{SIZE}}px;',
1321	],
1322	'separator' => 'before',
1323	'condition' => [
1324	'responsive_chart' => 'yes',
1325	],
1326	]
1327	);
1328
1329
1330	$this->add_responsive_control(
1331	'chart_res_height',
1332	[
1333	'label' => esc_html__('Min Height (px)', 'king-addons'),
1334	'type' => Controls_Manager::SLIDER,
1335	'range' => [
1336	'px' => [
1337	'min' => 0,
1338	'max' => 1600
1339	]
1340	],
1341	'default' => [
1342	'size' => 400,
1343	],
1344	'selectors' => [
1345	'{{WRAPPER}} .king-addons-charts-wrapper' => 'min-height: {{SIZE}}px;',
1346	],
1347	'condition' => [
1348	'responsive_chart' => 'yes',
1349	],
1350	]
1351	);
1352
1353	$this->end_controls_section();
1354
1355	Core::renderProFeaturesSection($this, '', Controls_Manager::RAW_HTML, 'charts', [
1356	'Upload CSV File',
1357	'Import CSV File from URL',
1358	'Import Published Google Sheets',
1359	'Add Unlimited Chart Items',
1360	'Add Unlimited Data Labels'
1361	]);
1362
1363	$this->start_controls_section(
1364	'section_datalabels_styles',
1365	[
1366	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Data Values', 'king-addons'),
1367	'tab' => Controls_Manager::TAB_STYLE,
1368	'condition' => [
1369	'inner_datalabels' => 'true'
1370	]
1371	]
1372	);
1373
1374	$this->add_control(
1375	'inner_datalabels_color', [
1376	'label' => esc_html__('Color', 'king-addons'),
1377	'type' => Controls_Manager::COLOR,
1378	'default' => '#FFF',
1379	]
1380	);
1381
1382	$this->add_control(
1383	'inner_datalabels_font_family',
1384	[
1385	'label' => esc_html__('Font Family', 'king-addons'),
1386	'type' => Controls_Manager::FONT,
1387	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
1388	'default' => 'Arial',
1389	]
1390	);
1391
1392	$this->add_control(
1393	'inner_datalabels_font_style',
1394	[
1395	'label' => esc_html__('Font Style', 'king-addons'),
1396	'type' => Controls_Manager::SELECT,
1397	'default' => 'normal',
1398	'options' => [
1399	'normal' => 'Normal',
1400	'italic' => 'Italic',
1401	'oblique' => 'Oblique',
1402	],
1403
1404	]
1405	);
1406
1407	$this->add_control(
1408	'inner_datalabels_font_weight',
1409	[
1410	'label' => esc_html__('Font Weight ', 'king-addons'),
1411	'type' => Controls_Manager::NUMBER,
1412	'min' => 0,
1413	'default' => 600,
1414	'frontend_available' => true
1415	]
1416	);
1417
1418	$this->add_control(
1419	'inner_datalabels_font_size',
1420	[
1421	'label' => esc_html__('Font Size', 'king-addons'),
1422	'type' => Controls_Manager::SLIDER,
1423	'size_units' => ['px'],
1424	'range' => [
1425	'px' => [
1426	'min' => 10,
1427	'max' => 100,
1428	],
1429	],
1430	'default' => [
1431	'unit' => 'px',
1432	'size' => 14,
1433	]
1434	]
1435	);
1436
1437	$this->end_controls_section();
1438
1439	$this->start_controls_section(
1440	'section_styles_chart_axis_r',
1441	[
1442	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Axis', 'king-addons'),
1443	'tab' => Controls_Manager::TAB_STYLE,
1444	'condition' => [
1445	'chart_type' => ['radar', 'polarArea']
1446	],
1447	]
1448	);
1449
1450	$this->add_control(
1451	'r_axis_angle_lines_heading',
1452	[
1453	'label' => esc_html__('Angle Lines', 'king-addons'),
1454	'type' => Controls_Manager::HEADING,
1455	]
1456	);
1457
1458	$this->add_control(
1459	'angle_lines_color', [
1460	'label' => esc_html__('Color', 'king-addons'),
1461	'type' => Controls_Manager::COLOR,
1462	'default' => '#E7E7E7'
1463	]
1464	);
1465
1466	$this->add_control(
1467	'r_axis_grid_lines_heading',
1468	[
1469	'label' => esc_html__('Grid Lines', 'king-addons'),
1470	'type' => Controls_Manager::HEADING,
1471	'separator' => 'before',
1472	]
1473	);
1474
1475	$this->add_control(
1476	'axis_grid_line_color_r', [
1477	'label' => esc_html__('Color', 'king-addons'),
1478	'type' => Controls_Manager::COLOR,
1479	'default' => '#E7E7E7'
1480	]
1481	);
1482
1483	$this->add_control(
1484	'axis_labels_heading',
1485	[
1486	'label' => esc_html__('Axis Labels', 'king-addons'),
1487	'type' => Controls_Manager::HEADING,
1488	'separator' => 'before',
1489	]
1490	);
1491
1492	$this->add_control(
1493	'axis_labels_color', [
1494	'label' => esc_html__('Color', 'king-addons'),
1495	'type' => Controls_Manager::COLOR,
1496	'default' => '#222222'
1497	]
1498	);
1499
1500	$this->add_control(
1501	'axis_labels_bg_color', [
1502	'label' => esc_html__('Background Color', 'king-addons'),
1503	'type' => Controls_Manager::COLOR,
1504	'default' => '#B2B2B200'
1505	]
1506	);
1507
1508	$this->add_control(
1509	'axis_labels_padding',
1510	[
1511	'label' => esc_html__('Padding', 'king-addons'),
1512	'type' => Controls_Manager::SLIDER,
1513	'size_units' => ['px'],
1514	'range' => [
1515	'px' => [
1516	'min' => 0,
1517	'max' => 100,
1518	],
1519	],
1520	'default' => [
1521	'unit' => 'px',
1522	'size' => 5,
1523	],
1524	]
1525	);
1526
1527	$this->add_control(
1528	'chart_point_labels_heading',
1529	[
1530	'label' => esc_html__('Ticks', 'king-addons'),
1531	'type' => Controls_Manager::HEADING,
1532	'separator' => 'before'
1533	]
1534	);
1535
1536	$this->add_control(
1537	'chart_point_labels_color_r', [
1538	'label' => esc_html__('Color', 'king-addons'),
1539	'type' => Controls_Manager::COLOR,
1540	'default' => '#B2B2B2'
1541	]
1542	);
1543
1544	$this->add_control(
1545	'point_labels_font_family_r',
1546	[
1547	'label' => esc_html__('Font Family', 'king-addons'),
1548	'type' => Controls_Manager::FONT,
1549	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
1550	'default' => 'Arial',
1551	]
1552	);
1553
1554	$this->add_control(
1555	'point_labels_font_style_r',
1556	[
1557	'label' => esc_html__('Font Style', 'king-addons'),
1558	'type' => Controls_Manager::SELECT,
1559	'default' => 'normal',
1560	'options' => [
1561	'normal' => 'Normal',
1562	'italic' => 'Italic',
1563	'oblique' => 'Oblique',
1564	],
1565
1566	]
1567	);
1568
1569	$this->add_control(
1570	'point_labels_font_weight_r',
1571	[
1572	'label' => esc_html__('Font Weight ', 'king-addons'),
1573	'type' => Controls_Manager::NUMBER,
1574	'min' => 0,
1575	'default' => 600,
1576	'frontend_available' => true,
1577	]
1578	);
1579
1580	$this->add_control(
1581	'point_labels_font_size_r',
1582	[
1583	'label' => esc_html__('Font Size', 'king-addons'),
1584	'type' => Controls_Manager::SLIDER,
1585	'size_units' => ['px'],
1586	'range' => [
1587	'px' => [
1588	'min' => 10,
1589	'max' => 100,
1590	],
1591	],
1592	'default' => [
1593	'unit' => 'px',
1594	'size' => 14,
1595	],
1596	]
1597	);
1598
1599	$this->end_controls_section();
1600
1601	$this->start_controls_section(
1602	'section_chart_axis_styles',
1603	[
1604	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Axis', 'king-addons'),
1605	'tab' => Controls_Manager::TAB_STYLE,
1606	'condition' => [
1607	'chart_type' => ['bar', 'bar_horizontal', 'line']
1608	],
1609	]
1610	);
1611
1612	$this->add_control(
1613	'x_axis_grid_lines_heading',
1614	[
1615	'label' => esc_html__('Grid Lines (X)', 'king-addons'),
1616	'type' => Controls_Manager::HEADING,
1617	'separator' => 'before',
1618	]
1619	);
1620
1621	$this->add_control(
1622	'axis_grid_line_color_x', [
1623	'label' => esc_html__('Color (X)', 'king-addons'),
1624	'type' => Controls_Manager::COLOR,
1625	'default' => '#999999'
1626	]
1627	);
1628
1629	$this->add_control(
1630	'y_axis_grid_lines_heading',
1631	[
1632	'label' => esc_html__('Grid Lines (Y)', 'king-addons'),
1633	'type' => Controls_Manager::HEADING,
1634	'separator' => 'before',
1635	]
1636	);
1637
1638	$this->add_control(
1639	'axis_grid_line_color_y', [
1640	'label' => esc_html__('Color (Y)', 'king-addons'),
1641	'type' => Controls_Manager::COLOR,
1642	'default' => '#999999'
1643	]
1644	);
1645
1646	$this->add_control(
1647	'x_axis_title_styles_heading',
1648	[
1649	'label' => esc_html__('X-Title', 'king-addons'),
1650	'type' => Controls_Manager::HEADING,
1651	'separator' => 'before',
1652	]
1653	);
1654
1655	$this->add_control(
1656	'axis_title_color_x', [
1657	'label' => esc_html__('Color (X)', 'king-addons'),
1658	'type' => Controls_Manager::COLOR,
1659	'default' => '#C0C0C0'
1660	]
1661	);
1662
1663	$this->add_control(
1664	'axis_title_font_family_x',
1665	[
1666	'label' => esc_html__('Font Family', 'king-addons'),
1667	'type' => Controls_Manager::FONT,
1668	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
1669	'default' => 'Arial',
1670	]
1671	);
1672
1673	$this->add_control(
1674	'axis_title_font_style_x',
1675	[
1676	'label' => esc_html__('Font Style', 'king-addons'),
1677	'type' => Controls_Manager::SELECT,
1678	'default' => 'normal',
1679	'options' => [
1680	'normal' => 'Normal',
1681	'italic' => 'Italic',
1682	'oblique' => 'Oblique',
1683	],
1684
1685	]
1686	);
1687
1688	$this->add_control(
1689	'axis_title_font_weight_x',
1690	[
1691	'label' => esc_html__('Font Weight ', 'king-addons'),
1692	'type' => Controls_Manager::NUMBER,
1693	'min' => 0,
1694	'default' => 600,
1695	'frontend_available' => true,
1696	]
1697	);
1698
1699	$this->add_control(
1700	'axis_title_font_size_x',
1701	[
1702	'label' => esc_html__('Font Size', 'king-addons'),
1703	'type' => Controls_Manager::SLIDER,
1704	'size_units' => ['px'],
1705	'range' => [
1706	'px' => [
1707	'min' => 10,
1708	'max' => 100,
1709	],
1710	],
1711	'default' => [
1712	'unit' => 'px',
1713	'size' => 14,
1714	],
1715	]
1716	);
1717
1718	$this->add_control(
1719	'y_axis_title_styles_heading',
1720	[
1721	'label' => esc_html__('Y-Title', 'king-addons'),
1722	'type' => Controls_Manager::HEADING,
1723	'separator' => 'before',
1724	]
1725	);
1726
1727	$this->add_control(
1728	'axis_title_color_y', [
1729	'label' => esc_html__('Color (Y)', 'king-addons'),
1730	'type' => Controls_Manager::COLOR,
1731	'default' => '#C0C0C0'
1732	]
1733	);
1734
1735	$this->add_control(
1736	'axis_title_font_family_y',
1737	[
1738	'label' => esc_html__('Font Family', 'king-addons'),
1739	'type' => Controls_Manager::FONT,
1740	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
1741	'default' => 'Arial',
1742	]
1743	);
1744
1745	$this->add_control(
1746	'axis_title_font_style_y',
1747	[
1748	'label' => esc_html__('Font Style', 'king-addons'),
1749	'type' => Controls_Manager::SELECT,
1750	'default' => 'normal',
1751	'options' => [
1752	'normal' => 'Normal',
1753	'italic' => 'Italic',
1754	'oblique' => 'Oblique',
1755	],
1756
1757	]
1758	);
1759
1760	$this->add_control(
1761	'axis_title_font_weight_y',
1762	[
1763	'label' => esc_html__('Font Weight ', 'king-addons'),
1764	'type' => Controls_Manager::NUMBER,
1765	'min' => 0,
1766	'default' => 600,
1767	'frontend_available' => true,
1768	]
1769	);
1770
1771	$this->add_control(
1772	'axis_title_font_size_y',
1773	[
1774	'label' => esc_html__('Font Size', 'king-addons'),
1775	'type' => Controls_Manager::SLIDER,
1776	'size_units' => ['px'],
1777	'range' => [
1778	'px' => [
1779	'min' => 10,
1780	'max' => 100,
1781	],
1782	],
1783	'default' => [
1784	'unit' => 'px',
1785	'size' => 14,
1786	],
1787	]
1788	);
1789
1790	$this->add_control(
1791	'x_ticks_styles_heading',
1792	[
1793	'label' => esc_html__('X-Ticks', 'king-addons'),
1794	'type' => Controls_Manager::HEADING,
1795	'separator' => 'before',
1796	]
1797	);
1798
1799	$this->add_control(
1800	'chart_ticks_color_x', [
1801	'label' => esc_html__('Ticks Color (X)', 'king-addons'),
1802	'type' => Controls_Manager::COLOR,
1803	]
1804	);
1805
1806	$this->add_control(
1807	'ticks_font_family_x',
1808	[
1809	'label' => esc_html__('Font Family', 'king-addons'),
1810	'type' => Controls_Manager::FONT,
1811	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
1812	'default' => 'Arial',
1813	]
1814	);
1815
1816	$this->add_control(
1817	'ticks_font_style_x',
1818	[
1819	'label' => esc_html__('Font Style', 'king-addons'),
1820	'type' => Controls_Manager::SELECT,
1821	'default' => 'normal',
1822	'options' => [
1823	'normal' => 'Normal',
1824	'italic' => 'Italic',
1825	'oblique' => 'Oblique',
1826	],
1827
1828	]
1829	);
1830
1831	$this->add_control(
1832	'ticks_font_weight_x',
1833	[
1834	'label' => esc_html__('Font Weight ', 'king-addons'),
1835	'type' => Controls_Manager::NUMBER,
1836	'min' => 0,
1837	'default' => 600,
1838	'frontend_available' => true,
1839	]
1840	);
1841
1842	$this->add_control(
1843	'ticks_font_size_x',
1844	[
1845	'label' => esc_html__('Font Size', 'king-addons'),
1846	'type' => Controls_Manager::SLIDER,
1847	'size_units' => ['px'],
1848	'range' => [
1849	'px' => [
1850	'min' => 10,
1851	'max' => 100,
1852	],
1853	],
1854	'default' => [
1855	'unit' => 'px',
1856	'size' => 17,
1857	],
1858	]
1859	);
1860
1861	$this->add_control(
1862	'ticks_padding_x',
1863	[
1864	'label' => esc_html__('Distance', 'king-addons'),
1865	'type' => Controls_Manager::SLIDER,
1866	'range' => [
1867	'px' => [
1868	'min' => 0,
1869	'max' => 50,
1870	],
1871	],
1872	'size_units' => ['px'],
1873	'default' => [
1874	'unit' => 'px',
1875	'size' => 10,
1876	]
1877	]
1878	);
1879
1880	$this->add_control(
1881	'y_ticks_styles_heading',
1882	[
1883	'label' => esc_html__('Y-Ticks', 'king-addons'),
1884	'type' => Controls_Manager::HEADING,
1885	'separator' => 'before',
1886	]
1887	);
1888
1889	$this->add_control(
1890	'chart_ticks_color_y', [
1891	'label' => esc_html__('Ticks Color (Y)', 'king-addons'),
1892	'type' => Controls_Manager::COLOR,
1893	]
1894	);
1895
1896	$this->add_control(
1897	'ticks_font_family_y',
1898	[
1899	'label' => esc_html__('Font Family', 'king-addons'),
1900	'type' => Controls_Manager::FONT,
1901	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
1902	'default' => 'Arial',
1903	]
1904	);
1905
1906	$this->add_control(
1907	'ticks_font_style_y',
1908	[
1909	'label' => esc_html__('Font Style', 'king-addons'),
1910	'type' => Controls_Manager::SELECT,
1911	'default' => 'normal',
1912	'options' => [
1913	'normal' => 'Normal',
1914	'italic' => 'Italic',
1915	'oblique' => 'Oblique',
1916	],
1917
1918	]
1919	);
1920
1921	$this->add_control(
1922	'ticks_font_weight_y',
1923	[
1924	'label' => esc_html__('Font Weight ', 'king-addons'),
1925	'type' => Controls_Manager::NUMBER,
1926	'min' => 0,
1927	'default' => 600,
1928	'frontend_available' => true,
1929	]
1930	);
1931
1932	$this->add_control(
1933	'ticks_font_size_y',
1934	[
1935	'label' => esc_html__('Font Size', 'king-addons'),
1936	'type' => Controls_Manager::SLIDER,
1937	'size_units' => ['px'],
1938	'range' => [
1939	'px' => [
1940	'min' => 10,
1941	'max' => 100,
1942	],
1943	],
1944	'default' => [
1945	'unit' => 'px',
1946	'size' => 14,
1947	],
1948	]
1949	);
1950
1951	$this->add_control(
1952	'ticks_padding_y',
1953	[
1954	'label' => esc_html__('Distance', 'king-addons'),
1955	'type' => Controls_Manager::SLIDER,
1956	'range' => [
1957	'px' => [
1958	'min' => 0,
1959	'max' => 50,
1960	],
1961	],
1962	'size_units' => ['px'],
1963	'default' => [
1964	'unit' => 'px',
1965	'size' => 10,
1966	]
1967	]
1968	);
1969
1970	$this->end_controls_section();
1971
1972	$this->start_controls_section(
1973	'section_chart_title_styles',
1974	[
1975	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Title', 'king-addons'),
1976	'tab' => Controls_Manager::TAB_STYLE,
1977	'condition' => [
1978	'show_chart_title' => 'yes'
1979	]
1980	]
1981	);
1982
1983	$this->add_control(
1984	'chart_title_color', [
1985	'label' => esc_html__('Color', 'king-addons'),
1986	'type' => Controls_Manager::COLOR,
1987	]
1988	);
1989
1990	$this->add_control(
1991	'title_font_family',
1992	[
1993	'label' => esc_html__('Font Family', 'king-addons'),
1994	'type' => Controls_Manager::FONT,
1995	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
1996	'default' => 'Arial',
1997	]
1998	);
1999
2000	$this->add_control(
2001	'title_font_style',
2002	[
2003	'label' => esc_html__('Font Style', 'king-addons'),
2004	'type' => Controls_Manager::SELECT,
2005	'default' => 'normal',
2006	'options' => [
2007	'normal' => 'Normal',
2008	'italic' => 'Italic',
2009	'oblique' => 'Oblique',
2010	],
2011
2012	]
2013	);
2014
2015	$this->add_control(
2016	'title_font_weight',
2017	[
2018	'label' => esc_html__('Font Weight ', 'king-addons'),
2019	'type' => Controls_Manager::NUMBER,
2020	'min' => 0,
2021	'default' => 600,
2022	'frontend_available' => true,
2023	]
2024	);
2025
2026	$this->add_control(
2027	'title_font_size',
2028	[
2029	'label' => esc_html__('Font Size', 'king-addons'),
2030	'type' => Controls_Manager::SLIDER,
2031	'size_units' => ['px'],
2032	'range' => [
2033	'px' => [
2034	'min' => 10,
2035	'max' => 100,
2036	],
2037	],
2038	'default' => [
2039	'unit' => 'px',
2040	'size' => 14,
2041	],
2042	]
2043	);
2044
2045	$this->add_control(
2046	'chart_title_padding',
2047	[
2048	'label' => esc_html__('Padding', 'king-addons'),
2049	'type' => Controls_Manager::SLIDER,
2050	'range' => [
2051	'px' => [
2052	'min' => 0,
2053	'max' => 50,
2054	],
2055	],
2056	'size_units' => ['px'],
2057	'default' => [
2058	'unit' => 'px',
2059	'size' => 10,
2060	],
2061	]
2062	);
2063
2064	$this->end_controls_section();
2065
2066	$this->start_controls_section(
2067	'section_chart_legend_styles',
2068	[
2069	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Legend', 'king-addons'),
2070	'tab' => Controls_Manager::TAB_STYLE,
2071	]
2072	);
2073
2074	$this->add_control(
2075	'chart_legend_text_color', [
2076	'label' => esc_html__('Color', 'king-addons'),
2077	'type' => Controls_Manager::COLOR,
2078	'default' => '#222222'
2079	]
2080	);
2081
2082	$this->add_control(
2083	'legend_font_family',
2084	[
2085	'label' => esc_html__('Font Family', 'king-addons'),
2086	'type' => Controls_Manager::FONT,
2087	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
2088	'default' => 'Arial',
2089	]
2090	);
2091
2092	$this->add_control(
2093	'legend_font_style',
2094	[
2095	'label' => esc_html__('Font Style', 'king-addons'),
2096	'type' => Controls_Manager::SELECT,
2097	'default' => 'normal',
2098	'options' => [
2099	'normal' => 'Normal',
2100	'italic' => 'Italic',
2101	'oblique' => 'Oblique',
2102	],
2103
2104	]
2105	);
2106
2107	$this->add_control(
2108	'legend_font_weight',
2109	[
2110	'label' => esc_html__('Font Weight ', 'king-addons'),
2111	'type' => Controls_Manager::NUMBER,
2112	'min' => 0,
2113	'default' => 600,
2114	'frontend_available' => true,
2115	]
2116	);
2117
2118	$this->add_control(
2119	'legend_font_size',
2120	[
2121	'label' => esc_html__('Font Size', 'king-addons'),
2122	'type' => Controls_Manager::SLIDER,
2123	'size_units' => ['px'],
2124	'range' => [
2125	'px' => [
2126	'min' => 10,
2127	'max' => 100,
2128	],
2129	],
2130	'default' => [
2131	'unit' => 'px',
2132	'size' => 14,
2133	],
2134	]
2135	);
2136
2137	$this->add_control(
2138	'legend_box_width',
2139	[
2140	'label' => esc_html__('Box Size', 'king-addons'),
2141	'type' => Controls_Manager::SLIDER,
2142	'range' => [
2143	'px' => [
2144	'min' => 0,
2145	'max' => 200,
2146	],
2147	],
2148	'size_units' => ['px'],
2149	'default' => [
2150	'unit' => 'px',
2151	'size' => 40,
2152	]
2153	]
2154	);
2155
2156	$this->add_control(
2157	'chart_legend_padding',
2158	[
2159	'label' => esc_html__('Gutter', 'king-addons'),
2160	'type' => Controls_Manager::SLIDER,
2161	'range' => [
2162	'px' => [
2163	'min' => 0,
2164	'max' => 50,
2165	],
2166	],
2167	'size_units' => ['px'],
2168	'default' => [
2169	'unit' => 'px',
2170	'size' => 10,
2171	],
2172	]
2173	);
2174
2175	$this->end_controls_section();
2176
2177	$this->start_controls_section(
2178	'section_chart_tooltip_styles',
2179	[
2180	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Tooltip', 'king-addons'),
2181	'tab' => Controls_Manager::TAB_STYLE,
2182	'condition' => [
2183	'show_chart_tooltip' => 'yes'
2184	]
2185	]
2186	);
2187
2188	$this->add_control(
2189	'chart_tooltip_bg_color', [
2190	'label' => esc_html__('Background Color', 'king-addons'),
2191	'type' => Controls_Manager::COLOR,
2192	]
2193	);
2194
2195	$this->add_control(
2196	'tooltip_padding',
2197	[
2198	'label' => esc_html__('Padding', 'king-addons'),
2199	'type' => Controls_Manager::SLIDER,
2200	'size_units' => ['px'],
2201	'range' => [
2202	'px' => [
2203	'min' => 0,
2204	'max' => 100,
2205	],
2206	],
2207	'default' => [
2208	'unit' => 'px',
2209	'size' => 5,
2210	],
2211	]
2212	);
2213
2214	$this->add_responsive_control(
2215	'tooltip_caret_size',
2216	[
2217	'label' => esc_html__('Triangle Size', 'king-addons'),
2218	'type' => Controls_Manager::SLIDER,
2219	'devices' => ['desktop', 'mobile'],
2220	'size_units' => ['px'],
2221	'range' => [
2222	'px' => [
2223	'min' => 0,
2224	'max' => 100,
2225	],
2226	],
2227	'default' => [
2228	'unit' => 'px',
2229	'size' => 10,
2230	],
2231	'mobile_default' => [
2232	'unit' => 'px',
2233	'size' => 6,
2234	],
2235	]
2236	);
2237
2238	$this->add_control(
2239	'tooltip_title_heading',
2240	[
2241	'label' => esc_html__('Tooltip Title', 'king-addons'),
2242	'type' => Controls_Manager::HEADING,
2243	'separator' => 'before',
2244	]
2245	);
2246
2247	$this->add_control(
2248	'chart_tooltip_title_color', [
2249	'label' => esc_html__('Title Color', 'king-addons'),
2250	'type' => Controls_Manager::COLOR,
2251	'default' => '#FFF'
2252	]
2253	);
2254
2255	$this->add_control(
2256	'chart_tooltip_title_font',
2257	[
2258	'label' => esc_html__('Font Family', 'king-addons'),
2259	'type' => Controls_Manager::FONT,
2260	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
2261	'default' => 'Arial',
2262	]
2263	);
2264
2265	$this->add_control(
2266	'chart_tooltip_title_font_size',
2267	[
2268	'label' => esc_html__('Font Size', 'king-addons'),
2269	'type' => Controls_Manager::SLIDER,
2270	'size_units' => ['px'],
2271	'range' => [
2272	'px' => [
2273	'min' => 10,
2274	'max' => 100,
2275	],
2276	],
2277	'default' => [
2278	'unit' => 'px',
2279	'size' => 14,
2280	],
2281	'separator' => 'before'
2282	]
2283	);
2284
2285	$this->add_control(
2286	'chart_tooltip_title_margin_bottom',
2287	[
2288	'label' => esc_html__('Title Spacing', 'king-addons'),
2289	'type' => Controls_Manager::SLIDER,
2290	'range' => [
2291	'px' => [
2292	'min' => 0,
2293	'max' => 50,
2294	],
2295	],
2296	'size_units' => ['px'],
2297	'default' => [
2298	'unit' => 'px',
2299	'size' => 10,
2300	],
2301	]
2302	);
2303
2304	$this->add_control(
2305	'chart_tooltip_title_align',
2306	[
2307	'label' => esc_html__('Title Alignment', 'king-addons'),
2308	'type' => Controls_Manager::CHOOSE,
2309	'default' => 'center',
2310	'label_block' => false,
2311	'options' => [
2312	'left' => [
2313	'title' => esc_html__('Left', 'king-addons'),
2314	'icon' => 'eicon-text-align-left',
2315	],
2316	'center' => [
2317	'title' => esc_html__('Center', 'king-addons'),
2318	'icon' => 'eicon-text-align-center',
2319	],
2320	'right' => [
2321	'title' => esc_html__('Right', 'king-addons'),
2322	'icon' => 'eicon-text-align-right',
2323	],
2324	],
2325	'separator' => 'before'
2326	]
2327	);
2328
2329	$this->add_control(
2330	'tooltip_item_heading',
2331	[
2332	'label' => esc_html__('Tooltip Item', 'king-addons'),
2333	'type' => Controls_Manager::HEADING,
2334	'separator' => 'before',
2335	]
2336	);
2337
2338	$this->add_control(
2339	'chart_tooltip_item_color', [
2340	'label' => esc_html__('Item Color', 'king-addons'),
2341	'type' => Controls_Manager::COLOR,
2342	'default' => '#FFF'
2343	]
2344	);
2345
2346	$this->add_control(
2347	'chart_tooltip_item_font',
2348	[
2349	'label' => esc_html__('Font Family', 'king-addons'),
2350	'type' => Controls_Manager::FONT,
2351	'description' => esc_html__('Use only the fonts located under System options group', 'king-addons'),
2352	'default' => 'Arial',
2353	]
2354	);
2355
2356	$this->add_control(
2357	'chart_tooltip_item_font_size',
2358	[
2359	'label' => esc_html__('Font Size', 'king-addons'),
2360	'type' => Controls_Manager::SLIDER,
2361	'size_units' => ['px'],
2362	'range' => [
2363	'px' => [
2364	'min' => 10,
2365	'max' => 100,
2366	],
2367	],
2368	'default' => [
2369	'unit' => 'px',
2370	'size' => 14,
2371	],
2372	'separator' => 'before'
2373	]
2374	);
2375
2376	$this->add_control(
2377	'chart_tooltip_item_spacing',
2378	[
2379	'label' => esc_html__('Item Spacing', 'king-addons'),
2380	'type' => Controls_Manager::SLIDER,
2381	'range' => [
2382	'px' => [
2383	'min' => 0,
2384	'max' => 50,
2385	],
2386	],
2387	'size_units' => ['px'],
2388	'default' => [
2389	'unit' => 'px',
2390	'size' => 10,
2391	],
2392	]
2393	);
2394
2395	$this->add_control(
2396	'chart_tooltip_item_align',
2397	[
2398	'label' => esc_html__('Item Alignment', 'king-addons'),
2399	'type' => Controls_Manager::CHOOSE,
2400	'default' => 'center',
2401	'label_block' => false,
2402	'options' => [
2403	'left' => [
2404	'title' => esc_html__('Left', 'king-addons'),
2405	'icon' => 'eicon-text-align-left',
2406	],
2407	'center' => [
2408	'title' => esc_html__('Center', 'king-addons'),
2409	'icon' => 'eicon-text-align-center',
2410	],
2411	'right' => [
2412	'title' => esc_html__('Right', 'king-addons'),
2413	'icon' => 'eicon-text-align-right',
2414	],
2415	],
2416	'separator' => 'before'
2417	]
2418	);
2419
2420	$this->end_controls_section();
2421	}
2422
2423	protected function render()
2424	{
2425	$settings = $this->get_settings_for_display();
2426	extract($settings);
2427
2428	$premium = king_addons_freemius()->can_use_premium_code__premium_only();
2429	$data_charts_array = [];
2430
2431	if (in_array($chart_type, ['bar', 'bar_horizontal', 'line', 'radar'])) {
2432	if (!empty($charts_labels_data)) {
2433	$labels = explode(',', trim($charts_labels_data));
2434	if (!$premium && count($labels) > 3) {
2435	$labels = array_slice($labels, 0, 3);
2436	}
2437	$data_charts_array['labels'] = $labels;
2438	}
2439
2440	if (is_array($charts_data_set) && count($charts_data_set)) {
2441	foreach ($charts_data_set as $charts_counter => $chart_data) {
2442	if (!$premium && $charts_counter === 3) break;
2443	$data_charts_array['datasets'][] = [
2444	'label' => $chart_data['chart_data_label'],
2445	'data' => array_map('floatval', explode(',', trim($chart_data['chart_data_set'], ','))),
2446	'backgroundColor' => $chart_data['chart_data_background_color'],
2447	'hoverBackgroundColor' => $chart_data['chart_data_background_color_hover'],
2448	'borderColor' => $chart_data['chart_data_border_color'],
2449	'hoverBorderColor' => $chart_data['chart_data_border_color_hover'],
2450	'borderWidth' => $chart_data['chart_data_border_width'],
2451	'barPercentage' => $settings['column_width_x'] ?? '',
2452	'fill' => !empty($settings['chart_type_line_fill']) && 'yes' === $settings['chart_type_line_fill'],
2453	];
2454	}
2455	}
2456	} else {
2457	if (is_array($charts_data_set) && count($charts_data_set) && $settings['data_source'] !== 'csv') {
2458	$chart_data_number_values = $chart_background_colors = $chart_background_hover_colors = [];
2459	$chart_data_border_colors = $chart_data_border_hover_colors = $chart_data_border_width = $chart_data_bar_percentage = [];
2460	$data_charts_array['labels'] = [];
2461
2462	foreach ($charts_data_set as $labels_data) {
2463	if (!$premium && count($data_charts_array['labels']) === 3) break;
2464	$data_charts_array['labels'][] = $labels_data['chart_data_label'];
2465	}
2466
2467	$data_charts_array_test = !empty($charts_labels_data) ? explode(',', trim($charts_labels_data)) : [];
2468
2469	foreach ($data_charts_array_test as $key => $test_data) {
2470	if (!$premium && $key === 3) break;
2471	$chart_data_number_values[$key] = [];
2472	foreach ($charts_data_set as $key_inner => $chart_data) {
2473	if (!$premium && $key_inner === 3) break;
2474	$numbers = array_map('floatval', explode(',', trim($chart_data['chart_data_set'], ',')));
2475	$chart_data_number_values[$key][] = $numbers[$key] ?? '0';
2476	}
2477	}
2478
2479	foreach ($charts_data_set as $key => $chart_data) {
2480	if (!$premium && $key === 3) break;
2481	$chart_background_colors[] = trim($chart_data['chart_data_background_color']);
2482	$chart_background_hover_colors[] = trim($chart_data['chart_data_background_color_hover']);
2483	$chart_data_border_colors[] = trim($chart_data['chart_data_border_color']);
2484	$chart_data_border_hover_colors[] = trim($chart_data['chart_data_border_color_hover']);
2485	$chart_data_border_width[] = trim($chart_data['chart_data_border_width']);
2486	if (!empty($settings['column_width_x'])) {
2487	$chart_data_bar_percentage[] = trim($chart_data['column_width_x']);
2488	}
2489	}
2490
2491	foreach ($data_charts_array_test as $key => $data_test) {
2492	if (!$premium && $key === 3) break;
2493	$data_charts_array['datasets'][] = [
2494	'label' => $data_test,
2495	'data' => $chart_data_number_values[$key],
2496	'backgroundColor' => $chart_background_colors,
2497	'hoverBackgroundColor' => $chart_background_hover_colors,
2498	'borderColor' => $chart_data_border_colors,
2499	'hoverBorderColor' => $chart_data_border_hover_colors,
2500	'borderWidth' => $chart_data_border_width,
2501	'barPercentage' => $chart_data_bar_percentage,
2502	];
2503	}
2504	}
2505	}
2506
2507	$layout_settings = [
2508	'angle_lines_color' => $angle_lines_color ?? '',
2509	'animation_transition_type' => $animation_transition_type,
2510	'axis_grid_line_color_r' => $axis_grid_line_color_r,
2511	'axis_grid_line_color_x' => $axis_grid_line_color_x,
2512	'axis_grid_line_color_y' => $axis_grid_line_color_y,
2513	'axis_labels_bg_color' => $axis_labels_bg_color ?? '',
2514	'axis_labels_color' => $axis_labels_color ?? '',
2515	'axis_labels_padding' => $axis_labels_padding['size'] ?? '',
2516	'axis_title_color_x' => $axis_title_color_x,
2517	'axis_title_color_y' => $axis_title_color_y,
2518	'axis_title_font_family_x' => $axis_title_font_family_x,
2519	'axis_title_font_family_y' => $axis_title_font_family_y,
2520	'axis_title_font_size_x' => $axis_title_font_size_x['size'] ?? '',
2521	'axis_title_font_size_y' => $axis_title_font_size_y['size'] ?? '',
2522	'axis_title_font_style_x' => $axis_title_font_style_x,
2523	'axis_title_font_style_y' => $axis_title_font_style_y,
2524	'axis_title_font_weight_x' => $axis_title_font_weight_x,
2525	'axis_title_font_weight_y' => $axis_title_font_weight_y,
2526	'border_dash_length' => $border_dash_length,
2527	'border_dash_length_r' => $border_dash_length_r,
2528	'border_dash_offset' => $border_dash_offset,
2529	'border_dash_offset_r' => $border_dash_offset_r,
2530	'border_dash_spacing' => $border_dash_spacing,
2531	'border_dash_spacing_r' => $border_dash_spacing_r,
2532	'chart_animation' => $chart_animation ?? '',
2533	'chart_animation_duration' => $chart_animation_duration ?? '',
2534	'chart_animation_loop' => $chart_animation_loop ?? '',
2535	'chart_datasets' => !empty($data_charts_array['datasets']) ? wp_json_encode($data_charts_array['datasets']) : '',
2536	'chart_interaction_mode' => $chart_interaction_mode,
2537	'chart_labels' => $data_charts_array['labels'] ?? '',
2538	'chart_title' => $chart_title ?? '',
2539	'chart_title_align' => $chart_title_align ?? '',
2540	'chart_title_color' => $chart_title_color ?? '',
2541	'chart_title_position' => $chart_title_position ?? '',
2542	'chart_tooltip_bg_color' => $chart_tooltip_bg_color,
2543	'chart_tooltip_item_align' => $chart_tooltip_item_align,
2544	'chart_tooltip_item_color' => $chart_tooltip_item_color,
2545	'chart_tooltip_item_font' => $chart_tooltip_item_font,
2546	'chart_tooltip_item_font_size' => $chart_tooltip_item_font_size['size'] ?? 1,
2547	'chart_tooltip_item_spacing' => $chart_tooltip_item_spacing['size'] ?? 1,
2548	'chart_tooltip_title_align' => $chart_tooltip_title_align,
2549	'chart_tooltip_title_color' => $chart_tooltip_title_color,
2550	'chart_tooltip_title_font' => $chart_tooltip_title_font,
2551	'chart_tooltip_title_font_size' => $chart_tooltip_title_font_size['size'] ?? 1,
2552	'chart_tooltip_title_margin_bottom' => $chart_tooltip_title_margin_bottom['size'] ?? 1,
2553	'chart_type' => $chart_type,
2554	'data_source' => $data_source,
2555	'data_type' => $settings['data_type'] ?? 'linear',
2556	'display_r_axis' => $display_r_axis,
2557	'display_r_ticks' => $display_r_ticks,
2558	'display_x_axis' => $display_x_axis,
2559	'display_x_axis_title' => $display_x_axis_title,
2560	'display_x_ticks' => $display_x_ticks,
2561	'display_y_axis' => $display_y_axis,
2562	'display_y_axis_title' => $display_y_axis_title,
2563	'display_y_ticks' => $display_y_ticks,
2564	'exclude_dataset_on_click' => $exclude_dataset_on_click,
2565	'grid_line_width_r' => $grid_line_width_r,
2566	'grid_line_width_x' => $grid_line_width_x,
2567	'grid_line_width_y' => $grid_line_width_y,
2568	'inner_datalabels' => $inner_datalabels,
2569	'inner_datalabels_color' => $inner_datalabels_color,
2570	'inner_datalabels_font_family' => $inner_datalabels_font_family ?? '',
2571	'inner_datalabels_font_size' => $inner_datalabels_font_size['size'] ?? '',
2572	'inner_datalabels_font_style' => $inner_datalabels_font_style ?? '',
2573	'inner_datalabels_font_weight' => $inner_datalabels_font_weight ?? '',
2574	'legend_align' => $charts_legend_align,
2575	'legend_box_width' => $legend_box_width['size'],
2576	'legend_font_family' => $legend_font_family,
2577	'legend_font_size' => $legend_font_size['size'],
2578	'legend_font_style' => $legend_font_style,
2579	'legend_font_weight' => $legend_font_weight,
2580	'legend_padding' => $chart_legend_padding['size'],
2581	'legend_position' => $charts_legend_position,
2582	'legend_shape' => $charts_legend_shape,
2583	'legend_text_color' => $chart_legend_text_color,
2584	'line_dots' => $line_dots ?? '',
2585	'line_dots_radius' => $line_dots_radius['size'] ?? '',
2586	'line_dots_radius_mobile' => $line_dots_radius_mobile['size'] ?? 0,
2587	'max_value' => $max_value,
2588	'min_value' => $min_value,
2589	'point_labels_color_r' => $chart_point_labels_color_r ?? '',
2590	'point_labels_font_family_r' => $point_labels_font_family_r,
2591	'point_labels_font_size_r' => $point_labels_font_size_r['size'] ?? '',
2592	'point_labels_font_style_r' => $point_labels_font_style_r,
2593	'point_labels_font_weight_r' => $point_labels_font_weight_r,
2594	'r_step_size' => $r_step_size,
2595	'reverse_legend' => $reverse_legend,
2596	'reverse_x' => $reverse_x,
2597	'reverse_y' => $reverse_y,
2598	'rotation_x' => $labels_rotation_x_axis,
2599	'rotation_y' => $labels_rotation_y_axis,
2600	'separator' => $data_csv_separator,
2601	'show_chart_legend' => $show_chart_legend,
2602	'show_chart_title' => $show_chart_title,
2603	'show_chart_tooltip' => $show_chart_tooltip,
2604	'show_lines' => $show_lines ?? '',
2605	'stacked_bar_chart' => $stacked_bar_chart ?? '',
2606	'ticks_color_x' => $chart_ticks_color_x,
2607	'ticks_color_y' => $chart_ticks_color_y ?? '',
2608	'ticks_font_family_x' => $ticks_font_family_x,
2609	'ticks_font_family_y' => $ticks_font_family_y,
2610	'ticks_font_size_x' => $ticks_font_size_x['size'] ?? '',
2611	'ticks_font_size_y' => $ticks_font_size_y['size'] ?? '',
2612	'ticks_font_style_x' => $ticks_font_style_x,
2613	'ticks_font_style_y' => $ticks_font_style_y,
2614	'ticks_font_weight_x' => $ticks_font_weight_x,
2615	'ticks_font_weight_y' => $ticks_font_weight_y,
2616	'ticks_padding_x' => $ticks_padding_x['size'] ?? '',
2617	'ticks_padding_y' => $ticks_padding_y['size'] ?? '',
2618	'title_font_family' => $title_font_family,
2619	'title_font_size' => $title_font_size['size'] ?? '',
2620	'title_font_style' => $title_font_style ?? '',
2621	'title_font_weight' => $title_font_weight,
2622	'title_padding' => $chart_title_padding['size'] ?? '',
2623	'tooltips_percent' => $tooltips_percent,
2624	'tooltip_caret_size' => $tooltip_caret_size['size'] ?? 1,
2625	'tooltip_caret_size_mobile' => $tooltip_caret_size_mobile['size'] ?? 0,
2626	'tooltip_padding' => $tooltip_padding['size'] ?? 1,
2627	'tooltip_position' => $chart_tooltip_position,
2628	'trigger_tooltip_on' => $trigger_tooltip_on,
2629	'url' => !empty($data_source_csv_url) ? $data_source_csv_url : (!empty($data_source_csv_file['url']) ? $data_source_csv_file['url'] : ''),
2630	'x_axis_title' => $x_axis_title,
2631	'x_step_size' => $x_step_size,
2632	'y_axis_title' => $y_axis_title,
2633	'y_step_size' => $y_step_size,
2634	];
2635
2636	$this->add_render_attribute('chart-settings', [
2637	'class' => 'king-addons-charts-container',
2638	'data-settings' => wp_json_encode($layout_settings),
2639	]);
2640
2641	echo '<div ' . $this->get_render_attribute_string('chart-settings') . '>';
2642	if ($data_source === 'csv') {
2643	echo '<span class="king-addons-rotating-plane"></span>';
2644	}
2645	echo '<div class="king-addons-charts-wrapper">';
2646	echo '<canvas class="king-addons-chart"></canvas>';
2647	echo '</div></div>';
2648	}
2649
2650	}