HTML5在工作量管理系統中的應用

摘 要 工作量管理在高校管理工作中必不可少，本文主要介紹工作量圖表的跨平臺顯示，以便于用戶利用PC和智能客戶端進行管理。具體實現采用基于HTML5的圖表組件—icharjs，此組件體積小，支持跨平臺，以此設計的系統是一種高效便捷的工作量管理系統。

【關鍵詞】工作量管理 圖表 跨平臺

1 高等學校工作量管理現狀及其成因分析

目前工作量管理現狀如下：在統計工作量時，雖然很多教師每年填寫工作量表格，但是問題層出不窮，效果依舊不理想；高校在年度聘后管理和職稱評定時也需要教師近五年的工作量，教師每年都需要到學院辦公室查詢工作量。究其原因就是多數高校對于工作量的統計和查詢工作完全停留在全紙質階段，管理及查詢十分不方便，與當前的互聯網時代嚴重脫節。如何進行行之有效的工作量管理是值得思考和解決的問題。

2 構建工作量管理方式的解決方案與方法

教師工作量管理工作是每個學校都需要完成的工作，據此設計的系統從宏觀角度來說，總計用戶不在少數；從學校要求角度來看，教師需要通過系統來添加、修改和查詢工作量，分析以上需求，系統設計考慮跨平臺（Windows、IOS、Android）應用，以適應當前PC聯網管理及智能客戶端管理的需求。通常解決方案是采用B/S模式，但有些插件并不能在多平臺通用。這些都是系統設計時要考慮的問題。

下面就介紹一下解決上述問題的解決技術與實現方法。

2.1 HTML5

計算機技術中能夠實現網頁圖表的框架有很多，比如charts4j，它是基于Google Chart API的一個開源輕量級框架， 不適合于國內使用；ACharEngine也是一種制作圖表的框架，但其只是安卓系統上制作圖表的框架；相較于上述兩個框架， ichartjs是純JS實現的圖表式報表框架，是一款基于HTML5的輕量級圖形庫，致力于提供簡單、直觀、可交互的體驗級圖表組件，是WEB/APP圖表展示方面的解決方案。無論是Windows平臺，還是lOS或Android平臺，ichartjs都能在不改動任何代碼的前提下提供統一的視圖。Icharjs可以實現多種圖，如餅圖、柱形圖、環形圖等，用戶可以根據需要來改其源碼從而實現自己所需要的功能。

2.2應用icharjs實現2D柱形圖

在HTML5出現之前，為了在Browser（B）上顯示圖表，通常需要Server（S）端預先生成圖表。如果希望在服務器端動態生成圖表，則需要通過其他的服務器組件來參與完成。 ichartjs 是一個利用html5 canvas 的一個圖表類組件，編程風格類似ExtJs ，它可以在頁面上根據配置的數據動態的生成需要的圖形。icharjs的環境構建簡單，只要將ichart.js加入html頁面的head標簽中即可完成。

本文利用ichartjs以2D柱形圖為例表示工作量統計結果在PC及手機客戶端的設計方法與最終效果。在下面的例子中具體實現了某教師近五年工作量的圖表，首先定義一組準備顯示的數據作為公共部分。本系統初期先將數據固定顯示，最終系統會通過webView的api來實現javascript調用動態傳遞數據來更新圖表。無論是通過android聯網，還是是通過webservice獲取服務端的數據，只要數據打包成json格式即可，因為ichartjs規定的數據源統一采用json對象方式。其次，定義繪制圖表的函數，即可將圖表顯示出來。此函數與Javascript中的onload事件類似，在會頁面或圖像加載完成后立即發生。

在PC瀏覽器上的顯示效果如圖1所示。

在android模擬器端采用的運行環境是myeclipse2014及google chrome，模擬結果為如圖2所示。

3 總結

本文根據高校教務管理部門及教師個人對于工作量管理的需求，提出采用基于HTML5的圖表組件ichartjs繪制工作量管理系統中的圖表，在理論上闡述了ichartjs的基本原理，通過實驗，驗證了本文方法能過完成工作量的跨平臺管理。由于ichartjs可以繪制多種圖表，也為工作量管理系統在日后的繼續完善和擴展中提供了良好的基礎。

參考文獻

[1]唐彬.利用HTML5實現網頁圖表的研究[J].微型電腦應用，2012（10）.

作者簡介

王婷（1982-），女，吉林省白城市人。碩士研究生學歷。主要研究方向為圖形圖像處理、計算機應用。

作者單位

