KoolReport's Forum

Official Support Area, Q&As, Discussions, Suggestions and Bug reports.
Forum's Guidelines

Chartjs RadarChart #3385

Open Victoria Rodriguez opened this topic on 2 days ago - 5 comments

Victoria Rodriguez commented 2 days ago

Hi! I am using chartJs radar for PDF view with export, of the five points of the radar, only the data of two points is shown correctly. I think the problem could be solved if the middle point of the radar takes the value 0. The scale is from 0 to 1. But I can't establish that configuration.

$average_app_margin = $this->dataStore('average_margin_application')->toArray();

                if (!count($average_app_margin)) {
                    echo '<div class="d-flex justify-content-center">
                                <span class="text-info text-sm-center">No data available</span>
                            </div>';
                } else {
                    foreach ($average_app_margin as &$row) {
                        $margin = floatval($row['total_margin'] ?? 0);
                        $row['total_margin'] = number_format($margin, 2, '.', '');
                    }
                  }            

                RadarChart::create(array(
                    //"title" => "Margin per Application",
                    "dataSource" => $average_app_margin,
                        "columns" => array(
                            "job_application" => [
                                "label" => "Application"
                            ],
                            "total_margin" => [
                                "label" => "Total Margin",
                                "type" => 'number',
                                "suffix" => "%",
                            ],
                        ),
                        "showLegend" => false,
                        "widthHeightAutoRatio" => 1.3,
                        "options" => [
                            "scales" => [
                                "r" => [
                                    "suggestedMin" => 0,  
                                    "suggestedMax" => 100, 
                                    "ticks" => [
                                        "beginAtZero" => true,  
                                    ],
                                ],
                            ],
                        ],
                        
                    ));
Bright commented 1 day ago

Hi, You do this :

"options" => [
    "scales" => [
        "ticks" => [
            "beginAtZero" => true,
             "suggestedMin" => 0,
            "suggestedMax" => 100
        ]
    ]
]
Victoria Rodriguez commented 22 hours ago

H! It hasn't worked for me

Bright commented 22 hours ago

Can you be more specific? It would be better if there were illustrations.

Victoria Rodriguez commented 16 hours ago

I continued researching and testing and I managed to solve it like this. Thank you very much for your help!

"options" => [
                                "scale" => [ 
                                "ticks" => [ 
                                    "beginAtZero" => true, 
                                    "suggestedMin" => 0, 
                                    "suggestedMax" => 100, 
                                ], 
                                "pointLabels" => [ 
                                    "fontSize" => 12,   
                                ], 
                             ]
                       ]      
Bright commented 16 hours ago

Glad I was able to help you out a little. Helping you also helped me learn a few things, like how to easily fix similar errors in the future.

Build Your Excellent Data Report

Let KoolReport help you to make great reports. It's free & open-source released under MIT license.

Download KoolReport View demo
help needed

None