if($( window ).width() >= '600'){
    var width = 35;
    var height = 20;
    var xleft = 20;
    var right = 50;
} else {
    var width = 25;
    var height = 17;
    var xleft = 15;
    var right = 20;
}

// Chart 63938dc5d398d
    const images63938dc5d398d = ['/assets/images/laender/jpg/deutschland.jpg', '/assets/images/laender/jpg/niederlande.jpg', '/assets/images/laender/jpg/frankreich.jpg', '/assets/images/laender/jpg/grossbritannien.jpg', '/assets/images/laender/jpg/usa.jpg'];
    const config63938dc5d398d = {
        type: 'bar',
        plugins: [{
            afterDraw: chart => {   
                var ctx = chart.ctx;    
                var xAxis = chart.scales.x;
                var yAxis = chart.scales.y;
                chart.scales.x.ticks.forEach((value, index) => {  
                    var x = xAxis.getPixelForTick(index);  
                    var image = new Image();
                    image.src = images63938dc5d398d[index];
                    ctx.drawImage(image, x - xleft, yAxis.bottom + 10, width, height)
                });      
            }
        }],
        data: {
        labels: ['Deutschland','Niederlande','Frankreich','UK','USA',],
        datasets: [{
            label: ['Deutschland','Niederlande','Frankreich','UK','USA',],
            data: ['135','206','223','438','691',],
            borderWidth: 1,
            backgroundColor: [
                '#ffe78e',
                '#2e2d2c',
                '#2e2d2c',
                '#2e2d2c',
                '#2e2d2c',
            ],
        }]
        },
        
        
        options: {
            responsive: true,
            maintainAspectRatio: false,
            aspectRatio: 1,
            plugins: {
                legend: false,
                tooltip: {
                    enabled: false
                },
                datalabels: {
                    align: 'end',
                    anchor: 'end',
                    
        color: '#000000',
    
                    
        font: function(context) {
            var w = context.chart.width;
            return {
                size: w < 512 ? 12 : 14,
                weight: 'bold',
            };
        },
    
                    
        formatter: function(value, context) {
            return Number(value).toLocaleString('de-DE');
        },
    
                }
            },
            layout: {
                padding: {
                    right: 0,
                    top: 20,
                }
            },
            scales: {
                y: {
                    display: false,
                    beginAtZero: true,
                    tooltip: false,
                    grid: {
                        display:false
                    },
                    border: {
                        display: false
                    }
                },
                x: {
                    tooltip: false,
                    grid: {
                        display:false,
                        tickLength: 30,
                    },
                    ticks: {
                        padding: 0,
                        color: '#fff',
                        font: {
                            size: 1
                        },
                        crossAlign: 'start'
                    },
                },
            },
        }
    
    };
    Chart.register(ChartDataLabels);
    chart63938dc5d398d = new Chart(document.getElementById('63938dc5d398d').getContext('2d'), config63938dc5d398d);

// Chart 63938dc1d346d
    const images63938dc1d346d = ['/assets/images/laender/jpg/deutschland.jpg', '/assets/images/laender/jpg/niederlande.jpg', '/assets/images/laender/jpg/frankreich.jpg', '/assets/images/laender/jpg/grossbritannien.jpg', '/assets/images/laender/jpg/usa.jpg'];
    const config63938dc1d346d = {
        type: 'bar',
        plugins: [{
            afterDraw: chart => {   
                var ctx = chart.ctx;    
                var xAxis = chart.scales.x;
                var yAxis = chart.scales.y;
                chart.scales.x.ticks.forEach((value, index) => {  
                    var x = xAxis.getPixelForTick(index);  
                    var image = new Image();
                    image.src = images63938dc1d346d[index];
                    ctx.drawImage(image, x - xleft, yAxis.bottom + 10, width, height)
                });      
            }
        }],
        data: {
        labels: ['Deutschland','Niederlande','Frankreich','UK','USA',],
        datasets: [{
            label: ['Deutschland','Niederlande','Frankreich','UK','USA',],
            data: ['0.18','0.20','0.37','0.65','0.39',],
            borderWidth: 1,
            backgroundColor: [
                '#ffe78e',
                '#2e2d2c',
                '#2e2d2c',
                '#2e2d2c',
                '#2e2d2c',
                '#2e2d2c',
            ],
        }]
        },
        
        
        options: {
            responsive: true,
            maintainAspectRatio: false,
            aspectRatio: 1,
            plugins: {
                legend: false,
                tooltip: {
                    enabled: false
                },
                datalabels: {
                    align: 'end',
                    anchor: 'end',
                    
        color: '#000000',
    
                    
        font: function(context) {
            var w = context.chart.width;
            return {
                size: w < 512 ? 12 : 14,
                weight: 'bold',
            };
        },
    
                    
        formatter: function(value, context) {
            return Number(value).toLocaleString('de-DE', { minimumFractionDigits: 2, maximumFractionDigits: 2, }) + '%';
        },
    
                }
            },
            layout: {
                padding: {
                    right: 0,
                    top: 30,
                }
            },
            scales: {
                y: {
                    display: false,
                    beginAtZero: true,
                    tooltip: false,
                    grid: {
                        display:false
                    },
                    border: {
                        display: false
                    }
                },
                x: {
                    tooltip: false,
                    grid: {
                        display:false,
                        tickLength: 30,
                    },
                    ticks: {
                        padding: 0,
                        color: '#fff',
                        font: {
                            size: 1
                        },
                        crossAlign: 'start'
                    },
                },
            },
        }
    
    };
    Chart.register(ChartDataLabels);
    chart63938dc1d346d = new Chart(document.getElementById('63938dc1d346d').getContext('2d'), config63938dc1d346d);

// Chart 63938dbdbee99
    const images63938dbdbee99 = ['/assets/images/laender/jpg/deutschland.jpg', '/assets/images/laender/jpg/frankreich.jpg', '/assets/images/laender/jpg/niederlande.jpg', '/assets/images/laender/jpg/grossbritannien.jpg','/assets/images/laender/jpg/usa.jpg'];
    Chart.register(ChartDataLabels);
    const config63938dbdbee99 = {
        type: 'bar',
        plugins: [{
            afterDraw: chart => {   
                var ctx = chart.ctx;    
                var xAxis = chart.scales.x;
                var yAxis = chart.scales.y;
                chart.scales.x.ticks.forEach((value, index) => {  
                    var x = xAxis.getPixelForTick(index);  
                    var image = new Image();
                    image.src = images63938dbdbee99[index];
                    ctx.drawImage(image, x - xleft, yAxis.bottom + 10, width, height)
                });      
            }
        }],
        data: {
            labels: [
                "Deutschland","Frankreich","Niederlande","UK","USA",            ],
            datasets: [
                                    {
                        label: 'EU-Investoren',
                        data: [
                            "27","18","22","14","6","0",                        ],
                         backgroundColor: ['#ffe78e','#ffe78e','#ffe78e','#ffe78e','#ffe78e']                    },
                                    {
                        label: 'Nationale Investoren',
                        data: [
                            "24","47","39","29","63","0",                        ],
                         backgroundColor: ['#2e2d2c','#2e2d2c','#2e2d2c','#2e2d2c','#2e2d2c']                    },
                                    {
                        label: 'Rest of World',
                        data: [
                            "49","35","39","57","31","0",                        ],
                         backgroundColor: ['#ffb09f','#ffb09f','#ffb09f','#ffb09f','#ffb09f']                    },
                            ]
        },
        
        options: {
            responsive: true,
            maintainAspectRatio: false,
            aspectRatio: 1,
            plugins: {
                paddingBelowLegends: true,
                legend: {
                    display: true,
                    align: 'start',
                    labels: {
                        padding: 5
                    }
                },
                tooltip: {
                    enabled: true
                },
                datalabels: {
                    align: 'center',
                    anchor: 'center',
                    
        font: function(context) {
            var w = context.chart.width;
            return {
                size: w < 512 ? 12 : 14,
                weight: 'bold',
            };
        },
    
                    
        formatter: function(value, context) {
            return Number(value).toLocaleString('de-DE');
        },
    
                    
        color: '#ffffff',
    
                    display: function(context) {
                        return context.dataset.data[context.dataIndex] > 5;
                    },
                    formatter: function(value, context) {
                        return value + '%';
                    },
                  
                },
                paddingBelowLegends: true
            },
            layout: {
                padding: {
                left: 0,
                right: 0,
                top: 0,
                bottom: 0,
            }
            },
            scales: {
                y: {
                    stacked: true,
                    display: false,
                    beginAtZero: true,
                    tooltip: false,
                    grid: {
                        display:false
                    },
                    border: {
                        display: false
                    },
                    ticks: {
                        stepSize: 1,
                        padding: '20',
                        crossAlign: 'start'
                    }   
                },
                x: {
                    stacked: true,
                    tooltip: false,
                    grid: {
                        display:false,
                        tickLength: 30,
                    },
                    ticks: {
                        padding: 0,
                        color: '#fff',
                        font: {
                            size: 1
                        },
                        crossAlign: 'start'
                    },

                },
            },
        }
        }
    Chart.register(ChartDataLabels);
    chart63938dbdbee99 = new Chart(document.getElementById('63938dbdbee99').getContext('2d'), config63938dbdbee99);


