Блог

Главная - Вопросы по программированию - Базовый пример столбчатой диаграммы не загружается на страницу — возвращена ошибка

Базовый пример столбчатой диаграммы не загружается на страницу — возвращена ошибка

#javascript #html #google-visualization

#JavaScript #HTML #google-визуализация

Вопрос:

У меня есть столбчатая диаграмма, реплицированная на скрипку. На скрипте js диаграмма не загружается. Однако на моей странице ошибка Cannot read property 'bp' of undefined появляется на моей веб-странице (а не на консоли). Ниже приведен мой код.

HTML

 <head>
  <script src="https://www.google.com/jsapi" type="text/javascript"></script>
</head>
<body>
  <div id="chart"></div> 
  <script>
    google.load("visualization", "1", {
        packages: ["corechart"]
    });

    google.setOnLoadCallback(

    function drawChart() {
        var data  =  google.visualization.arrayToDataTable([
            ['Name',  'Numbers'],
            ['All',   67000],
            ['Paid to Date',   40000]
        ]);

        // Create and draw the visualization.
        new google.visualization.ColumnChart(document.getElementById('chart')).draw(
        data, {
            width: 350,
             height: 200,
            hAxis:   { baselineColor:  'white' 
            },
            vAxis:   { baselineColor:  'white',
                gridlines:   { color:  'black',
                     count:  2
                },
                ticks:   [0,  90000]
            },
            legend:   { position:  "none" 
            }
        });
    })
  </script>  
</body>

Я надеюсь, что выяснение того, что не так с скрипкой js, и применение этого исправления к моему приложению устранит проблему. Итак, возникает вопрос: что не так с кодом? Почему эта ошибка появляется на странице, где должна быть моя столбчатая диаграмма?

Комментарии:

1. Чтобы заставить API визуализации работать на jsfiddle, вам необходимо изменить параметр «onLoad» по умолчанию в разделе «Фреймворки и расширения» на любой из параметров «Без переноса». Вы также должны вызывать только google.load один раз, хотя второй вызов, вероятно, не вызывает у вас проблем. Вот обновленная скрипка, которая работает: jsfiddle.net/asgallant/xt6b4/2

2. Спасибо за исправление скрипки. К сожалению, я не могу воспроизвести это в своем приложении. Я все еще получаю сообщение об ошибке Cannot read property 'ed' of undefined . Ошибка, немного отличающаяся от предыдущей.

3. Используете ли вы какие-либо библиотеки или фреймворки javascript, которые могут создавать проблемы с прототипами объектов? Есть ли у вас какие-либо ошибки, отображаемые в консоли разработчика в Chrome или Firefox?

4. Я так не думаю. У меня есть jQuery и angular. В консоли не существует ошибок, влияющих на прототипы объектов.

5. Есть ли ошибки в консоли (влияют ли они на прототипы объектов или нет)? Является ли страница общедоступной, чтобы я мог проверить ее сам?