jquery и визуализация таблицы Google

Question

Я надеюсь, что есть кто-то, кто может мне помочь. Я использую инструменты визуализации google.code и jquery на одной странице.

Я вызываю функцию $(document).ready на документе, но подозреваю, что проблема связана с вызовом функции google.setOnLoadCallback(drawVisualization);.

Какие еще загружает после функции document.ready, а затем не применить эффект лайтбоксе на стол

<script type="text/javascript" charset="utf-8"> 
    $(document).ready(function(){ 
     $(".gallery a[rel^='prettyPhoto']").prettyPhoto1({theme:'facebook'}); 
    }); 
    </script> 

Любые идеи о том, как применить эффект лайтбокса ссылку в таблице, после визуализации таблицы Google загрузился?

Я также добавил полный сценарий, так как теперь у меня это должно помочь в поиске проблемы.

<script type="text/javascript"> 
     google.load('visualization', '1', {packages: ['table']}); 
    </script> 
<script type="text/javascript"> 
    function drawVisualization() { 
     // Create and populate the data table. 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'No'); 
     data.addColumn('string', 'Page URL'); 
     data.addColumn('string', 'EDIT'); 
     data.addRows(10); 
     <% while ((Repeat1__numRows-- != 0) && (!rs_page_1.EOF)) { %> 
     data.setCell(<%= Repeat1__index %>, 0, '<%=(rs_page_1.Fields.Item("g_page_no").Value)%>'); 
     data.setCell(<%= Repeat1__index %>, 1, '<a href="<%=(rs_page_1.Fields.Item("g_page_site").Value)%><%=(rs_page_1.Fields.Item("g_page_url").Value)%>"><%=(rs_page_1.Fields.Item("g_page_site").Value)%><%=(rs_page_1.Fields.Item("g_page_url").Value)%></a>'); 
     data.setCell(<%= Repeat1__index %>, 2, '<span class="gallery clearfix"><div class="btn_newsite"><a href="/application/functions/preview.asp?g_sites_no=<%=(rs_page_1.Fields.Item("g_sites_no").Value)%>&amp;g_page_no=<%=(rs_page_1.Fields.Item("g_page_no").Value)%>&amp;iframe=true&width=100%&height=100%" rel="prettyPhoto1[iframes]" title="View">Edit</a></div></span>'); 
     <% 
    Repeat1__index++; 
    rs_page_1.MoveNext(); 
}; 
%> 
     // Create and draw the visualization. 
     visualization = new google.visualization.Table(document.getElementById('table')); 
     visualization.draw(data, {'allowHtml': 'true'}, {'showRowNumber': 'true'}, {'firstRowNumber': '1'}); 
    } 
    google.setOnLoadCallback(drawVisualization); 
    </script> 
<div id="table"></div><script type="text/javascript" charset="utf-8"> 
     $(document).ready(function(){ 
      $(".gallery a[rel^='prettyPhoto']").prettyPhoto1({theme:'facebook'}); 
     }); 
     </script> 

Благодаря

Answer 1

Редактировать для этого конкретного Google Visualization API:

Метод .draw() не сразу, она все еще имеет некоторые работы, чтобы сделать, и это не делает его в текущий поток (так как может потребоваться получить изображение с сервера и т. д.). Они предлагают прослушиватель событий, хотя, вы можете использовать его для прослушивания ready event, как это:

google.visualization.events.addListener(visualization, 'ready', function() { 
    $(".gallery a[rel^='prettyPhoto']").prettyPhoto1({theme:'facebook'}); 
}); 

Добавьте этот код между эти две линии так, это обязательно пожара:

visualization = new google.visualization.Table(document.getElementById('table')); 
visualization.draw(data, {'allowHtml': 'true'}, {'showRowNumber': 'true'}, {'firstRowNumber': '1'}); 

Этот будет гарантировать, что .prettyPhoto1() запускается после того, как все элементы будут загружены и готовы к работе, в том числе и в визуализации. В этом случае все еще не учитываются document.ready, только запустите плагин один раз.