主題: [其他] [分享]用JavaScript畫統計圖 [打印本頁]
發表人:
ROACH 時間: 2009-2-28 04:34 PM 主題: [分享]用JavaScript畫統計圖
景氣不好的時候
公司各部門總會提出很多想法要讓公司更好
所以最近忙死的
最近使用者提出
要讓公司的erp系統主動發信通知供應商
信中除的有供應商狀況以外還有統計圖
程式主動產生統計圖喔！！！！
以前我畫統計圖都用java的JFreeChart直接在網頁上呈現
但是怎樣在erp裡面寫程式自動發送email
這個email要用html語法搭配資料庫的db組合起來後
自動發信還要產生統計圖
真是要命..............
於是找的半天看到這個原來javascript就可以畫簡易統計圖的
http://www.lutanho.net/diagram/
我看裡面的語法很簡單
我只這樣作
把資料的每一點傳進去new Line(第一點x軸,第一點Y軸,第二點X軸,第二點y軸,"線顏色","粗細","");
這樣就會畫出底下的線出來的很方便呢
接下來我只要搭配公司的erp跑迴圈就可以發送給每個人不同的統計圖的
那個diagram.js要從它的網站下載回來放在自己的網站中比較好
我是用偷懶的方法直接從它的網站引用回來
<SCRIPT Language="JavaScript" src="http://www.lutanho.net/diagram/diagram.js"></SCRIPT>
document.open();
var D=new Diagram();
D.SetFrame(80, 160, 520, 360);
D.SetBorder(1, 12, 0, 100);
D.SetText("","", "每月銷售狀況圖");
D.XScale=" 月";
D.YScale="%";
D.XGridDelta=1;
D.SetGridColor("#cccccc");
D.Draw("#FFEECC", "#663300", false);
var t, T0, T1;
D.GetYGrid();
_BFont="font-family:Verdana;font-size:10pt;line-height:13pt;";
new Line(D.ScreenX(1), D.ScreenY(21), D.ScreenX(2), D.ScreenY(25), "#cc9966", 2,"百分比");
new Line(D.ScreenX(2), D.ScreenY(25), D.ScreenX(3), D.ScreenY(28), "#cc9966", 2,"百分比");
new Line(D.ScreenX(3), D.ScreenY(28), D.ScreenX(4), D.ScreenY(29), "#cc9966", 2,"百分比");
new Line(D.ScreenX(4), D.ScreenY(29), D.ScreenX(5), D.ScreenY(24), "#cc9966", 2,"百分比");
new Line(D.ScreenX(5), D.ScreenY(24), D.ScreenX(6), D.ScreenY(25), "#cc9966", 2,"百分比");
new Line(D.ScreenX(6), D.ScreenY(25), D.ScreenX(7), D.ScreenY(28), "#cc9966", 2,"百分比");
new Line(D.ScreenX(7), D.ScreenY(28), D.ScreenX(8), D.ScreenY(29), "#cc9966", 2,"百分比");
new Line(D.ScreenX(8), D.ScreenY(29), D.ScreenX(9), D.ScreenY(22), "#cc9966", 2,"百分比");
document.close();
[ROACH 在 2009-2-28 04:42 PM 作了最後編輯]
發表人:
GERRYccc 時間: 2009-2-28 11:15 PM
感謝提供超棒的方法，
不過他圖表出現的位置可以調整嗎？
發表人:
ROACH 時間: 2009-2-28 11:37 PM
位置??什麼位置
原則上這個javascript放在哪邊就出現在哪阿
如果要放在table裡面
就<table><tr><td>放這邊</td></tr></table>
這裡面我知道
這個是設定統計圖大小
D.SetFrame(80, 160, 520, 360);
這個是設定X軸畫12等份
Y軸從下到上共分100等份
D.SetBorder(1, 12, 0, 100);
這個好像是設定等份之間的間距
如果打上2就變成1、3、5、7、9、11
D.XGridDelta=1;
還有其他雜七雜八的功能可以點進去它網站看
它都有基礎語法教學，我都還沒把每個指令研究過
大家一起研究吧
| 歡迎光臨 TWed2k (http://twed2k.org/) |
Powered by Discuz! 4.1.0 |