2012-12-26 15 views
10

jsfiddle'da, sol taraftaki seçenekte no wrap(head), no wrap(body), OnDomReady ve OnLoad ayarlarını yapma seçeneği vardır. Programımda no wrap(head) koşulunu ayarlamak. Onun işi iyi. Ama ben HTML dosyasına nasıl giriyorum. ?html başlığında ve gövdede Nowrap koşulu

JSFIDDLE İşte ben HTML no-wrap(head) aynı koşul dosya set nasıl no-wrap(head) ayarlayın: Benim HTML ayarlamanız gerekir Aynı durum

Demo dosya. tavsiye için

İşte benim tam kod

<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
<script type="text/javascript" src="a.js"></script> 
<script type="text/javascript"> 
google.load('visualization', '1', {packages: ['corechart']}); 
google.setOnLoadCallback(drawVisualization); 

function drawVisualization() { 
var data = google.visualization.arrayToDataTable([ 
    ['Country', 'Popularity'], 
    ['Germany', 200], 
    ['United States', 300], 
    ['Brazil', 400], 
    ['Canada', 500], 
    ['France', 600], 
    ['Russia', 700] 
]); 

// this chart is drawn in a visible div and then immediately hidden 
var chart1 = new google.visualization.PieChart(document.getElementById('chart_1')); 

google.visualization.events.addListener(chart1, 'ready', function() { 
    // hide the div when done drawing 
    document.getElementById('chart_1').style.display = 'none'; 

    // create an event listener for the button that shows the chart 
    document.getElementById('clickMe1').onclick = function() { 
     document.getElementById('chart_1').style.display = 'block'; 
    } 
}); 

// show the div before you draw 
document.getElementById('chart_1').style.display = 'block'; 

chart1.draw(data, { 
    height: 300, 
    width: 400, 
    title: 'Chart 1' 
}); 


// this chart only gets drawn when the button is clicked 
var chart2 = new google.visualization.PieChart(document.getElementById('chart_2')); 

// create an event listener for the button that shows the chart 
document.getElementById('clickMe2').onclick = function() { 
    document.getElementById('chart_2').style.display = 'block'; 
    chart2.draw(data, { 
     height: 300, 
     width: 400, 
     title: 'Chart 2' 
    });    
} 
} 
</script> 
<style type="text/css"> 
#visualization path { 
cursor: pointer 
} 
</style> 

    </head> 
    <body> 
<input type="button" value="Show chart 1" id="clickMe1" /> 
<input type="button" value="Show chart 2" id="clickMe2" /> 
<div id="chart_1" style="display: none"></div> 
<div id="chart_2" style="display: none"></div> 
    </body> 
</html> 

teşekkürler.

cevap

7
+0

Merhaba, html kodumu burada güncelliyorum. Kodumda tüm javascript baş etiketinin içine yerleştirildi. Ama neden işe yaramıyor? – Selvamani

+0

Bu satırda close 'script' etiketini kaçırıyorsunuz'

3

Sadece komut

hiçbir sarma (baş), JSFiddle Docs itibaren <html>

arasında <head> bölümünde eklenir anlamına gelir: <head> koyun, JavaScript kodu sarmak yok bölüm

Here ne migh bir demo Kullanmak (tek bir yerde tüm HTML). basitçe dokümantasyon sayfasından <head> etiketleri arasına

JavaScript'inizi yerleştirmek demektir

+0

JSFiddle Documentation, teşekkür ederim may know, ie8 belge modunda bu kod çalışması içinde senin makinen? Eğer değilse nasıl düzeltebilirim, çünkü bu keman IE8 belge modunda çalışır. – Selvamani

+0

Hayır, öyle değil ama bunun, google grafiklerinin IE8’in belge moduyla ilgili bazı problemleri olduğunu hatırlıyorum. [** Bunu kontrol et **] (http://stackoverflow.com/questions/13081894/ie8- değil destekleyici-google-grafikler-pasta-grafik) –

+0

http://jsfiddle.net/3KxFZ/2/ ama burada ie8 belge modunda görünen ikinci parçacığı, Nasıl? – Selvamani