jquery - Scala.js: Selecting and manipulating generated SVG -


i'm struggling seemingly simple.

using scaja.js, have generated svg scalatags library.

i wish manipulate svg elements using events:

circ.onclick = { e: dom.mouseevent => ... } 

specifically, want select elements of class , toggle class attributes on them.

i tried scala.js jquery binding. while can retrieve selections it, cannot manipulate selected elements (set classes etc). seems fundamental problem of svg being different kind of dom cannot manipulated jquery.

next, tried low level dom api. gets me selection:

document.body.getelementsbyclassname("myclass").foreach { node =>  ... } 

i struggle manipulating attributes of node. can access them cannot set them, node.attributes.setnameditem(...) requires raw.attr argument have trouble creating, there no constructor set name of attr.

also, going low level api quite inconvenient. i'd prefer selection of class easier manipulate, e.g. element.

any ideas?

there no constructor attr in javascript dom api, either. attempting evaluate new attr() in javascript result in "illegal constructor" typeerror. can create attributes using document.createattribute(name: string).

although getelementsbyclassname returning nodelist, each item element (you have downcast pattern matching or similar). dom.element can invoke setattribute(name: string, value: string) may more convenient manually creating attrs @ such low level.

also, jquery's ability select elements of dom using expressions has been built dom using document.queryselectorall. might try svgdocument.queryselectorall(".foo").map(_.asinstanceof[dom.raw.svgelement]) .foreach { _.setattribute("someattribute", "newvalue") }.

of course- treat nodelist scala collection require import org.scalajs.dom.ext._ bring implicits scope, looks though you're doing that.


Comments

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

php - .htaccess mod_rewrite for dynamic url which has domain names -

Website Login Issue developed in magento -