Skip to content

Commit 67bd106

Browse files
authored
Merge pull request #168 from whitead/patch-1
Add svelte example to README
2 parents 98237c6 + e05083c commit 67bd106

File tree

1 file changed

+46
-0
lines changed

1 file changed

+46
-0
lines changed

README.md

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,52 @@ Current Version: **2.1.5**
2525
</tbody>
2626
</table>
2727

28+
### Examples in Specific Frameworks
29+
30+
<details>
31+
<summary>Svelte </summary>
32+
33+
34+
```html
35+
<!--file:Molecule.svlete-->
36+
<!--Tested against v2.1.7 of smiles-drawer-->
37+
<script>
38+
import { afterUpdate } from "svelte";
39+
import SmilesDrawer from "smiles-drawer";
40+
41+
export let smiles = "";
42+
43+
const SETTINGS = {
44+
width: 300,
45+
height: 200,
46+
};
47+
let drawer = new SmilesDrawer.SvgDrawer(SETTINGS);
48+
let svgElement;
49+
50+
afterUpdate(() => {
51+
SmilesDrawer.parse(smiles, function (tree) {
52+
drawer.draw(tree, svgElement, "light");
53+
});
54+
});
55+
</script>
56+
57+
<div>
58+
<svg bind:this={svgElement} data-smiles={smiles} />
59+
</div>
60+
61+
<style>
62+
svg {
63+
width: 300px;
64+
height: 200px;
65+
}
66+
</style>
67+
68+
<!--usage-->
69+
<Molecule smiles="CCCO" />
70+
```
71+
72+
</details>
73+
2874
### Please cite
2975

3076
If you use this code or application, please cite the original paper published by the Journal of Chemical Information and Modeling: [10.1021/acs.jcim.7b00425](http://dx.doi.org/10.1021/acs.jcim.7b00425)

0 commit comments

Comments
 (0)