Error: Failed to create chart: can’t acquire context from the given item

Based on the template you mentioned, and your chart syntax, it seems you’re using an “ApexCharts” chart. Although I can’t see which version the template uses, I reproduced it with the following changes to your code:

  • Included the latest ApexCharts library CDNs here: https://cdnjs.com/libraries/apexcharts
  • Removed the “#” from GetElementById.
  • Renamed the Chart() call to ApexCharts() (this naming might be specific to your template, so you might not need to do this)
  • Called myChart.render(); at the end.

You can see it working here: https://jsfiddle.net/espriella/r0yva4ug/4/

var ctx = document.getElementById("chart-combinedd");
var myChart = new ApexCharts(ctx, {
                    chart: {
                        height: 397,
                        type: "line",
                        toolbar: {
                            show: !1
                        }
                    },
                    series: [{
                        name: "Website Blog",
                        type: "column",
                        data: [440, 505, 414, 671, 227, 413, 201, 352, 752, 320, 257, 160]
                    }, {
                        name: "Social Media",
                        type: "line",
                        data: [23, 42, 35, 27, 43, 22, 17, 31, 22, 22, 12, 16]
                    }],
                    stroke: {
                        width: [0, 4]
                    },
                    labels: ["01 Jan 2001", "02 Jan 2001", "03 Jan 2001", "04 Jan 2001", "05 Jan 2001", "06 Jan 2001", "07 Jan 2001", "08 Jan 2001", "09 Jan 2001", "10 Jan 2001", "11 Jan 2001", "12 Jan 2001"],
                    xaxis: {
                        type: "datetime"
                    },
                    yaxis: [{
                        title: {
                            text: "Website Blog"
                        }
                    }, {
                        opposite: !0,
                        title: {
                            text: "Social Media"
                        }
                    }]
                });
myChart.render();

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top