goglfinger.blogg.se - Chemdoodle in canvas

CHEMDOODLE IN CANVAS INSTALL
CHEMDOODLE IN CANVAS UPDATE
CHEMDOODLE IN CANVAS CODE
CHEMDOODLE IN CANVAS SERIES

You can see how this is done below - all in a single function, parsesmiles. Once kemia was packaged I needed to use it to generate coordinates from a smiles string which would require using the smiles parser and the coordinate generation. Google Closure library, the source is included using the :libs option - which allows kemia modules and namespaces to be used just as if they were cljs files.

CHEMDOODLE IN CANVAS INSTALL

(right now they are pull requests - if you need them you can install them from my clsjsjs/packages branches) Because kemia uses the

I decided to package both the kemia and chemdoodle webcomponents libraries for cljsjs. By providing a standardĬonvention for packaging, these libraries can be included in new clojure/clojurescript projects using a simple :require The cljsjs team is working to provide an easy way to use JS libraries.

Try entering the following or type your own smiles tring into the box and click:.

The rest of this post documents how i made the widget below. Try your own smiles string, or paste in an example from below. The result is below (code here) and it is a pure-browser smiles-parsing widget.

clojurescript for all the glue code, DOM handling etc, ideally via React/ reagent.

ChemDoodle WebComponents for a nice-looking frontend.

kemias' smiles-parsing functionality as well as its structure- diagram generation facilities.

CHEMDOODLE IN CANVAS CODE

On the technical side, clojurescript offers the advantage of using Google’sĬlosure compiler, which, among other things, allows for dead code elimination. Inspired by clojure that has a vibrant and innovative community. To carry out this project I wanted to use clojurescript, a compile-to-javascript, lisp I was still interested in trying to generate images in the browser, however, and in his final post, Noel points the way by mentioning the kemia project, a javascript chemistry library that aims to be “the world’s first open source, 100% javascript chemistry toolkit.” The rest of this post is how I used kemia, ChemDoodle, and clojurescript to make pure-browser smiles-to-canvas widget. The JS file in order to call the smiles-to-svg function in another context but started running into errors with the generated code. However, upon attempting to reuse his smiles-to-svg functions on a different webpage I discovered that output of Emscripten is difficult to reuse (or at least not obvious to someone unfamiliar with ASM.js.

CHEMDOODLE IN CANVAS SERIES

As someone interested in using the browser to interact with molecules, I thought this was a great series of posts and thought I might even be able to reuse some of the javascript he had generated. To compile a number of chemoinformatics toolkits to Javascript including OpenBabel, This library is licensed under the MIT license.A few months back Noel O’Boyle wrote a series of blog posts wherein he used Emscripten

CHEMDOODLE IN CANVAS UPDATE

Run gulp bump to update the version number.

Some canvas 2d context methods are not implemented yet.

v1.0.1 Allow C2S to be called as a function.

v1.0.2 Split up rgba values set in fill/stroke to allow illustrator import support.

v1.0.3 fixed #4 where largeArcFlag was set incorrectly in some cases.

v1.0.4 generate ids that start with a letter.

v1.0.5 fixes for #5 and #6 (with contributions from KoKuToru).

v1.0.6 basic support for text baseline (contribution from KoKuToru).

v1.0.7 fixes for multiple transforms and fills and better text support from stafyniaksacha.

v1.0.8 reusing _createElement and adding a properties undefined check.

v1.0.9 use currentDefaultPath instead of 's d attribute, fixes stroke's different behavior in SVG and canvas.

v1.0.10 when lineTo called, use M instead of L unless subpath exists.

v1.0.11 call lineTo instead moveTo in ctx.arc, fixes closePath issue and straight line issue.

v1.0.13 set paint order before stroke and fill to make them behavior like canvas.

v1.0.14 bugfix for gradients, move _createElement to scoped createElement function, so all classes have access.

v1.0.15 Setup travis, add testharness and debug playground, and fix regression for _createElement refactor.

v1.0.16 Add npm publishing support, bower file and optimize for arcs with no angles.

v1.0.17 Fix bug with drawing in an empty context.

v1.0.18 clip was not working, the path never made it to the clip area.

You may not need node-canvas for some simple operations when using jsdom >= 6.3.0, but it's still recommended that you install it.

Var canvas = require ( 'canvas' ), jsdom = require ( 'jsdom' ), C2S = require ( 'canvas2svg' ) var document = jsdom.