Over the past year, they have seen the Canvas technology develop and have investigated many of its shortcomings. Rich Apodaca continues to be at the forefront of emerging web technologies and provides insight on their impact to the sciences, including javascript/Canvas, on his blog Depth-First. Expect this technology to allow for quick and engrossing graphics without the need for fully installed applications on the desktop. Brad Larson at Sunset Lake Software mastered the technology to create the impressive Molecules app on the iPhone. While OpenGL ES (OpenGL for Embedded Systems) is only a subset of OpenGL, it has proven to be quite effective in producing great 3D molecular graphics on non-desktop platforms. Imagine advanced quantum computations with beautiful output, wide-spread open source simulation packages, and functional molecular modelers all optimized for the web and easily integrated into Web 3.0 sites! We will be developing 3D ChemDoodle Web Components as soon as WebGL is adopted by the browsers, and we aim to provide the funding, development and support for this open source package that the community requires. We will soon be able to develop fully native web applications with 2D and 3D graphical user interfaces completely in javascript for web browsers. WebGL opens new possibilities for the Canvas element, and I quote the best explanation I’ve seen so far, “The goal of WebGL is to expose the low-level OpenGL ES 2.0 APIs through JavaScript so that they can be used to draw hardware-accelerated 3D graphics in the HTML Canvas element” ( source). Some readers may already be very familiar with WebKit, as it is the open source browser engine that runs Safari. Only a couple days ago, WebGL (complete with a very impressive video!) was quietly introduced into the nightly build of WebKit. The Canvas element, as currently implemented, allows for only 2D graphics. File Loader– allow users to load their own molecule files straight to your web based algorithms.MolGrabber– provide access to databases such as PubChem right on your website.Doodler– draw structures with an interface that mimics ChemDoodle.Transformer– rotate, scale and translate structures.Rotator– provide a rotating animation of structures.The ChemDoodle Web Components currently provide 6 extendable graphical components as well as a growing cheminformatics library: By using javascript to create scientific applications, implementation is simplified, extensibility is improved, security issues are handled by the browser and the most widespread programming language in the world is now more accessible to scientists. By utilizing this powerful element, we were able to develop a software development kit, complete with graphical user interface components, completely in javascript. On Mac OSX, Apple Safari 4+, Mozilla Firefox 3.5+ and Google Chromium all support Canvas beautifully. The HTML 5 specification has not been completely adopted by all browsers yet, but it should be fully implemented on most browsers soon. The Canvas element allows web developers to dynamically draw 2D vector graphics in a web page without the use of 3rd party plugins, such as Flash or Silverlight. They leverage the technology of the HTML 5 specification’s Canvas element. These components are powerful, fully customizable, easy to implement, and are free under the open source GPL license (this does not mean that your website needs to be GPL). Introduction and BackgroundĬhemDoodle Web Components are pure javascript objects derived from ChemDoodle™ to solve common chemistry related tasks on the web. Javascript is also important, but those experienced in other programming languages should be able to follow the code with ease. The example is of moderate difficulty, and the reader should have prior knowledge of HTML. In the walkthrough, I produce a small application that queries the Protein Data Bank (PDB), displays 3D animations of the results, and saves a viewing history. In this article, I provide some background and analysis of the javascript/ Canvas technology along with future prospects followed by a step-by-step walkthrough on how to quickly put together a rich web application with the ChemDoodle Web Components. Protein Data Bank Demo and Canvas Technology Analysis Walkthrough for a Demo PDB Web Application.Protein Data Bank Demo and Canvas Technology Analysis.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |