2013-05-10 138 views
1

用戶將輸入圖形的數據。我已經使用了一條劃線,但我無法獲得正確的位置。這是我的代碼到目前爲止。由於Java環境被嵌入到網頁中,因此我無法使用條形圖庫。如何使用javascript創建簡單的條形圖

// Ex5-1: Weather Data Graph 
enter code herevar canvas; 
canvas = openGraphics(); 
var sun; 
var n; 
var xposition; 
xposition = 40; 
sun = prompt("enter the sun"); 
sun = parseInt(sun, 10); 
///xposition= xposition +10; 
canvas.drawLine(40, 10, 40, 245); 
canvas.drawLine(40, 245, 390, 245); 
canvas.drawString("225 ", 10, 30); 
canvas.drawString("180 ", 10, 70); 
canvas.drawString("135 ", 10, 110); 
canvas.drawString("90 ", 10, 150); 
canvas.drawString("45 ", 10, 190); 
canvas.drawString("0 ", 10, 230); 
canvas.drawString("J ", 50, 250); 
canvas.drawString("F ", 80, 250); 
canvas.drawString("M ", 110, 250); 
canvas.drawString("A ", 140, 250); 
canvas.drawString("M ", 170, 250); 
canvas.drawString("J ", 200, 250); 
canvas.drawString("J ", 230, 250); 
canvas.drawString("A ", 260, 250); 
canvas.drawString("S ", 290, 250); 
canvas.drawString("O ", 320, 250); 
canvas.drawString("N ", 350, 250); 
canvas.drawString("D ", 380, 250); 
canvas.setStroke(30); 
canvas.drawLine(xposition, 230, xposition, sun); 
canvas.paint(); 
+1

瀏覽器中的Java環境? Javascript與java無關嗎?或者你的意思是你在網頁中嵌入了一個Java applet?您可以隨時查看http://d3js.org/,這是一個方便的可視化JavaScript庫。 – 2013-05-10 00:55:46

+0

同意Stefan。你甚至可以看看https://developers.google.com/chart/ – Madthew 2013-05-10 00:58:10

+0

如果我們可以訪問drawString和drawLine – 2013-05-10 01:09:15

回答

1

除非你正在寫此javascript條海圖作爲練習,我會用jqplot

+1

對不起,我不能使用像jqplot這樣的庫,因爲我在嵌入了Java的網頁上創建條形圖,如果這樣做有道理的話(難以解釋我的大聲笑)。我需要根據老師給我的日照時間創建一個天氣條形圖,然後將這一年的每個月的這些日照時間繪製在條形圖上(例如,圖表上一月份的30小時等) 。我只可以使用任何的Javascript基礎代碼(我認爲這是JavaScript的,它提供的模塊指南中說,這)是可用的,所以不能帶來任何外部libaries到該網頁,只是原始的JavaScript。 – user2368310 2013-05-10 01:25:34

相關問題