江辰 陳明
摘要:Kekule.js是由作者自主編寫完成的一套基于Web技術(shù)的開源化學(xué)信息學(xué)工具包,其可視化方面的功能可將有機(jī)分子的立體模型嵌入網(wǎng)頁中。在有機(jī)化學(xué)課程的教學(xué)中,使用該工具包可制作一系列有關(guān)分子立體結(jié)構(gòu)的演示,并利用鼠標(biāo)或觸摸屏與分子進(jìn)行交互,進(jìn)而展示構(gòu)型、構(gòu)象等立體概念。此類頁面可直接在瀏覽器內(nèi)顯示,無需安裝任何額外軟件,使用便捷,也易于與現(xiàn)有的在線課程管理系統(tǒng)結(jié)合,既適合課上教師的講解,也利于學(xué)生課下的復(fù)習(xí)。
關(guān)鍵詞:Kekule.js;分子可視化;有機(jī)化學(xué);分子模型演示
中圖分類號:G642.0 文獻(xiàn)標(biāo)志碼:A 文章編號:1674-9324(2018)44-0158-02
一、引言
在大學(xué)有機(jī)化學(xué)課程的初始階段,學(xué)習(xí)者需要迅速建立起分子空間結(jié)構(gòu)的基本概念,此后的學(xué)習(xí)中,諸如手性、對映異構(gòu)、構(gòu)象分析乃至于反應(yīng)位阻分析等知識均與分子的立體形象有關(guān)。在涉及此類知識的教學(xué)中,教師也經(jīng)常采取各種輔助手段向?qū)W習(xí)者直觀演示分子的三維形象。目前最常見的做法是借助ChemOffice、VMD、RasMol、JMol等化學(xué)信息學(xué)軟件,使用鼠標(biāo)在屏幕或投影上操作虛擬的分子三維模型。此種方式成本較低,遠(yuǎn)距離較易觀察,適合課上演示,但需事先安裝相應(yīng)軟件,學(xué)生在課下復(fù)習(xí)時則有頗多不便之處。隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展,近年來也出現(xiàn)了一批基于Web技術(shù)的分子圖形學(xué)軟件,我們也自行開發(fā)了一套采用JavaScript編寫的開源化學(xué)信息學(xué)工具包Kekule.js。在教學(xué)中,我們利用此工具包展示分子模型,可直接將模型嵌入網(wǎng)頁中,在網(wǎng)絡(luò)瀏覽器或其他一些Web程序中顯示、操作,無需預(yù)裝軟件,也易于與網(wǎng)上課程管理系統(tǒng)結(jié)合。該工具包亦具備良好的跨平臺特性,PC或移動平臺中均可使用。
二、Kekule.js的使用
Kekule.js是一套功能強(qiáng)大的化學(xué)信息學(xué)工具包,支持多種分子數(shù)據(jù)格式的輸入輸出、化學(xué)結(jié)構(gòu)的2D/3D可視化以及一系列化學(xué)信息學(xué)算法的實現(xiàn)。我們在開發(fā)過程中還利用Emscripten將數(shù)個原以C/C++編寫的工具庫編譯為JavaScript并作為附加模塊整合進(jìn)Kekule.js以提供一些額外功能。如整合OpenBabel后可額外支持?jǐn)?shù)十種化學(xué)數(shù)據(jù)格式的讀寫,并提供一定的分子力學(xué)計算能力。此外為方便使用,工具包還封裝了數(shù)個可直接嵌入在HTML中的控件用以顯示或編輯化學(xué)結(jié)構(gòu)。日常教學(xué)中進(jìn)行分子立體模型演示時,只需使用Kekule.js的很少一部分功能,一般可直接利用Viewer3D控件。首先需在HTML頁面中引入必要的JavaScript與CSS樣式表文件。
href="themes/default/kekule.css" />
而后只需一行代碼即可將Viewer3D控件綁定到普通的HTML元素上。
mol)" data-molecule-display-type="34">
在對映異構(gòu)的教學(xué)段落,我們也特意編制了包含一對Viewer3D控件的演示頁面供學(xué)習(xí)者課后復(fù)習(xí)(圖1)。頁面中預(yù)置了一系列典型的手性/非手性分子的列表,當(dāng)用戶自列表中載入分子時,兩個Viewer3D控件將分別顯示分子的實物與鏡像模型。學(xué)習(xí)者可分別旋轉(zhuǎn)兩個模型,通過觀察其是否可以重疊來驗證原分子是否具有手性。原先學(xué)生往往不易理解一些較復(fù)雜的含有手性軸或手性面的分子,引入此頁面后,關(guān)于這類內(nèi)容的學(xué)習(xí)難度也有了明顯的降低。
教師能夠預(yù)先提供的三維分子數(shù)據(jù)總是有限的,很多時候,學(xué)習(xí)者也希望能夠查看其他一些分子的立體形象。為此,我們還特制了一個計算分子三維結(jié)構(gòu)的Web程序。用戶可在分子編輯器控件中利用鼠標(biāo)輸入平面結(jié)構(gòu),程序在后臺線程中調(diào)用OpenBabel附加模塊進(jìn)行分子力學(xué)計算,待計算完畢,即將生成的三維結(jié)構(gòu)顯示在Viewer3D中。由于整個過程均由JavaScript在用戶端瀏覽器中執(zhí)行,計算時并不額外消耗服務(wù)器資源,也易于在各類環(huán)境下進(jìn)行部署。
四、結(jié)語
在我們自身的有機(jī)化學(xué)教學(xué)中,基于web技術(shù)的Kekule.js工具包充分發(fā)揮了它在分子可視化方面的能力,能夠在無需安裝專門軟件的情況下跨平臺地對分子立體模型進(jìn)行演示。無論在教師授課還是學(xué)生的課下預(yù)習(xí)、復(fù)習(xí)環(huán)節(jié)上均取得了不錯的效果。加之Kekule.js是一開源的化學(xué)信息學(xué)工具包,使用上幾乎無費用與版權(quán)問題,也便于進(jìn)行二次開發(fā)以適應(yīng)個性化的需求,因此在教學(xué)上完全可以作為目前常用的ChemOffice、VMD等軟件的替代,具有相當(dāng)?shù)膽?yīng)用潛力。
參考文獻(xiàn):
[1]Dori YJ,Barak M.J.Educ.Technol.Soc.2001,4(1):61-74.
[2]唐律,麥裕華,李景寧.大學(xué)化學(xué).2008,23(4):47-50.
[3]鄭榮珍,嚴(yán)思儀,劉亞男,杜芬芬,蔡開聰.化學(xué)教育.2016,37(12):67-70.
[4]Jiang C,Jin X,Dong Y,Chen M.J.Chem.Inf.Model.2016,56(6):1132-1138.
[5]Jiang C,Jin X.J.Chem.Inf.Model.2017,57(10):2407-2412.
Abstract:Kekule.js,developed by the authors,is an open source JavaScript toolkit for cheminformatics.The toolkit can render chemical structure models in Web pages without the help of any other plugins or software. In the teaching of organic chemistry,the toolkit is ideal to help to demonstrate the interactive 3D molecule models and to explain the concept of configuration and conformation of organic compounds.Since those demonstration pages can be viewed in Web browsers directly,they can be integrated with existing lesson management system and be easily used by both teachers and students.
Key words:Kekule.js;molecular graphics;organic chemistry;molecular model presentation