Ошибка Google charts: не удается прочитать свойство 'length' неопределенного значения; ошибка отладки в Google Charts

#javascript #google-visualization

#javascript #google-визуализация

Вопрос:

Следующий код отлично работает как независимая страница сама по себе. Но если оно включено в мое веб-приложение PHP, оно выдает ошибку. Как выполнить отладку, если ошибка возникает в Google chart JS? Любые предложения будут полезны

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>
      Google Visualization API Sample
    </title>
  </head>

  <body style="font-family: Arial;border: 0 none;">
   <div id="myGraphLabel" onclick="drawColumnChart();">
        My Column Chart
    </div>
    <div id="myColumnChart" style="width: 600px; height: 400px;"></div>
  </body>

  <script type="text/javascript" src="http://www.google.com/jsapi"></script>

  <script type="text/javascript">
      google.load('visualization', '1', {packages: ['corechart']});

      function drawColumnChart() {
        // Create and populate the data table.
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Task');
        data.addColumn('number', 'Hours per Day');
        data.addRows(2);
        data.setValue(0, 0, 'Work');
        data.setValue(0, 1, 11);
        data.setValue(1, 0, 'Eat');
        data.setValue(1, 1, 2);

        // Create and draw the visualization.
        new google.visualization.PieChart(document.getElementById('myColumnChart')).
            draw(data, {title:"So, how was your day?"});
      }   
    </script>
</html>

Ошибка в Chrome: отображается «Не удается прочитать свойство ‘length’ неопределенного значения» с красным фоном в контейнере

Ошибка в Firefox: выдает ошибку в консоли Firebug как: b [c] не определено http://www.google.com/uds/api/visualization/1.0/97e6275dc5c50efe5944ddda289e59d2/format en,default,corechart.I.js Строка 785

1. Предоставленный вами код работает нормально — что вы подразумеваете под внедрением в PHP ?

2. Я имел в виду в моем файле .ctp. Извините за отсутствие ясности. Я понял, что из-за включения prototype-1.6.0.2.js , это не работает. 🙂

Ответ №1:

Этот ответ будет применяться, если вы используете прототип JS framework. (Я не вижу его здесь, но оно могло быть исключено).

Для этой проблемы в API визуализации Google открыт запрос.

Одна из потенциальных проблем заключается в том, что может быть включена конфликтующая версия prototype или какой-либо другой библиотеки.

С другой стороны, возможно, потребуется переопределить функцию reduce:

 <script type="text/javascript">
  Array.prototype.reduce = undefined;
</script>

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

1. Проблемы, которые могли возникнуть с API визуализации Google в 2011 году в сочетании с прототипом JS framework (или другими подобными системами), вероятно, теперь будут другими. В любом случае, обходной путь, заключающийся в том, чтобы сделать Array.prototype.reduce неопределенным, неизбежно вызовет проблемы, и действительно, ваш код, скорее всего, завершится неудачей.

2. Внезапно я получил эту ошибку. Это была работа за последний 1 год. Я пробовал это, но это не работает.

Ответ №2:

В моем веб-приложении я включил ‘prototype-1.6.0.2.js ‘, который создал эту ошибку! Если я исключу ‘prototype-1.6.0.2.js «, все работает отлично!

Ответ №3:

У меня была аналогичная проблема, когда инструменты Google chart и библиотека прототипов конфликтовали. Я обновил Prototype с версии 1.6.1 до 1.7.1, и проблема исчезла.