Error multiple highcharts while loading in carousel <p>I'm loading multiple charts in a bootstrap carousel, but I get always the following highcharts error:</p> <blockquote> <p>Highcharts Error #16</p> <p>Highcharts already defined in the page</p> <p>This error happens the second time Highcharts or Highstock is loaded in the same page, so the Highcharts namespace is already defined. Keep in mind that the Highcharts.Chart constructor and all features of Highcharts are included in Highstock, so if you are running Chart and StockChart in combination, you only need to load the highstock.js file.</p> </blockquote> <p>This is what I do in my html:</p> <pre><code>&lt;div id="myCarousel" class="carousel slide"&gt; &lt;div class="carousel-inner"&gt; &lt;?php for ($i = 1; $i &lt;= $numquestions; $i++) { ?&gt; &lt;div class="item"&gt; &lt;h2&gt;&lt;?php echo "de titel van de question"; ?&gt;&lt;/h2&gt; &lt;div id=&lt;?php echo "container" . $i; ?&gt;&gt;&lt;/div&gt; &lt;/div&gt; &lt;?php } ?&gt; &lt;/div&gt; &lt;!-- Controls (CHECK ICONS) --&gt; &lt;a class="left carousel-control" href="#myCarousel" data-slide="prev"&gt;&amp;laquo;&lt;/a&gt; &lt;a class="right carousel-control" href="#myCarousel" data-slide="next"&gt;&amp;raquo;&lt;/a&gt; &lt;/div&gt; </code></pre> <p>I create the number of items in my carousel.</p> <p>My javascript:</p> <pre><code>&lt;script type="text/javascript"&gt; var categories = new Array(); var data = new Array(); var chart; var questionsandanswers = &lt;?php echo json_encode($questionandanswers); ?&gt;; for (var i = 0; i &lt; questionsandanswers.length; i++) { questiontitle = ""; answers = ""; // Loop through questions var questiontitle = questionsandanswers[i].Text; var answers = questionsandanswers[i]['0']; createChart(i, questiontitle, answers); } // Create the Charts function createChart(i, questiontitle, answers){ chart=""; i++; // CHART OPTIONS var options = { chart: { type: 'bar', renderTo: 'container' + i }, xAxis: { categories: '', title: { text: null } }, yAxis: { min: 0, title: { text: 'Aantal keer gekozen', align: 'high' }, labels: { overflow: 'justify' } }, tooltip: { //valueSuffix: ' aantal keer gekozen' }, plotOptions: { bar: { dataLabels: { enabled: true, color: 'black', formatter: function() { if (this.y === 0) { return null; } else { return this.y; } } }, stacking: 'normal' } }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'top', x: -40, y: 100, floating: true, borderWidth: 1, backgroundColor: '#FFFFFF', shadow: true }, credits: { enabled: false }, series: [] } chart = new Highcharts.Chart(options); // Create new chart with general options for (var i = 0; i &lt; answers.length; i++) { // add answers to categories array categories.push(answers[i].Text); data.push(answers[i]['0']); } // add categories to x-axis chart.xAxis[0].setCategories(categories); chart.addSeries({data:data,name:'Aantal keer gekozen'},false); chart.setTitle({ text: questiontitle }); // redraw chart chart.redraw(); categories = Array(); data = Array(); } &lt;/script&gt; </code></pre> <p>As you can see I add the charts to the different containers but I still get an error. I know I add multiple highcharts in the same page but I need to ... . How can I fix this that I don't get that error?</p>