| Current File : //var/www/html/blog/wp-content/plugins/royal-elementor-addons/modules/charts/widgets/wpr-charts.php |
<?php
namespace WprAddons\Modules\Charts\Widgets;
use Elementor\Fonts;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Text_Shadow;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Typography;
use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
use Elementor\Repeater;
use Elementor\Group_Control_Image_Size;
use WprAddons\Classes\Utilities;
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
class Wpr_Charts extends Widget_Base {
public function get_name() {
return 'wpr-charts';
}
public function get_title() {
return esc_html__( 'Charts', 'wpr-addons' );
}
public function get_icon() {
return 'wpr-icon eicon-align-end-v';
}
public function get_categories() {
return [ 'wpr-widgets'];
}
public function get_keywords() {
return [ 'royal', 'line charts', 'radar charts', 'doughnut charts', 'pie charts', 'polararea charts', 'polar charts', 'bar charts', 'horizontal charts', 'vertical charts' ];
}
public function has_widget_inner_wrapper(): bool {
return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
}
public function get_script_depends() {
return [ 'wpr-charts' ];
}
public function get_style_depends() {
return ['wpr-loading-animations-css'];
}
public function get_custom_help_url() {
if ( empty(get_option('wpr_wl_plugin_links')) )
// return 'https://royal-elementor-addons.com/contact/?ref=rea-plugin-panel-grid-help-btn';
return 'https://wordpress.org/support/plugin/royal-elementor-addons/';
}
public function add_control_choose_chart_data_source() {
$this->add_control(
'data_source',
[
'label' => __( 'Data Source', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'default' => 'custom',
'options' => [
'custom' => __( 'Custom', 'wpr-addons' ),
'pro-csv' => 'CSV (Pro)' . __( ' File', 'wpr-addons' ),
],
'frontend_available' => true,
]
);
}
protected function register_controls() {
$this->start_controls_section(
'section_chart_general',
[
'label' => esc_html__( 'General', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
Utilities::wpr_library_buttons( $this, Controls_Manager::RAW_HTML );
$this->add_control_choose_chart_data_source();
Utilities::upgrade_pro_notice( $this, Controls_Manager::RAW_HTML, 'charts', 'data_source', ['pro-csv'] );
$this->add_control(
'csv_source',
[
'label' => __( 'CSV Source', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'default' => 'url',
'options' => [
'url' => __( 'Remote URL', 'wpr-addons' ),
'file' => __( ' File', 'wpr-addons' ),
],
'condition' => [
'data_source' => 'csv',
],
'frontend_available' => true,
]
);
$this->add_control(
'data_csv_separator',
[
'label' => __( 'Separator', 'wpr-addons' ),
'type' => Controls_Manager::TEXT,
'default' => ',',
'label_block' => true,
'condition' => [
'data_source' => 'csv',
],
]
);
$this->add_control(
'data_source_csv_url',
[
'label' => __( 'Remote URL', 'wpr-addons' ),
'type' => Controls_Manager::TEXT,
'dynamic' => [
'active' => true,
],
'label_block' => true,
'condition' => [
'data_source' => 'csv',
'csv_source' => 'url',
],
]
);
$this->add_control(
'data_source_csv_file',
[
'label' => __( 'Upload CSV File', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::MEDIA,
'dynamic' => ['
active' => true,
],
'media_type' => [],
'label_block' => true,
'condition' => [
'data_source' => 'csv',
'csv_source' => 'file',
],
]
);
// chart style
$this->add_control(
'chart_type',
[
'label' => esc_html__('Chart Styles', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'description' => esc_html__('doughnut, pie and polarArea charts only work with custom data source', 'wpr-addons'),
'default' => 'bar',
'options' => [
'bar' => esc_html__('Bar Vertical', 'wpr-addons'),
'bar_horizontal' => esc_html__('Bar Horizontal', 'wpr-addons'),
'line' => esc_html__('Line', 'wpr-addons'),
'radar' => esc_html__('Radar', 'wpr-addons'),
'doughnut' => esc_html__('Doughnut', 'wpr-addons'),
'pie' => esc_html__('Pie', 'wpr-addons'),
'polarArea' => esc_html__('Polar Area', 'wpr-addons'),
],
'separator' => 'before'
]
);
$this->add_control(
'data_type',
[
'label' => __( 'Data Grid Type', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'options' => [
'linear' => __( 'Linear', 'wpr-addons' ),
'logarithmic' => __( 'Logarithmic', 'wpr-addons' ),
],
'default' => 'linear',
'condition' => [
'chart_type' => ['bar', 'bar_horizontal', 'line']
],
'frontend_available' => true,
]
);
$this->add_control(
'column_width_x',
[
'label' => esc_html__( 'Column Width', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'default' => 0.5,
'step' => 0.1,
'min' => 0,
'max' => 1,
'frontend_available' => true,
'separator' => 'before',
'condition' => [
'chart_type' => ['bar', 'bar_horizontal'],
]
]
);
$this->add_control(
'exclude_dataset_on_click',
[
'label' => esc_html__('Exclude Data on Legend Click', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'yes',
'return_value' => 'yes',
'separator' => 'before'
]
);
$this->add_control(
'stacked_bar_chart',
[
'label' => esc_html__('Enable Stacked Chart', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'yes',
'return_value' => 'yes',
'condition' => [
'chart_type' => ['bar', 'bar_horizontal', 'radar', 'doughnut', 'pie']
]
]
);
$this->add_control(
'inner_datalabels',
[
'label' => esc_html__('Show Data Values', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'false',
'return_value' => 'true',
'condition' => [
'chart_type' => ['bar', 'bar_horizontal', 'line', '']
]
]
);
$this->add_control(
'enable_min_max',
[
'label' => esc_html__( 'Min-Max Values', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'no',
'return_value' => 'yes',
'separator' => 'before',
'condition' => [
'chart_type!' => ['doughnut', 'polarArea', 'pie'],
]
]
);
$this->add_control(
'min_value',
[
'label' => esc_html__('Min. Value', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => -100,
'condition' => [
'enable_min_max' => 'yes',
]
]
);
$this->add_control(
'max_value',
[
'label' => esc_html__('Max. Value', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => 100,
'condition' => [
'enable_min_max' => 'yes',
]
]
);
$this->add_control(
'animations_heading',
[
'label' => esc_html__( 'Animation', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'chart_animation',
[
'label' => esc_html__( 'Animation', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'yes',
'return_value' => 'yes',
'chart_type' => ['line', 'radar']
]
);
$this->add_control(
'chart_animation_loop',
[
'label' => esc_html__( 'Loop', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'yes',
'return_value' => 'yes',
'condition' => [
'chart_animation' => 'yes',
'chart_type' => ['line', 'radar']
]
]
);
$this->add_control(
'chart_animation_duration',
[
'label' => esc_html__('Animation Duration', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => 1000,
'condition' => [
'chart_animation' => 'yes',
'chart_type' => ['radar', 'line']
]
]
);
$this->add_control(
'animation_transition_type',
[
'label' => esc_html__('Animation Timing', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'linear',
'options' => [
'linear' => 'linear',
'easeInQuad' => 'easeInQuad',
'easeOutQuad' => 'easeOutQuad',
'easeInOutQuad' => 'easeInOutQuad',
'easeInCubic' => 'easeInCubic',
'easeOutCubic' => 'easeOutCubic',
'easeInOutCubic' => 'easeInOutCubic',
'easeInQuart' => 'easeInQuart',
'easeOutQuart' => 'easeOutQuart',
'easeInOutQuart' => 'easeInOutQuart',
'easeInQuint' => 'easeInQuint',
'easeOutQuint' => 'easeOutQuint',
'easeInOutQuint' => 'easeInOutQuint',
'easeInSine' => 'easeInSine',
'easeOutSine' => 'easeOutSine',
'easeInOutSine' => 'easeInOutSine',
'easeInExpo' => 'easeInExpo',
'easeOutExpo' => 'easeOutExpo',
'easeInOutExpo' => 'easeInOutExpo',
'easeInCirc' => 'easeInCirc',
'easeOutCirc' => 'easeOutCirc',
'easeInOutCirc' => 'easeInOutCirc',
'easeInElastic' => 'easeInElastic',
'easeOutElastic' => 'easeOutElastic',
'easeInOutElastic' => 'easeInOutElastic',
'easeInBack' => 'easeInBack',
'easeOutBack' => 'easeOutBack',
'easeInOutBack' => 'easeInOutBack',
'easeInBounce' => 'easeInBounce',
'easeOutBounce' => 'easeOutBounce',
'easeInOutBounce' => 'easeInOutBounce',
],
'condition' => [
'chart_animation' => 'yes',
'chart_type' => ['radar', 'line']
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_data',
[
'label' => esc_html__( 'Data', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
$this->add_control( //TODO: use this instead of repeater
'charts_labels_data', [
'label' => esc_html__('Data Labels', 'wpr-addons'),
'type' => Controls_Manager::TEXTAREA,
'dynamic' => [
'active' => true,
],
'default' => esc_html__('January, February, March', 'wpr-addons'),
'description' => esc_html__('Enter the comma-separated list of values (Used only with custom data source)', 'wpr-addons'),
'label_block' => true,
'condition' => [
'data_source' => 'custom',
// 'chart_type' => ['bar', 'bar_horizontal', 'line', 'radar']
],
]
);
if ( !defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code() ) {
$this->add_control(
'charts_repeater_labels_data_pro_notice',
[
'type' => Controls_Manager::RAW_HTML,
'raw' => 'More than 3 Data Labels are available<br> in the <strong><a href="https://royal-elementor-addons.com/?ref=rea-plugin-panel-charts-upgrade-pro#purchasepro" target="_blank">Pro version</a></strong>',
// 'raw' => 'More than 4 Slides are available<br> in the <strong><a href="'. admin_url('admin.php?page=wpr-addons-pricing') .'" target="_blank">Pro version</a></strong>',
'content_classes' => 'wpr-pro-notice',
]
);
}
// repeter for data fields
$chart_repeater_labels = new Repeater();
$chart_repeater_labels->add_control(
'chart_data_label', [
'label' => esc_html__('Label', 'wpr-addons'),
'type' => Controls_Manager::TEXT,
'dynamic' => [
'active' => true,
],
'default' => esc_html__('Label #1', 'wpr-addons'),
'label_block' => true,
]
);
$chart_repeater_labels->add_control(
'chart_data_set', [
'label' => esc_html__('Data', 'wpr-addons'),
'type' => Controls_Manager::TEXT,
'dynamic' => [
'active' => true,
],
'default' => '10,23,15',
'label_block' => true,
'description' => esc_html__("Only works with custom charts. Enter comma separated data values (Shouldn't Exceed number of values provided in Data Labels option).", 'wpr-addons'),
]
);
// start tabs section
$chart_repeater_labels->start_controls_tabs(
'chart_data_bar_background_tab'
);
// start normal sections
$chart_repeater_labels->start_controls_tab(
'chart_data_bar_background_normal',
[
'label' => esc_html__('Normal', 'wpr-addons'),
]
);
$chart_repeater_labels->add_control(
'chart_data_background_color', [
'label' => esc_html__('Background Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#605BE5',
]
);
$chart_repeater_labels->add_control(
'chart_data_border_color', [
'label' => esc_html__('Border Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#605BE5',
]
);
$chart_repeater_labels->end_controls_tab();
// end normal sections
// start hover sections
$chart_repeater_labels->start_controls_tab(
'chart_data_bar_background_hover',
[
'label' => esc_html__('Hover', 'wpr-addons'),
]
);
$chart_repeater_labels->add_control(
'chart_data_background_color_hover', [
'label' => esc_html__('Background Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#7A7A7ACC'
]
);
$chart_repeater_labels->add_control(
'chart_data_border_color_hover', [
'label' => esc_html__('Border Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#7A7A7ACC',
]
);
$chart_repeater_labels->end_controls_tab();
// end hover sections
$chart_repeater_labels->end_controls_tabs();
// end tabs section
$chart_repeater_labels->add_control(
'chart_data_border_width', [
'label' => esc_html__('Border Width', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
]
);
$this->add_control(
'charts_data_set',
[
'label' => esc_html__('Set Data', 'wpr-addons'),
'type' => Controls_Manager::REPEATER,
'default' => [
[
'chart_data_label' => esc_html__('Laptops', 'wpr-addons'),
'chart_data_set' => '13,20,15',
'chart_data_background_color' => '#605BE5CC',
'chart_data_border_color' => '#605BE5CC',
'chart_data_border_width' => 1,
],
[
'chart_data_label' => esc_html__('Phones', 'wpr-addons'),
'chart_data_set' => '20,10,33',
'chart_data_background_color' => '#E5605BCC',
'chart_data_border_color' => '#E5605BCC',
'chart_data_border_width' => 1,
],
[
'chart_data_label' => esc_html__('Other', 'wpr-addons'),
'chart_data_set' => '10,3,23',
'chart_data_background_color' => '#5BE560CC',
'chart_data_border_color' => '#5BE560CC',
'chart_data_border_width' => 1,
],
],
'fields' => $chart_repeater_labels->get_controls(),
'title_field' => '{{{ chart_data_label }}}',
// 'condition' => ['chart_style' => ['bar', 'bar_horizontal', 'horizontalBar', 'line', 'radar']],
]
);
if ( !defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code() ) {
$this->add_control(
'charts_repeater_pro_notice',
[
'type' => Controls_Manager::RAW_HTML,
'raw' => 'More than 3 Items are available<br> in the <strong><a href="https://royal-elementor-addons.com/?ref=rea-plugin-panel-charts-upgrade-pro#purchasepro" target="_blank">Pro version</a></strong>',
// 'raw' => 'More than 4 Slides are available<br> in the <strong><a href="'. admin_url('admin.php?page=wpr-addons-pricing') .'" target="_blank">Pro version</a></strong>',
'content_classes' => 'wpr-pro-notice',
]
);
}
$this->end_controls_section();
$this->start_controls_section(
'section_chart_axis_r',
[
'label' => esc_html__( 'Axis', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
'condition' => [
'chart_type' => ['radar', 'polarArea']
],
]
);
$this->add_control(
'r_axis_conditions',
[
'label' => esc_html__( 'Axis', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before'
]
);
$this->add_control(
'display_r_axis',
[
'label' => esc_html__('Grid Lines', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true'
]
);
$this->add_control(
'grid_line_width_r', [
'label' => esc_html__('Grid Line Width', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
'step' => 0.1,
'condition' => [
'display_r_axis' => 'true'
]
]
);
$this->add_control(
'display_r_ticks',
[
'label' => esc_html__('Ticks (Labels)', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true'
]
);
$this->add_control(
'r_step_size',
[
'label' => __( 'Step Size', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'max' => 360,
'default' => 0,
'frontend_available' => true,
'condition' => [
'display_r_ticks' => 'true'
]
]
);
$this->add_control(
'border_dash_length_r', [
'label' => esc_html__('Border Dash length', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
'separator' => 'before',
]
);
$this->add_control(
'border_dash_spacing_r', [
'label' => esc_html__('Border Dash spacing', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1'
]
);
$this->add_control(
'border_dash_offset_r', [
'label' => esc_html__('Border Dash offset', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1'
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_axis',
[
'label' => esc_html__( 'Axis', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
'condition' => [
'chart_type' => ['bar', 'bar_horizontal', 'line']
],
]
);
$this->add_control(
'x_axis_conditions',
[
'label' => esc_html__( 'X-Axis', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
]
);
$this->add_control(
'display_x_axis',
[
'label' => esc_html__('Grid Lines', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true',
]
);
$this->add_control(
'grid_line_width_x', [
'label' => esc_html__('Grid Line Width', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
'step' => 0.1,
'condition' => [
'display_x_axis' => 'true'
]
]
);
$this->add_control(
'display_x_ticks',
[
'label' => esc_html__('Ticks (Labels)', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true'
]
);
$this->add_control(
'x_step_size',
[
'label' => __( 'Step Size', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'max' => 360,
'default' => 0,
'frontend_available' => true,
'condition' => [
'display_x_ticks' => 'true'
]
]
);
$this->add_control(
'display_x_axis_title',
[
'label' => esc_html__('Show Title', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true'
]
);
$this->add_control(
'x_axis_title',
[
'label' => esc_html__( 'Title', 'wpr-addons' ),
'type' => Controls_Manager::TEXT,
'dynamic' => [
'active' => true,
],
'placeholder' => esc_html__( 'X-Axis', 'wpr-addons' ),
'default' => esc_html__('X-Axis', 'wpr-addons'),
'condition' => [
'display_x_axis_title' => 'true'
]
]
);
$this->add_control(
'labels_rotation_x_axis',
[
'label' => __( 'Ticks (Labels) Rotation', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'max' => 360,
'default' => 0,
'frontend_available' => true
]
);
$this->add_control(
'y_axis_conditions',
[
'label' => esc_html__( 'Y-Axis', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before'
]
);
$this->add_control(
'display_y_axis',
[
'label' => esc_html__('Grid Lines', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true'
]
);
$this->add_control(
'grid_line_width_y', [
'label' => esc_html__('Grid Line Width', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
'step' => 0.1,
'condition' => [
'display_y_axis' => 'true'
]
]
);
$this->add_control(
'display_y_ticks',
[
'label' => esc_html__('Ticks (Labels)', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true'
]
);
$this->add_control(
'y_step_size',
[
'label' => __( 'Step Size', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'max' => 360,
'default' => 0,
'frontend_available' => true,
'condition' => [
'display_y_ticks' => 'true'
]
]
);
$this->add_control(
'display_y_axis_title',
[
'label' => esc_html__('Show Title', 'wpr-addons'),
'type' => Controls_Manager::SWITCHER ,
'default' => 'true',
'return_value' => 'true'
]
);
$this->add_control(
'y_axis_title',
[
'label' => esc_html__( 'Title', 'wpr-addons' ),
'type' => Controls_Manager::TEXT,
'dynamic' => [
'active' => true,
],
'placeholder' => esc_html__( 'Y-Axis', 'wpr-addons' ),
'default' => esc_html__('Y-Axis', 'wpr-addons'),
'condition' => [
'display_y_axis_title' => 'true'
]
]
);
$this->add_control(
'labels_rotation_y_axis',
[
'label' => __( 'Ticks (Labels) Rotation', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'max' => 360,
'default' => 0,
'frontend_available' => true
]
);
$this->add_control(
'reverse_x',
[
'label' => esc_html__( 'Reverse Charts', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'no',
'return_value' => 'yes',
'separator' => 'before',
'condition' => [
'show_chart_legend' => 'yes',
'chart_type' => 'bar_horizontal'
]
]
);
$this->add_control(
'reverse_y',
[
'label' => esc_html__( 'Reverse Charts', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'no',
'return_value' => 'yes',
'separator' => 'before',
'condition' => [
'show_chart_legend' => 'yes',
'chart_type' => ['bar', 'line']
]
]
);
$this->add_control(
'border_dash_length', [
'label' => esc_html__('Border Dash length', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
'separator' => 'before',
// 'step' => 0.1,
'conditions' => [
'relation' => 'or',
'terms' => [
[
'name' => 'display_x_axis',
'operator' => '==',
'value' => 'true'
],
[
'name' => 'display_y_axis',
'operator' => '==',
'value' => 'true'
]
]
]
]
);
$this->add_control(
'border_dash_spacing', [
'label' => esc_html__('Border Dash spacing', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
// 'step' => 0.1,
'conditions' => [
'relation' => 'or',
'terms' => [
[
'name' => 'display_x_axis',
'operator' => '==',
'value' => 'true'
],
[
'name' => 'display_y_axis',
'operator' => '==',
'value' => 'true'
]
]
]
]
);
$this->add_control(
'border_dash_offset', [
'label' => esc_html__('Border Dash offset', 'wpr-addons'),
'type' => Controls_Manager::NUMBER,
'default' => '1',
// 'step' => 0.1,
'conditions' => [
'relation' => 'or',
'terms' => [
[
'name' => 'display_x_axis',
'operator' => '==',
'value' => 'true'
],
[
'name' => 'display_y_axis',
'operator' => '==',
'value' => 'true'
]
]
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_title',
[
'label' => esc_html__( 'Title', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
$this->add_control(
'show_chart_title',
[
'label' => esc_html__( 'Show Title', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'return_value' => 'yes'
]
);
$this->add_control(
'chart_title',
[
'label' => esc_html__( 'Title', 'wpr-addons' ),
'type' => Controls_Manager::TEXT,
'dynamic' => [
'active' => true,
],
'placeholder' => esc_html__( 'To Be Applied', 'wpr-addons' ),
'default' => esc_html__('To Be Applied', 'wpr-addons'),
'condition' => [
'show_chart_title' => 'yes',
],
]
);
$this->add_control(
'chart_title_position',
[
'label' => esc_html__( 'Position', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'default' => 'top',
'label_block' => false,
'options' => [
'top' => esc_html__( 'Top', 'wpr-addons' ),
'right' => esc_html__( 'Right', 'wpr-addons' ),
'bottom' => esc_html__( 'Bottom', 'wpr-addons' ),
'left' => esc_html__( 'Left', 'wpr-addons' ),
// 'chartArea' => esc_html__( 'chartArea', 'wpr-addons' ),
],
'condition' => [
'show_chart_title' => 'yes',
]
]
);
$this->add_control(
'chart_title_align',
[
'label' => esc_html__( 'Align', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'default' => 'center',
'label_block' => false,
'options' => [
'start' => esc_html__( 'Start', 'wpr-addons' ),
'center' => esc_html__( 'Center', 'wpr-addons' ),
'end' => esc_html__( 'End', 'wpr-addons' ),
],
'condition' => [
'show_chart_title' => 'yes',
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_legend',
[
'label' => esc_html__( 'Legends', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
$this->add_control(
'show_chart_legend',
[
'label' => esc_html__( 'Show Legends', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'yes',
'return_value' => 'yes',
]
);
$this->add_control(
'reverse_legend',
[
'label' => esc_html__( 'Reverse', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'no',
'return_value' => 'yes',
'condition' => [
'show_chart_legend' => 'yes',
]
]
);
$this->add_control(
'charts_legend_shape',
[
'label' => esc_html__( 'Shape', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'default' => 'rectangle',
'label_block' => false,
'render_type' => 'template',
'options' => [
'rectangle' => esc_html__( 'Rectangle', 'wpr-addons' ),
'point' => esc_html__( 'Point', 'wpr-addons' ),
],
'condition' => [
'show_chart_legend' => 'yes',
]
]
);
$this->add_control(
'charts_legend_position',
[
'label' => esc_html__( 'Position', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'default' => 'top',
'label_block' => false,
'options' => [
'top' => esc_html__( 'Top', 'wpr-addons' ),
'right' => esc_html__( 'Right', 'wpr-addons' ),
'bottom' => esc_html__( 'Bottom', 'wpr-addons' ),
'left' => esc_html__( 'Left', 'wpr-addons' ),
'chartArea' => esc_html__( 'chartArea', 'wpr-addons' ),
],
'condition' => [
'show_chart_legend' => 'yes',
]
]
);
$this->add_control(
'charts_legend_align',
[
'label' => esc_html__( 'Align', 'wpr-addons' ),
'type' => Controls_Manager::SELECT,
'default' => 'center',
'label_block' => false,
'options' => [
'start' => esc_html__( 'Start', 'wpr-addons' ),
'center' => esc_html__( 'Center', 'wpr-addons' ),
'end' => esc_html__( 'End', 'wpr-addons' ),
],
'condition' => [
'show_chart_legend' => 'yes',
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_tooltip',
[
'label' => esc_html__( 'Tooltip', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
$this->add_control(
'show_chart_tooltip',
[
'label' => esc_html__( 'Show Tooltip', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'yes',
'return_value' => 'yes'
]
);
$this->add_control(
'tooltips_percent',
[
'label' => __( 'Convert Values to Percents', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'return_value' => 'true',
'default' => 'true',
'frontend_available' => true,
'condition' => [
'show_chart_tooltip' => 'yes'
]
]
);
$this->add_control(
'trigger_tooltip_on',
[
'label' => esc_html__('Show Tooltip On', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'mousemove',
'options' => [
'mousemove' => esc_html__('Hover', 'wpr-addons'),
'click' => esc_html__('Click', 'wpr-addons'),
],
'condition' => [
'show_chart_tooltip' => 'yes'
]
]
);
$this->add_control(
'chart_interaction_mode',
[
'label' => esc_html__('Interaction Mode', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'point',
'options' => [
// 'nearest' => esc_html__('Nearest', 'wpr-addons'),
'point' => esc_html__('Point', 'wpr-addons'),
'index' => esc_html__('Index', 'wpr-addons'),
'dataset' => esc_html__('Dataset', 'wpr-addons'),
],
'condition' => [
'show_chart_tooltip' => 'yes'
]
]
);
$this->add_control(
'chart_tooltip_position',
[
'label' => esc_html__('Position', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'nearest',
'options' => [
'nearest' => esc_html__('Nearest', 'wpr-addons'),
'average' => esc_html__('Average', 'wpr-addons'),
],
'condition' => [
'show_chart_tooltip' => 'yes'
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_lines',
[
'label' => esc_html__( 'Lines', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
'condition' => [
'chart_type' => ['line', 'radar'],
]
]
);
$this->add_control(
'show_lines',
[
'label' => esc_html__( 'Show Lines', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'yes',
'return_value' => 'yes',
'separator' => 'before',
]
);
$this->add_control(
'chart_type_line_fill',
[
'label' => esc_html__( 'Show Background Fill', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'yes',
'return_value' => 'yes',
'condition' => [
'chart_type!' => ['bar', 'bar_horizontal'],
]
]
);
$this->add_control(
'line_dots',
[
'label' => esc_html__( 'Show Dots', 'wpr-addons' ),
'type' => Controls_Manager::SWITCHER,
'default' => 'yes',
'return_value' => 'yes',
'condition' => [
'chart_type!' => ['bar', 'bar_horizontal'],
]
]
);
$this->add_responsive_control(
'line_dots_radius',
[
'label' => esc_html__( 'Dots Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'devices' => ['desktop', 'mobile'],
'exclude' => ['tablet'],
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 10,
],
'mobile_default' => [
'unit' => 'px',
'size' => 5
],
'condition' => [
'chart_type!' => ['bar', 'bar_horizontal'],
'line_dots' => 'yes',
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'chart_section_style_res',
[
'label' => esc_html__( 'Responsive', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_CONTENT,
]
);
/**
* Control: Enable/Disable
*/
$this->add_control(
'responsive_chart',
[
'label' => esc_html__( 'Responsive Layout', 'wpr-addons' ),
'description' => esc_html__( 'Enables scrollbar on tablet and mobile screens', 'wpr-addons' ),
'default' => 'yes',
'type' => Controls_Manager::SWITCHER,
'selectors' => [
'{{WRAPPER}} .wpr-charts-container' => 'overflow: auto;',
'{{WRAPPER}} .wpr-charts-wrapper' => 'position: relative; margin: 0 auto;',
],
]
);
/**
* Control: Width
*/
$this->add_responsive_control(
'chart_res_width',
[
'label' => esc_html__( 'Min Width (px)', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 1600
]
],
'default' => [
'size' => 800,
],
'selectors' => [
'{{WRAPPER}} .wpr-charts-wrapper' => 'min-width: {{SIZE}}px;',
],
'separator' => 'before',
'condition' => [
'responsive_chart' => 'yes',
],
]
);
/**
* Control: Height
*/
$this->add_responsive_control(
'chart_res_height',
[
'label' => esc_html__( 'Min Height (px)', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 1600
]
],
'default' => [
'size' => 400,
],
'selectors' => [
'{{WRAPPER}} .wpr-charts-wrapper' => 'min-height: {{SIZE}}px;',
],
'condition' => [
'responsive_chart' => 'yes',
],
]
);
$this->end_controls_section();
// Section: Request New Feature
Utilities::wpr_add_section_request_feature( $this, Controls_Manager::RAW_HTML, '' );
// Section: Pro Features
Utilities::pro_features_list_section( $this, '', Controls_Manager::RAW_HTML, 'charts', [
'Upload CSV File',
'Import CSV File from URL',
'Import published Google Sheets',
'Add Unlimited Data Labels',
'Add Unlimited Chart Items'
] );
$this->start_controls_section(
'section_datalabels_styles',
[
'label' => esc_html__( 'Data Values', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_STYLE,
'condition' => [
'inner_datalabels' => 'true'
]
]
);
$this->add_control(
'inner_datalabels_color', [
'label' => esc_html__('Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#FFF',
]
);
// $this->add_control(
// 'inner_datalabels_bg_color', [
// 'label' => esc_html__('Background Color', 'wpr-addons'),
// 'type' => Controls_Manager::COLOR,
// 'default' => '',
// ]
// );
$this->add_control(
'inner_datalabels_font_family',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'inner_datalabels_font_style',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'inner_datalabels_font_weight',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true
]
);
$this->add_control(
'inner_datalabels_font_size',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_styles_chart_axis_r',
[
'label' => esc_html__( 'Axis', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_STYLE,
'condition' => [
'chart_type' => ['radar', 'polarArea']
],
]
);
$this->add_control(
'r_axis_angle_lines_heading',
[
'label' => esc_html__( 'Angle Lines', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
]
);
$this->add_control(
'angle_lines_color', [
'label' => esc_html__('Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#E7E7E7'
]
);
$this->add_control(
'r_axis_grid_lines_heading',
[
'label' => esc_html__( 'Grid Lines', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'axis_grid_line_color_r', [
'label' => esc_html__('Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#E7E7E7'
]
);
$this->add_control(
'axis_labels_heading',
[
'label' => esc_html__( 'Axis Labels', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'axis_labels_color', [
'label' => esc_html__('Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#222222'
]
);
$this->add_control(
'axis_labels_bg_color', [
'label' => esc_html__('Background Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#B2B2B200'
]
);
$this->add_control(
'axis_labels_padding',
[
'label' => esc_html__( 'Padding', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 0,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 5,
],
]
);
$this->add_control(
'chart_point_labels_heading',
[
'label' => esc_html__( 'Ticks', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before'
]
);
$this->add_control(
'chart_point_labels_color_r', [
'label' => esc_html__('Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#B2B2B2'
]
);
$this->add_control(
'point_labels_font_family_r',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'point_labels_font_style_r',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'point_labels_font_weight_r',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true,
]
);
$this->add_control(
'point_labels_font_size_r',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_axis_styles',
[
'label' => esc_html__( 'Axis', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_STYLE,
'condition' => [
'chart_type' => ['bar', 'bar_horizontal', 'line']
],
]
);
$this->add_control(
'x_axis_grid_lines_heading',
[
'label' => esc_html__( 'Grid Lines (X)', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'axis_grid_line_color_x', [
'label' => esc_html__('Color (X)', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#888888'
]
);
$this->add_control(
'y_axis_grid_lines_heading',
[
'label' => esc_html__( 'Grid Lines (Y)', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'axis_grid_line_color_y', [
'label' => esc_html__('Color (Y)', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#888888'
]
);
$this->add_control(
'x_axis_title_styles_heading',
[
'label' => esc_html__( 'X-Title', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'axis_title_color_x', [
'label' => esc_html__('Color (X)', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#C0C0C0'
]
);
$this->add_control(
'axis_title_font_family_x',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'axis_title_font_style_x',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'axis_title_font_weight_x',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true,
]
);
$this->add_control(
'axis_title_font_size_x',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
]
);
$this->add_control(
'y_axis_title_styles_heading',
[
'label' => esc_html__( 'Y-Title', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'axis_title_color_y', [
'label' => esc_html__('Color (Y)', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#C0C0C0'
]
);
$this->add_control(
'axis_title_font_family_y',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'axis_title_font_style_y',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'axis_title_font_weight_y',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true,
]
);
$this->add_control(
'axis_title_font_size_y',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
]
);
$this->add_control(
'x_ticks_styles_heading',
[
'label' => esc_html__( 'X-Ticks', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'chart_ticks_color_x', [
'label' => esc_html__('Ticks Color (X)', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
]
);
$this->add_control(
'ticks_font_family_x',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'ticks_font_style_x',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'ticks_font_weight_x',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true,
]
);
$this->add_control(
'ticks_font_size_x',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 17,
],
]
);
$this->add_control(
'ticks_padding_x',
[
'label' => esc_html__( 'Distance', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 10,
]
]
);
$this->add_control(
'y_ticks_styles_heading',
[
'label' => esc_html__( 'Y-Ticks', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'chart_ticks_color_y', [
'label' => esc_html__('Ticks Color (Y)', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
]
);
$this->add_control(
'ticks_font_family_y',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'ticks_font_style_y',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'ticks_font_weight_y',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true,
]
);
$this->add_control(
'ticks_font_size_y',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
]
);
$this->add_control(
'ticks_padding_y',
[
'label' => esc_html__( 'Distance', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 10,
]
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_title_styles',
[
'label' => esc_html__( 'Title', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_STYLE,
'condition' => [
'show_chart_title' => 'yes'
]
]
);
$this->add_control(
'chart_title_color', [
'label' => esc_html__('Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
]
);
$this->add_control(
'title_font_family',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'title_font_style',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'title_font_weight',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true,
]
);
$this->add_control(
'title_font_size',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
]
);
$this->add_control(
'chart_title_padding',
[
'label' => esc_html__( 'Padding', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 10,
],
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_legend_styles',
[
'label' => esc_html__( 'Legend', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_STYLE,
]
);
$this->add_control(
'chart_legend_text_color', [
'label' => esc_html__('Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#222222'
]
);
$this->add_control(
'legend_font_family',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'legend_font_style',
[
'label' => esc_html__('Font Style', 'wpr-addons'),
'type' => Controls_Manager::SELECT,
'default' => 'normal',
'options' => [
'normal' => 'Normal',
'italic' => 'Italic',
'oblique' => 'Oblique',
],
]
);
$this->add_control(
'legend_font_weight',
[
'label' => __( 'Font Weight ', 'wpr-addons' ),
'type' => Controls_Manager::NUMBER,
'min' => 0,
'default' => 600,
'frontend_available' => true,
]
);
$this->add_control(
'legend_font_size',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
]
);
$this->add_control(
'legend_box_width',
[
'label' => esc_html__( 'Box Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 200,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 40,
]
]
);
$this->add_control(
'chart_legend_padding',
[
'label' => esc_html__( 'Gutter', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 10,
],
]
);
$this->end_controls_section();
$this->start_controls_section(
'section_chart_tooltip_styles',
[
'label' => esc_html__( 'Tooltip', 'wpr-addons' ),
'tab' => Controls_Manager::TAB_STYLE,
'condition' => [
'show_chart_tooltip' => 'yes'
]
]
);
$this->add_control(
'chart_tooltip_bg_color', [
'label' => esc_html__('Background Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
]
);
$this->add_control(
'tooltip_padding',
[
'label' => esc_html__( 'Padding', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 0,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 5,
],
]
);
$this->add_responsive_control(
'tooltip_caret_size',
[
'label' => esc_html__( 'Triangle Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'devices' => ['desktop', 'mobile'],
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 0,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 10,
],
'mobile_default' => [
'unit' => 'px',
'size' => 6,
],
]
);
$this->add_control(
'tooltip_title_heading',
[
'label' => esc_html__( 'Tooltip Title', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'chart_tooltip_title_color', [
'label' => esc_html__('Title Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#FFF'
]
);
$this->add_control(
'chart_tooltip_title_font',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'chart_tooltip_title_font_size',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
'separator' => 'before'
]
);
$this->add_control(
'chart_tooltip_title_margin_bottom',
[
'label' => esc_html__( 'Title Spacing', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 10,
],
]
);
$this->add_control(
'chart_tooltip_title_align',
[
'label' => esc_html__( 'Title Alignment', 'wpr-addons' ),
'type' => Controls_Manager::CHOOSE,
'default' => 'center',
'label_block' => false,
'options' => [
'left' => [
'title' => esc_html__( 'Left', 'wpr-addons' ),
'icon' => 'eicon-text-align-left',
],
'center' => [
'title' => esc_html__( 'Center', 'wpr-addons' ),
'icon' => 'eicon-text-align-center',
],
'right' => [
'title' => esc_html__( 'Right', 'wpr-addons' ),
'icon' => 'eicon-text-align-right',
],
],
'separator' => 'before'
]
);
$this->add_control(
'tooltip_item_heading',
[
'label' => esc_html__( 'Tooltip Item', 'wpr-addons' ),
'type' => Controls_Manager::HEADING,
'separator' => 'before',
]
);
$this->add_control(
'chart_tooltip_item_color', [
'label' => esc_html__('Item Color', 'wpr-addons'),
'type' => Controls_Manager::COLOR,
'default' => '#FFF'
]
);
$this->add_control(
'chart_tooltip_item_font',
[
'label' => esc_html__( 'Font Family', 'wpr-addons' ),
'type' => \Elementor\Controls_Manager::FONT,
'description' => esc_html__('Use only the fonts located under System options group', 'wpr-addons'),
'default' => 'Arial',
]
);
$this->add_control(
'chart_tooltip_item_font_size',
[
'label' => esc_html__( 'Font Size', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'size_units' => [ 'px' ],
'range' => [
'px' => [
'min' => 10,
'max' => 100,
],
],
'default' => [
'unit' => 'px',
'size' => 14,
],
'separator' => 'before'
]
);
$this->add_control(
'chart_tooltip_item_spacing',
[
'label' => esc_html__( 'Item Spacing', 'wpr-addons' ),
'type' => Controls_Manager::SLIDER,
'range' => [
'px' => [
'min' => 0,
'max' => 50,
],
],
'size_units' => [ 'px' ],
'default' => [
'unit' => 'px',
'size' => 10,
],
]
);
$this->add_control(
'chart_tooltip_item_align',
[
'label' => esc_html__( 'Item Alignment', 'wpr-addons' ),
'type' => Controls_Manager::CHOOSE,
'default' => 'center',
'label_block' => false,
'options' => [
'left' => [
'title' => esc_html__( 'Left', 'wpr-addons' ),
'icon' => 'eicon-text-align-left',
],
'center' => [
'title' => esc_html__( 'Center', 'wpr-addons' ),
'icon' => 'eicon-text-align-center',
],
'right' => [
'title' => esc_html__( 'Right', 'wpr-addons' ),
'icon' => 'eicon-text-align-right',
],
],
'separator' => 'before'
]
);
$this->end_controls_section();
}
protected function render() {
$settings = $this->get_settings_for_display();
extract($settings);
$data_charts_array = [];
if ( in_array($chart_type, array('bar', 'bar_horizontal', 'line', 'radar')) ) {
if ( !empty($charts_labels_data) ) :
$data_charts_array['labels'] = explode(',', trim($charts_labels_data));
if ( (!defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code()) && 3 < sizeof($data_charts_array['labels']) ) {
$data_charts_array['labels'] = array_slice($data_charts_array['labels'], 0, 3);
}
endif;
if ( is_array($charts_data_set) && sizeof($charts_data_set) ) {
$charts_counter = 0;
foreach ( $charts_data_set as $chart_data ) {
if ( (!defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code()) && $charts_counter === 3 ) {
break;
}
$data_charts_array['datasets'][] = [
'label' => $chart_data['chart_data_label'],
'data' => array_map('floatval', explode(',', trim($chart_data['chart_data_set'], ','))),
'backgroundColor' => $chart_data['chart_data_background_color'],
'hoverBackgroundColor' => $chart_data['chart_data_background_color_hover'],
'borderColor' => $chart_data['chart_data_border_color'],
'hoverBorderColor' => $chart_data['chart_data_border_color_hover'],
'borderWidth' => $chart_data['chart_data_border_width'],
'barPercentage' => !empty($settings['column_width_x']) ? $settings['column_width_x'] : '',
'fill' => !empty($settings['chart_type_line_fill']) && 'yes' === $settings['chart_type_line_fill'] ? true : false,
];
$charts_counter++;
}
}
} else {
if ( is_array($charts_data_set) && sizeof($charts_data_set) && $settings['data_source'] !== 'csv' ) {
$chart_data_number_values = [];
$chart_background_colors = [];
$chart_background_hover_colors = [];
$chart_data_border_colors = [];
$chart_data_border_hover_colors = [];
$chart_data_border_width = [];
$chart_data_bar_percentage = [];
$charts_counter = 0;
foreach ( $charts_data_set AS $labels_data ) :
if ( (!defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code()) && $charts_counter === 3 ) {
break;
}
$data_charts_array['labels'][] = $labels_data['chart_data_label'];
$charts_counter++;
endforeach;
if ( !empty($charts_labels_data) ) :
$data_charts_array_test = explode(',', trim($charts_labels_data));
endif;
foreach ( $data_charts_array_test as $key=>$test_data ) {
if ( (!defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code()) && $key === 3 ) {
break;
}
$chart_data_number_values[$key] = [];
$outer_key = $key;
foreach ( $charts_data_set as $key=>$chart_data ) {
if ( (!defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code()) && $key === 3 ) {
break;
}
$number_value = sizeof(explode(',', trim($chart_data['chart_data_set'], ','))) >= $outer_key + 1 ? array_map('floatval', explode(',', trim($chart_data['chart_data_set'], ',')))[$outer_key] : '0';
array_push($chart_data_number_values[$outer_key], $number_value);
}
}
foreach ( $charts_data_set as $key=>$chart_data ) {
if ( (!defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code()) && $key === 3 ) {
break;
}
array_push($chart_background_colors, trim($chart_data['chart_data_background_color']));
array_push($chart_background_hover_colors, trim($chart_data['chart_data_background_color_hover']));
array_push($chart_data_border_colors, trim($chart_data['chart_data_border_color']));
array_push($chart_data_border_hover_colors, trim($chart_data['chart_data_border_color_hover']));
array_push($chart_data_border_width, trim($chart_data['chart_data_border_width']));
!empty($settings['column_width_x']) ? array_push($chart_data_bar_percentage, trim($chart_data['column_width_x'])) : '';
}
foreach ( $data_charts_array_test as $key=>$data_test ) {
if ( (!defined('WPR_ADDONS_PRO_VERSION') || !wpr_fs()->can_use_premium_code()) && $key === 3 ) {
break;
}
$data_charts_array['datasets'][] = [
'label' => $data_test, // test with fixed value
'data' => $chart_data_number_values[$key],
'backgroundColor' => $chart_background_colors,
'hoverBackgroundColor' => $chart_background_hover_colors,
'borderColor' => $chart_data_border_colors,
'hoverBorderColor' => $chart_data_border_hover_colors,
'borderWidth' => $chart_data_border_width,
'barPercentage' => $chart_data_bar_percentage,
];
}
}
}
if ( !empty($data_source_csv_url) ) {
$data_url = $data_source_csv_url;
} else if ( !empty($data_source_csv_file['url']) ) {
$data_url = $data_source_csv_file['url'];
} else {
$data_url = '';
}
$layout_settings = [
'data_source' => $data_source,
'chart_type' => $settings['chart_type'],
'stacked_bar_chart' => !empty($settings['stacked_bar_chart']) ? $settings['stacked_bar_chart'] : '',
'data_type' => isset($settings['data_type']) ? $settings['data_type'] : 'linear',
'inner_datalabels' => $inner_datalabels,
'inner_datalabels_color' => $inner_datalabels_color,
// 'inner_datalabels_bg_color' => $inner_datalabels_bg_color,
'inner_datalabels_font_size' => !empty($inner_datalabels_font_size['size']) ? $inner_datalabels_font_size['size'] : '',
'inner_datalabels_font_family' => !empty($inner_datalabels_font_family) ? $inner_datalabels_font_family : '',
'inner_datalabels_font_weight' => !empty($inner_datalabels_font_weight) ? $inner_datalabels_font_weight : '',
'inner_datalabels_font_style' => !empty($inner_datalabels_font_style) ? $inner_datalabels_font_style : '',
'ticks_padding_x' => !empty($ticks_padding_x['size']) ? $ticks_padding_x['size'] : '',
'ticks_color_x' => $chart_ticks_color_x,
'ticks_font_family_x' => $ticks_font_family_x,
'ticks_font_style_x' => $ticks_font_style_x,
'ticks_font_weight_x' => $ticks_font_weight_x,
'ticks_font_size_x' => !empty($ticks_font_size_x['size']) ? $ticks_font_size_x['size'] : '',
'ticks_padding_y' => !empty($ticks_padding_y['size']) ? $ticks_padding_y['size'] : '',
'ticks_color_y' => isset($chart_ticks_color_y) ? $chart_ticks_color_y : '',
'point_labels_color_r' => isset($chart_point_labels_color_r) ? $chart_point_labels_color_r : '',
'ticks_font_family_y' => $ticks_font_family_y,
'ticks_font_style_y' => $ticks_font_style_y,
'ticks_font_weight_y' => $ticks_font_weight_y,
'ticks_font_size_y' => !empty($ticks_font_size_y['size']) ? $ticks_font_size_y['size'] : '',
'point_labels_font_family_r' => $point_labels_font_family_r,
'point_labels_font_style_r' => $point_labels_font_style_r,
'point_labels_font_weight_r' => $point_labels_font_weight_r,
'point_labels_font_size_r' => !empty($point_labels_font_size_r['size']) ? $point_labels_font_size_r['size'] : '',
'exclude_dataset_on_click' => $exclude_dataset_on_click,
'trigger_tooltip_on' => $trigger_tooltip_on,
'chart_labels' => !empty($data_charts_array['labels']) ? $data_charts_array['labels'] : '',
'chart_datasets' => !empty($data_charts_array['datasets']) ? wp_json_encode($data_charts_array['datasets']) : '',
'show_chart_legend' => $show_chart_legend,
'reverse_legend' => $reverse_legend,
'reverse_x' => $reverse_x,
'reverse_y' => $reverse_y,
'legend_shape' => $charts_legend_shape,
'legend_box_width' => $legend_box_width['size'],
'legend_position' => $settings['charts_legend_position'],
'legend_align' => $settings['charts_legend_align'],
'legend_text_color' => $chart_legend_text_color,
'legend_font_family' => $legend_font_family,
'legend_font_size' => $legend_font_size['size'],
'legend_font_style' => $legend_font_style,
'legend_font_weight' => $legend_font_weight,
'legend_padding' => $chart_legend_padding['size'],
'chart_animation' => isset($chart_animation) ? $chart_animation : '',
'chart_animation_loop' => isset($chart_animation_loop) ? $chart_animation_loop : '',
'chart_animation_duration' => isset($chart_animation_duration) ? $chart_animation_duration : '',
'animation_transition_type' => $animation_transition_type,
'show_chart_title' => $settings['show_chart_title'],
'chart_title' => !empty($settings['chart_title']) ? $settings['chart_title'] : '',
'chart_title_align' => !empty($chart_title_align) ? $chart_title_align : '',
'chart_title_position' => !empty($chart_title_position) ? $chart_title_position : '',
'chart_title_color' => !empty($chart_title_color) ? $chart_title_color : '',
'title_font_family' => $title_font_family,
'title_font_size' => isset($title_font_size) ? $title_font_size['size'] : '',
'title_font_style' => isset($title_font_style) ? $title_font_style : '',
'title_font_weight' => $title_font_weight,
'title_padding' => isset($chart_title_padding) ? $chart_title_padding['size'] : '',
'show_chart_tooltip' => $show_chart_tooltip,
'tooltips_percent' => $tooltips_percent,
'chart_interaction_mode' => $chart_interaction_mode,
'tooltip_position' => $chart_tooltip_position,
'tooltip_padding' => isset($tooltip_padding['size']) ? $tooltip_padding['size'] : 1,
'tooltip_caret_size' => isset($tooltip_caret_size['size']) ? $tooltip_caret_size['size'] : 1,
'tooltip_caret_size_mobile' => isset($tooltip_caret_size_mobile) ? $tooltip_caret_size_mobile['size'] : 0,
'chart_tooltip_bg_color' => $chart_tooltip_bg_color,
'chart_tooltip_title_color' => $chart_tooltip_title_color,
'chart_tooltip_title_font' => $chart_tooltip_title_font,
'chart_tooltip_title_font_size' => isset($chart_tooltip_title_font_size['size']) ? $chart_tooltip_title_font_size['size'] : 1,
'chart_tooltip_title_align' => $chart_tooltip_title_align,
'chart_tooltip_title_margin_bottom' => isset($chart_tooltip_title_margin_bottom['size']) ? $chart_tooltip_title_margin_bottom['size'] : 1,
'chart_tooltip_item_color' => $chart_tooltip_item_color,
'chart_tooltip_item_font' => $chart_tooltip_item_font,
'chart_tooltip_item_font_size' => isset($chart_tooltip_item_font_size['size']) ? $chart_tooltip_item_font_size['size'] : 1,
'chart_tooltip_item_align' => $chart_tooltip_item_align,
'chart_tooltip_item_spacing' => isset($chart_tooltip_item_spacing['size']) ? $chart_tooltip_item_spacing['size'] : 1,
'show_lines' => isset($show_lines) ? $show_lines : '',
'line_dots' => isset($line_dots) ? $line_dots : '',
'line_dots_radius' => isset($line_dots_radius) ? $line_dots_radius['size'] : '',
'line_dots_radius_mobile' => isset($line_dots_radius_mobile) ? $line_dots_radius_mobile['size'] : 0,
'border_dash_offset' => $border_dash_offset,
'border_dash_length' => $border_dash_length,
'border_dash_spacing' => $border_dash_spacing,
'border_dash_offset_r' => $border_dash_offset_r,
'border_dash_length_r' => $border_dash_length_r,
'border_dash_spacing_r' => $border_dash_spacing_r,
'display_x_axis' => $display_x_axis,
'display_x_ticks' => $display_x_ticks,
'display_x_axis_title' => $display_x_axis_title,
'x_axis_title' => $x_axis_title,
'axis_title_color_x' => $axis_title_color_x,
'axis_title_font_family_x' => $axis_title_font_family_x,
'axis_title_font_style_x' => $axis_title_font_style_x,
'axis_title_font_weight_x' => $axis_title_font_weight_x,
'axis_title_font_size_x' => !empty($axis_title_font_size_x['size']) ? $axis_title_font_size_x['size'] : '',
'rotation_x' => $labels_rotation_x_axis,
'axis_grid_line_color_x' => $axis_grid_line_color_x,
'grid_line_width_x' => $grid_line_width_x,
'display_y_axis' => $display_y_axis,
'display_y_ticks' => $display_y_ticks,
'y_step_size' => $y_step_size,
'x_step_size' => $x_step_size,
'display_r_axis' => $display_r_axis,
'display_r_ticks' => $display_r_ticks,
'r_step_size' => $r_step_size,
'display_y_axis_title' => $display_y_axis_title,
'y_axis_title' => $y_axis_title,
'axis_title_color_y' => $axis_title_color_y,
'axis_title_font_family_y' => $axis_title_font_family_y,
'axis_title_font_style_y' => $axis_title_font_style_y,
'axis_title_font_weight_y' => $axis_title_font_weight_y,
'axis_title_font_size_y' => !empty($axis_title_font_size_y['size']) ? $axis_title_font_size_y['size'] : '',
'rotation_y' => $labels_rotation_y_axis,
'axis_grid_line_color_y' => $axis_grid_line_color_y,
'grid_line_width_y' => $grid_line_width_y,
'grid_line_width_r' => $grid_line_width_r,
'axis_grid_line_color_r' => $axis_grid_line_color_r,
'angle_lines_color' => isset($angle_lines_color) ? $angle_lines_color : '',
'axis_labels_color' => isset($axis_labels_color) ? $axis_labels_color : '',
'axis_labels_bg_color' => isset($axis_labels_bg_color) ? $axis_labels_bg_color : '',
'axis_labels_padding' => isset($axis_labels_padding) ? $axis_labels_padding['size'] : '',
'min_value' => $min_value,
'max_value' => $max_value,
'url' => $data_url,
'separator' => $data_csv_separator,
];
$this->add_render_attribute( 'chart-settings', [
'class' => 'wpr-charts-container',
'data-settings' => wp_json_encode( $layout_settings ),
] );
echo '<div ' . $this->get_render_attribute_string( 'chart-settings') . '>';
if ( $data_source === 'csv' ) {
echo '<span class="wpr-rotating-plane"></span>';
}
echo '<div class="wpr-charts-wrapper">';
echo '<canvas class="wpr-chart"></canvas>';
echo '</div>';
echo '</div>';
}
}