<h1 class="mb-5"><?php echo e($name); ?></h1>
<?php if($verif): ?>
    <?php if (isset($component)) { $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4 = $component; } ?>
<?php $component = $__env->getContainer()->make(Illuminate\View\AnonymousComponent::class, ['view' => 'components.noData','data' => []]); ?>
<?php $component->withName('noData'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes([]); ?>
<?php if (isset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4)): ?>
<?php $component = $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4; ?>
<?php unset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4); ?>
<?php endif; ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php else: ?>
    <canvas style="max-width: 1000px; max-height: 700px" id="Répartition_des_marchés"></canvas>
    <?php if (isset($component)) { $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4 = $component; } ?>
<?php $component = $__env->getContainer()->make(Illuminate\View\AnonymousComponent::class, ['view' => 'components.saveAsPdf','data' => ['canvasId' => 'Répartition_des_marchés','pdfName' => 'Répartition des marchés']]); ?>
<?php $component->withName('saveAsPdf'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes(['canvasId' => \Illuminate\View\Compilers\BladeCompiler::sanitizeComponentAttribute('Répartition_des_marchés'),'pdfName' => \Illuminate\View\Compilers\BladeCompiler::sanitizeComponentAttribute('Répartition des marchés')]); ?>
<?php if (isset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4)): ?>
<?php $component = $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4; ?>
<?php unset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4); ?>
<?php endif; ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>


    <script>

        const renderMarketByAmountChart = () => {

            const markets = <?php echo json_encode($marketsByAmount ?? ''); ?>;

            const sortedMarket = markets.sort((a, b) => b.montant_ht - a.montant_ht);
            const totalAmount = markets.reduce((partialSum, market) => partialSum + Math.round(market.montant_ht), 0);
            const filteredMarket = sortedMarket.filter((markets) => (Math.round(markets.montant_ht) / totalAmount) * 100 > 2);

            const labels = filteredMarket.flatMap(market => market.libelle_marche);
            const amounts = filteredMarket.flatMap(market => Math.round(market.montant_ht));

            const percentageMarketInTotalMarket = amounts.map((amount) => (Math.round(amount) / totalAmount) * 100);

            const marketByAmountChart = document.getElementById('Répartition_des_marchés');

            return new Chart(marketByAmountChart, {
                type: 'pie',
                data: {
                    labels: labels,
                    datasets: [{
                        label: '',
                        data: percentageMarketInTotalMarket,
                        backgroundColor: [
                            'rgba(255, 99, 132, 0.2)',
                            'rgba(255, 206, 86, 0.2)',
                            'rgba(75, 192, 192, 0.2)',
                            'rgba(153, 102, 255, 0.2)',
                            'rgba(255, 159, 64, 0.2)',
                            'rgba(54, 162, 235, 0.2)',
                            'rgba(255, 206, 86, 0.2)',
                            'rgba(255, 99, 132, 0.2)',
                            'rgba(75, 192, 192, 0.2)',
                            'rgba(54, 162, 235, 0.2)',
                            'rgba(255, 206, 86, 0.2)',
                            'rgba(153, 102, 255, 0.2)',
                            'rgba(255, 159, 64, 0.2)',
                            'rgba(75, 192, 192, 0.2)',
                            'rgba(255, 99, 132, 0.2)',
                            'rgba(54, 162, 235, 0.2)',
                            'rgba(255, 206, 86, 0.2)',
                            'rgba(75, 192, 192, 0.2)',
                            'rgba(153, 102, 255, 0.2)'
                        ],
                        borderColor: [
                            'rgba(255, 99, 132, 1)',
                            'rgba(255, 99, 132, 1)',
                            'rgba(54, 162, 235, 1)',
                            'rgba(54, 162, 235, 1)',
                            'rgba(255, 206, 86, 1)',
                            'rgba(75, 192, 192, 1)',
                            'rgba(255, 206, 86, 1)',
                            'rgba(75, 192, 192, 1)',
                            'rgba(153, 102, 255, 1)',
                            'rgba(255, 159, 64, 1)',
                            'rgba(153, 102, 255, 1)',
                            'rgba(255, 99, 132, 1)',
                            'rgba(255, 159, 64, 1)',
                            'rgba(54, 162, 235, 1)',
                            'rgba(255, 206, 86, 1)',
                            'rgba(255, 99, 132, 1)',
                            'rgba(75, 192, 192, 1)',
                            'rgba(153, 102, 255, 1)'
                        ],
                        borderWidth: 1
                    }]
                },
                options: {
                    plugins: {
                        datalabels: {
                            formatter: (value) => {
                                if (value < 1) {
                                    return '';
                                }
                                return Math.round(value) + " %";
                            },
                            font: {
                                size: 18,
                            }
                        },
                        legend: {
                            position: 'left',
                            maxWidth: 600,
                            labels: {
                                padding: 20,
                            }
                        },
                        tooltip: {
                            callbacks: {
                                label: function (context) {
                                    const label = context.label || '';
                                    const value = Math.round(context.parsed);
                                    return label + " : " + value + " %" + " - Montant HT : " + amounts[labels.indexOf(label)].toLocaleString('fr-FR') + " €";

                                }
                            }
                        },
                    },
                }
            });
        }

        document.addEventListener('DOMContentLoaded', function () {
            renderMarketByAmountChart();
        });

    </script>
<?php endif; ?>
<?php /**PATH /var/www/html/resources/views/components/charts/marketByAmountChart.blade.php ENDPATH**/ ?>