2012-10-04 19 views
22

मैं अपने मुद्दे को हल कर लिया है, लेकिन यह अपने आप को उत्तर नहीं दे सकता क्योंकि मैं इस साइट के लिए बहुत नया हूँ:"कंटेनर से परिभाषित नहीं है" गूगल चार्ट

पता चला मैं निम्नलिखित का उपयोग करने की जरूरत:

chart = new google.visualization.PieChart(document.getElementById('pie_today_div')); 

मैं तत्व का उपयोग करने के लिए JQuery का उपयोग कर रहा था, $('#pie_today_div')। इस तथ्य को अब साक्ष्य अंक के रूप में piechart निर्माता मानक जे एस कोड है नहीं है, document.getElementById('pie_today_div')

हो सकता है कि कुछ और चल रहा है, लेकिन मैं कंटेनर तत्व का उपयोग जिस तरह से बदल रहा है मेरी कोड

मूल समस्या को ठीक करता मेरे समाधान के संदर्भ में

मुझे Google PieChart ऑब्जेक्ट को तुरंत चालू करने का प्रयास करने पर "कंटेनर परिभाषित नहीं किया गया" त्रुटि प्राप्त हो रही है।

मैंने अपने पृष्ठ को http://validator.w3.org/ पर मान्य किया और मुझे एक सुंदर हरा बैनर मिलता है जो यह मान्य करता है।

पृष्ठ लोड होने पर मुझे कोई जेएस त्रुटियां नहीं मिलती हैं। मेरा अजाक्स कॉल डीबी से इच्छित डेटा के साथ एक पूर्ण दौर यात्रा कर रहा है। alert($('#pie_today_div').attr('id')); <:

function drawPieChartToday() { 

    $.post('/call/ajax.php5',{ 
     action:'pieToday' 
    }, function(ticketData) { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Count'); 
     data.addColumn('number', 'Topic'); 
     for (var key in ticketData){ 
      data.addRow([key, ticketData[key]]); 
     } 
     options = { 
      title: 'Issue Topics' 
     }; 
     alert($('#pie_today_div').attr('id')); 
     chart = new google.visualization.PieChart($('#pie_today_div')); 
     chart.draw(data, options); 
    },'json');  
} 

यहाँ बनाने के लिए मेरी डिबगिंग कोड यकीन तत्व पाया जा रहा था है:

यहाँ मेरी एचटीएमएल

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 
     <link href="/css/note.css?10022012" rel="stylesheet" type="text/css" media="screen"> 
     <script type="text/javascript" language="javascript" src="/call/js/jquery-1.7.2.min.js"></script> 
     <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
     <script type="text/javascript">google.load('visualization', '1.0', {'packages':['corechart']});</script> 
     <script type="text/javascript" language="javascript" src="/call/js/init.js?10042012-2"></script> 
     <title>Call Stats</title> 
    </head> 
    <body> 
     <a href="#" id="pie_today_link">Today Stats</a> 
     <div id="pie_today_div"></div> 
    </body> 
</html> 

यहाँ है js है - अलर्ट "pie_today_div"

+1

मेरा उत्तर देखें, कारण यह है कि jquery चयनकर्ता अद्वितीय आईडी का चयन करते समय मिलान किए गए तत्वों (एक सरणी) का एक सेट देता है। – abidibo

+0

यह एक बहुत ही उपयोगी जानकारी थी, मुझे इसे अपने बाकी आईटी जीवन के लिए याद रखना होगा। –

उत्तर

28

मैं एक jquery प्रशंसक नहीं हूँ, लेकिन मुझे लगता है कि $ ('# pie_today_div') मिलान किए गए तत्वों का एक सेट देता है। विशेषता गणना काम करती है क्योंकि (jquery documentation से) "मिलान किए गए तत्वों के सेट में पहले तत्व के लिए एक विशेषता का मान प्राप्त होता है"।

तो

chart = new google.visualization.PieChart($('#pie_today_div')[0]); 

या सीधे

chart = new google.visualization.PieChart(document.getElementById('pie_today_div')); 
+1

कक्षा नाम का उपयोग कैसे करें? – Gowri

+1

चार्ट = नया google.visualization.PieChart ($ ('। Class-name') [0]); – abidibo

-1

बस उल्लेख करना चाहता था की कोशिश, यह एक सरल गलती के बाद मेरे लिए हुआ है। मैं चार्ट प्रकार बदलने के प्रयास में निम्नलिखित को

var data = new google.visualization.DataTable(huh); 

बदल दिया है:

var data = new google.visualization.BarChart(huh); 

लेकिन यह सब गलत है, तो आप चार्ट में परिवर्तन, जिसमें आप कंटेनर का उल्लेख:

var chart = new google.visualization.ComboChart(document.getElementById('chart_div')); 
1

वहां ऐसी लाइन होनी चाहिए जहां आप अपने वेब पेज में विज़ुअलाइज़ेशन के प्रकार लोड कर सकें।ऐसा लगता है कि यह

google.load("visualization", "1", {packages: ["corechart"]}); 

यहां मैं पैकेज corechart लोड कर रहा हूं। Index.html जैसे अपने HTML पृष्ठ के अंदर <script> टैग में इस पंक्ति को पहली पंक्ति के रूप में रखें। वह समस्या हल करना चाहिए।

8

एक कंटेनर त्रुटि ठीक, यह आईडी उदाहरण के लिए लग रही है है:

var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 

अगर आपको लगता है कि आईडी इस प्रकार याद कर रहे हैं तो आपको यह त्रुटि गूगल चार्ट के लिए "कंटेनर से परिभाषित नहीं है" मिल जाएगा उस div_div आईडी के साथ एक div यह