{"id":3183,"date":"2010-12-24T19:38:51","date_gmt":"2010-12-24T19:38:51","guid":{"rendered":"http:\/\/www.ch.ic.ac.uk\/rzepa\/blog\/?p=3183"},"modified":"2010-12-24T19:38:51","modified_gmt":"2010-12-24T19:38:51","slug":"chemdoodle","status":"publish","type":"post","link":"https:\/\/www.rzepa.net\/blog\/?p=3183","title":{"rendered":"Embedding molecules in blogs: ChemDoodle, WebGL and SVG"},"content":{"rendered":"<div class=\"kcite-section\" kcite-section-id=\"3183\">\n<p>If you get a small rotatable molecule below, then ChemDoodle\/HTML5\/WebGL is working. Why might this be important? Well, the future is mobile, in other words, devices that rely on batteries or other sources of built-in power. This means the power guzzling GPU cards of the past (some reach ~400 Watts!) cannot be used. Rather than using e.g. a full power OpenGL library, one will use Web-based graphics libraries, which (to <a href=\"http:\/\/en.wikipedia.org\/wiki\/WebGL\" target=\"_blank\">quote Wikipedia)<\/a> <em>extends the capability of the\u00a0JavaScript programming language to allow it to generate interactive\u00a03D graphics within any compatible\u00a0web browser<\/em>. A typical target device might be for example Apple&#8217;s iPad (for which the redoubtable <a href=\"http:\/\/www.ch.imperial.ac.uk\/rzepa\/blog\/?p=8\">Jmol<\/a>, which is based on Java, is unlikely to ever work).<\/p>\n<p>To find out if your device and its browser can support this type of graphical display, go to either <a href=\"http:\/\/web.chemdoodle.com\/about\/html5\" target=\"_blank\">this test page<\/a> or this <a href=\"https:\/\/www.khronos.org\/registry\/webgl\/sdk\/tests\/webgl-conformance-tests.html\" target=\"_blank\">more general one<\/a> (which at the time of writing actually gets the WebGL test wrong!).<\/p>\n<p>I have deployed an earlier graphical methodology in other posts (SVG), which many browsers now support. This combination of HTML5, SVG and WebGL is the future! For its use on another blog, <a href=\"http:\/\/molecularmodelingbasics.blogspot.com\/2011\/02\/chemdoodling-now-in-3d-but-not-yet-on.html\">see here<\/a>.<\/p>\n<p>\n<script id=\"a1\" type=\"text\/javascript\">\/\/ < ![CDATA[\n\/\/< ![CDATA[\n        var transformBallAndStick1 = new ChemDoodle.TransformCanvas3D('transformBallAndStick1', 300, 300);\n        transformBallAndStick1.specs.set3DRepresentation('Ball and Stick');\n        transformBallAndStick1.specs.backgroundColor = 'white';\n        var molFile = httpGet( 'wp-content\/uploads\/2011\/12\/trefoil.mol' );\n        var molecule = ChemDoodle.readMOL(molFile, 2);\n        transformBallAndStick1.loadMolecule(molecule);\n\/\/ ]]><\/script><\/p>\n<!-- kcite active, but no citations found -->\n<\/div> <!-- kcite-section 3183 -->","protected":false},"excerpt":{"rendered":"<p>If you get a small rotatable molecule below, then ChemDoodle\/HTML5\/WebGL is working. Why might this be important? Well, the future is mobile, in other words, devices that rely on batteries or other sources of built-in power. This means the power guzzling GPU cards of the past (some reach ~400 Watts!) cannot be used. Rather than [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[3],"tags":[477,424,484,485,202,486,487,490,491,493,377,494,495],"class_list":["post-3183","post","type-post","status-publish","format-standard","hentry","category-chemical-it","tag-3d-graphics","tag-apple","tag-gpu","tag-html5","tag-ipad","tag-java","tag-javascript","tag-opengl-library","tag-svg","tag-typical-target-device","tag-web-browser","tag-web-based-graphics-libraries","tag-webgl"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p1gPyz-Pl","jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=\/wp\/v2\/posts\/3183","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3183"}],"version-history":[{"count":0,"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=\/wp\/v2\/posts\/3183\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3183"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3183"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rzepa.net\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3183"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}