白城師范學院 吉林省白城市 137000endprint

摘 要 工作量管理在高校管理工作中必不可少，本文主要介紹工作量圖表的跨平臺顯示，以便于用戶利用PC和智能客戶端進行管理。具體實現采用基于HTML5的圖表組件—icharjs，此組件體積小，支持跨平臺，以此設計的系統是一種高效便捷的工作量管理系統。

【關鍵詞】工作量管理 圖表 跨平臺

1 高等學校工作量管理現狀及其成因分析

目前工作量管理現狀如下：在統計工作量時，雖然很多教師每年填寫工作量表格，但是問題層出不窮，效果依舊不理想；高校在年度聘后管理和職稱評定時也需要教師近五年的工作量，教師每年都需要到學院辦公室查詢工作量。究其原因就是多數高校對于工作量的統計和查詢工作完全停留在全紙質階段，管理及查詢十分不方便，與當前的互聯網時代嚴重脫節。如何進行行之有效的工作量管理是值得思考和解決的問題。

2 構建工作量管理方式的解決方案與方法

教師工作量管理工作是每個學校都需要完成的工作，據此設計的系統從宏觀角度來說，總計用戶不在少數；從學校要求角度來看，教師需要通過系統來添加、修改和查詢工作量，分析以上需求，系統設計考慮跨平臺（Windows、IOS、Android）應用，以適應當前PC聯網管理及智能客戶端管理的需求。通常解決方案是采用B/S模式，但有些插件并不能在多平臺通用。這些都是系統設計時要考慮的問題。

下面就介紹一下解決上述問題的解決技術與實現方法。

2.1 HTML5

計算機技術中能夠實現網頁圖表的框架有很多，比如charts4j，它是基于Google Chart API的一個開源輕量級框架， 不適合于國內使用；ACharEngine也是一種制作圖表的框架，但其只是安卓系統上制作圖表的框架；相較于上述兩個框架， ichartjs是純JS實現的圖表式報表框架，是一款基于HTML5的輕量級圖形庫，致力于提供簡單、直觀、可交互的體驗級圖表組件，是WEB/APP圖表展示方面的解決方案。無論是Windows平臺，還是lOS或Android平臺，ichartjs都能在不改動任何代碼的前提下提供統一的視圖。Icharjs可以實現多種圖，如餅圖、柱形圖、環形圖等，用戶可以根據需要來改其源碼從而實現自己所需要的功能。

2.2應用icharjs實現2D柱形圖

在HTML5出現之前，為了在Browser（B）上顯示圖表，通常需要Server（S）端預先生成圖表。如果希望在服務器端動態生成圖表，則需要通過其他的服務器組件來參與完成。 ichartjs 是一個利用html5 canvas 的一個圖表類組件，編程風格類似ExtJs ，它可以在頁面上根據配置的數據動態的生成需要的圖形。icharjs的環境構建簡單，只要將ichart.js加入html頁面的head標簽中即可完成。

本文利用ichartjs以2D柱形圖為例表示工作量統計結果在PC及手機客戶端的設計方法與最終效果。在下面的例子中具體實現了某教師近五年工作量的圖表，首先定義一組準備顯示的數據作為公共部分。本系統初期先將數據固定顯示，最終系統會通過webView的api來實現javascript調用動態傳遞數據來更新圖表。無論是通過android聯網，還是是通過webservice獲取服務端的數據，只要數據打包成json格式即可，因為ichartjs規定的數據源統一采用json對象方式。其次，定義繪制圖表的函數，即可將圖表顯示出來。此函數與Javascript中的onload事件類似，在會頁面或圖像加載完成后立即發生。

在PC瀏覽器上的顯示效果如圖1所示。

在android模擬器端采用的運行環境是myeclipse2014及google chrome，模擬結果為如圖2所示。

3 總結

本文根據高校教務管理部門及教師個人對于工作量管理的需求，提出采用基于HTML5的圖表組件ichartjs繪制工作量管理系統中的圖表，在理論上闡述了ichartjs的基本原理，通過實驗，驗證了本文方法能過完成工作量的跨平臺管理。由于ichartjs可以繪制多種圖表，也為工作量管理系統在日后的繼續完善和擴展中提供了良好的基礎。

參考文獻

[1]唐彬.利用HTML5實現網頁圖表的研究[J].微型電腦應用，2012（10）.

作者簡介

王婷（1982-），女，吉林省白城市人。碩士研究生學歷。主要研究方向為圖形圖像處理、計算機應用。

作者單位

白城師范學院 吉林省白城市 137000endprint

摘 要 工作量管理在高校管理工作中必不可少，本文主要介紹工作量圖表的跨平臺顯示，以便于用戶利用PC和智能客戶端進行管理。具體實現采用基于HTML5的圖表組件—icharjs，此組件體積小，支持跨平臺，以此設計的系統是一種高效便捷的工作量管理系統。

【關鍵詞】工作量管理 圖表 跨平臺

1 高等學校工作量管理現狀及其成因分析

目前工作量管理現狀如下：在統計工作量時，雖然很多教師每年填寫工作量表格，但是問題層出不窮，效果依舊不理想；高校在年度聘后管理和職稱評定時也需要教師近五年的工作量，教師每年都需要到學院辦公室查詢工作量。究其原因就是多數高校對于工作量的統計和查詢工作完全停留在全紙質階段，管理及查詢十分不方便，與當前的互聯網時代嚴重脫節。如何進行行之有效的工作量管理是值得思考和解決的問題。

2 構建工作量管理方式的解決方案與方法

教師工作量管理工作是每個學校都需要完成的工作，據此設計的系統從宏觀角度來說，總計用戶不在少數；從學校要求角度來看，教師需要通過系統來添加、修改和查詢工作量，分析以上需求，系統設計考慮跨平臺（Windows、IOS、Android）應用，以適應當前PC聯網管理及智能客戶端管理的需求。通常解決方案是采用B/S模式，但有些插件并不能在多平臺通用。這些都是系統設計時要考慮的問題。

下面就介紹一下解決上述問題的解決技術與實現方法。

2.1 HTML5

計算機技術中能夠實現網頁圖表的框架有很多，比如charts4j，它是基于Google Chart API的一個開源輕量級框架， 不適合于國內使用；ACharEngine也是一種制作圖表的框架，但其只是安卓系統上制作圖表的框架；相較于上述兩個框架， ichartjs是純JS實現的圖表式報表框架，是一款基于HTML5的輕量級圖形庫，致力于提供簡單、直觀、可交互的體驗級圖表組件，是WEB/APP圖表展示方面的解決方案。無論是Windows平臺，還是lOS或Android平臺，ichartjs都能在不改動任何代碼的前提下提供統一的視圖。Icharjs可以實現多種圖，如餅圖、柱形圖、環形圖等，用戶可以根據需要來改其源碼從而實現自己所需要的功能。

2.2應用icharjs實現2D柱形圖

在HTML5出現之前，為了在Browser（B）上顯示圖表，通常需要Server（S）端預先生成圖表。如果希望在服務器端動態生成圖表，則需要通過其他的服務器組件來參與完成。 ichartjs 是一個利用html5 canvas 的一個圖表類組件，編程風格類似ExtJs ，它可以在頁面上根據配置的數據動態的生成需要的圖形。icharjs的環境構建簡單，只要將ichart.js加入html頁面的head標簽中即可完成。

本文利用ichartjs以2D柱形圖為例表示工作量統計結果在PC及手機客戶端的設計方法與最終效果。在下面的例子中具體實現了某教師近五年工作量的圖表，首先定義一組準備顯示的數據作為公共部分。本系統初期先將數據固定顯示，最終系統會通過webView的api來實現javascript調用動態傳遞數據來更新圖表。無論是通過android聯網，還是是通過webservice獲取服務端的數據，只要數據打包成json格式即可，因為ichartjs規定的數據源統一采用json對象方式。其次，定義繪制圖表的函數，即可將圖表顯示出來。此函數與Javascript中的onload事件類似，在會頁面或圖像加載完成后立即發生。

在PC瀏覽器上的顯示效果如圖1所示。

在android模擬器端采用的運行環境是myeclipse2014及google chrome，模擬結果為如圖2所示。

3 總結

本文根據高校教務管理部門及教師個人對于工作量管理的需求，提出采用基于HTML5的圖表組件ichartjs繪制工作量管理系統中的圖表，在理論上闡述了ichartjs的基本原理，通過實驗，驗證了本文方法能過完成工作量的跨平臺管理。由于ichartjs可以繪制多種圖表，也為工作量管理系統在日后的繼續完善和擴展中提供了良好的基礎。

參考文獻

[1]唐彬.利用HTML5實現網頁圖表的研究[J].微型電腦應用，2012（10）.

作者簡介

王婷（1982-），女，吉林省白城市人。碩士研究生學歷。主要研究方向為圖形圖像處理、計算機應用。

作者單位

白城師范學院 吉林省白城市 137000endprint