// Chart 63938dcab654e
    const config63938dcab654e = {
        type: 'bar',
        data: {
        labels: ['2018','2019','2020','2021','2022',],
        datasets: [{
            label: '# of Votes',
            data: ['4.6','6.2','5.3','17.4','9.9',],
            borderWidth: 1,
            backgroundColor: [
                '#2e2d2c',
                '#2e2d2c',
                '#2e2d2c',
                '#2e2d2c',
                '#ffe78e',
            ],
        }]
        },
        
        options: {
            responsive: true,
            maintainAspectRatio: false,
            aspectRatio: 1,
            plugins: {
                legend: false,
                tooltip: {
                    enabled: false
                },
                datalabels: {
                    align: 'end',
                    anchor: 'end',
                    
        color: '#000000',
    
                    
        font: function(context) {
            var w = context.chart.width;
            return {
                size: w < 512 ? 12 : 14,
                weight: 'bold',
            };
        },
    
                    
        formatter: function(value, context) {
            return Number(value).toLocaleString('de-DE', { minimumFractionDigits: 1, maximumFractionDigits: 1, });
        },
    
                }
            },
            layout: {
                padding: {
                    right: 0,
                    top: 20
                }
            },
            scales: {
                y: {
                    display: false,
                    beginAtZero: true,
                    tooltip: false,
                    grid: {
                        display:false
                    },
                    border: {
                        display: false
                    }
                },
                x: {
                    tooltip: false,
                    grid: {
                        display:false
                    },
                },
            },
        }
        };

    Chart.register(ChartDataLabels);
    chart63938dcab654e = new Chart(document.getElementById('63938dcab654e').getContext('2d'), config63938dcab654e);

$(window).on('resize scroll', function() {
    $( ".viewport-chart:in-viewport" ).each(function( index ) {
        var chartanimation = $(this).attr("data-chart-animation");
        var chartid = $(this).attr("data-chartid");

        if(chartanimation == 'false' && chartid == '63938db9e3db2'){
            chart63938db9e3db2.destroy();
            chart63938db9e3db2 = new Chart(document.getElementById('63938db9e3db2').getContext('2d'), config63938db9e3db2);
            $(this).attr("data-chart-animation","true");
        }

        if(chartanimation == 'false' && chartid == '63938dbdbee99'){
                chart63938dbdbee99.destroy();
                chart63938dbdbee99 = new Chart(document.getElementById('63938dbdbee99').getContext('2d'), config63938dbdbee99);
                $(this).attr("data-chart-animation","true");
        }

        if(chartanimation == 'false' && chartid == '63938dc1d346d'){
            chart63938dc1d346d.destroy();
            chart63938dc1d346d = new Chart(document.getElementById('63938dc1d346d').getContext('2d'), config63938dc1d346d);
            $(this).attr("data-chart-animation","true");
        }

        if(chartanimation == 'false' && chartid == '63938dc5d398d'){
            chart63938dc5d398d.destroy();
            chart63938dc5d398d = new Chart(document.getElementById('63938dc5d398d').getContext('2d'), config63938dc5d398d);
            $(this).attr("data-chart-animation","true");
        }

        if(chartanimation == 'false' && chartid == '63938db18d35c'){
            chart63938db18d35c.destroy();
            chart63938db18d35c = new Chart(document.getElementById('63938db18d35c').getContext('2d'), config63938db18d35c);
            $(this).attr("data-chart-animation","true");
        }

        if(chartanimation == 'false' && chartid == '63938dcab654e'){
            chart63938dcab654e.destroy();
            chart63938dcab654e = new Chart(document.getElementById('63938dcab654e').getContext('2d'), config63938dcab654e);
            $(this).attr("data-chart-animation","true");
        }
    });
});