Highcharts Error #16: графики не отображаются на одной странице

у меня есть веб-сайт, на одной странице Я успешно добавил highchart.

Теперь я скопировал точно такой же код на ту же страницу, но другую страницу asp, но первая диаграмма исчезла, а вторая диаграмма не отображается.

это дает мне ошибку:

Uncaught Highcharts error #16: www.highcharts.com/errors/16 highcharts.js:16
Uncaught SyntaxError: Unexpected token ILLEGAL Dashboard.aspx:657
Uncaught TypeError: Object [object Object] has no method 'highcharts' Dashboard.aspx:405
Uncaught TypeError: Object [object Object] has no method 'draggable'

любые идеи, почему я получаю это.

Итак, мой код для новой диаграммы, которую я хочу:

 <script type="text/javascript"
$(function () { 
 $('#container').highcharts({
    chart: {
        type: 'bar'
    },
    title: {
        text: 'Fruit Consumption'
    },
    xAxis: {
        categories: ['Apples', 'Bananas', 'Oranges']
    },
    yAxis: {
        title: {
            text: 'Fruit eaten'
        }
    },
    series: [{
        name: 'Jane',
        data: [1, 0, 4]
    }, {
        name: 'John',
        data: [5, 7, 3]
    }]
});
});​
></script>

график работы имеет следующие код:

 <script type="text/javascript"     src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>



  <script type="text/javascript">

   $(function() {

       $('#container').highcharts({
           chart: {
               type: 'column'
           },
           title: {
               text: 'Chart'
           },
           xAxis: {
           categories: array1
           },
           yAxis: {
               title: {
                   text: 'aWH'
               }
           },
           tooltip: {
               pointFormat: "Value: {point.y:.1f} mm"
           },

           series: [{

               name: '2011-2012',
               color: '#0000FF',
               data: array
           },
           {

               name: '2012-2013',
               color: '#92D050',
               data: array3
           },


             {

                 color: '#FF0000',
                 name: '2013-2014',
                 data: array2
}]
       });

   });

</script>

второй график показывает.

но первый график не,

оба кода находятся на другой странице acsx!

8
asp.net highcharts javascript

2 ответов

если вы идете к Учитывая Ссылку На Ошибку

Highcharts Ошибка #16

Highcharts уже определены на странице

эта ошибка возникает при второй загрузке Highcharts или Highstock на той же странице, поэтому пространство имен Highcharts уже определено. Имейте в виду, что Highcharts.Конструктор диаграмм и все функции Highcharts включены в Highstock, поэтому, если вы используете диаграмму и Стокчарт в сочетании, вы только нужно загрузить highstock.файл js.

Проверьте, скопировали ли вы библиотеку скриптов для highcharts во второй раз ваш код должен содержать только один раз:

<script src="http://code.highcharts.com/highcharts.js"></script>

редактировать

вы пытаетесь показать диаграммы в том же div, что и $('#container') здесь контейнер является идентификатором для div. Когда оба ascx визуализируются на странице, он находит тот же div с контейнером Id и визуализирует диаграмму, которая переопределяет один из них. так что

  1. сделать два отдельных divs:

    <div id="container1" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
<div id="container2" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

  2. удалите скрипт (следующий) из ascx и поместите его в MasterPage.:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>

  3. для графика:

    $('#container1').highcharts({//other code

    для диаграммы два:

     $('#container2').highcharts({//other code
22

вы можете использовать этот способ, чтобы обернуть код, который работает Highcharts.библиотека js.:

if (!window.HighchartsUniqueName) {
  window.HighchartsUniqueName = true;

  // .. your code which runs Highcharts.js library here ... 

}

Я нашел его здесь https://stackoverflow.com/a/5154971 и это работает для меня.

таким образом, вам не нужно помещать свой скрипт в MasterPage, если вы не хочу.

обязательно используйте very уникальный name, так как это глобальная переменная.

также имейте в виду, что Highcharts.Конструктор диаграмм и все особенности Highcharts включены в Highstock, поэтому если вы работаете в графике и StockChart в сочетании, нужно только загрузить highstock.JS файл, или вы можете обернуть его в ту же сторону.

1