<dependency> <groupId>org.webjars.npm</groupId> <artifactId>d3</artifactId> <version>7.1.1</version> </dependency> import org.teavm.jso.dom.svg.SVGDocument; import org.teavm.jso.dom.xml.Element; import static org.teavm.jso.dom.xml.XMLParser.parseXML; public class D3SelectionExample { public static void main(String[] args) { SVGDocument document = parseXML("<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"500\" height=\"500\"></svg>").cast(); Element svg = document.getDocumentElement(); svg.setAttribute("fill", "blue"); svg.setAttribute("stroke", "red"); Element rect = document.createElementNS("http://www.w3.org/2000/svg", "rect"); rect.setAttribute("x", "100"); rect.setAttribute("y", "100"); rect.setAttribute("width", "200"); rect.setAttribute("height", "200"); svg.appendChild(rect); } } import org.teavm.jso.dom.svg.SVGDocument; import org.teavm.jso.dom.xml.Element; import static org.teavm.jso.dom.xml.XMLParser.parseXML; import com.github.gwtd3.api.D3; import com.google.gwt.core.client.EntryPoint; import com.google.gwt.user.client.ui.FlowPanel; public class D3SelectionExample implements EntryPoint { public void onModuleLoad() { SVGDocument document = parseXML("<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"500\" height=\"500\"></svg>").cast(); FlowPanel container = new FlowPanel(); Element svg = document.getDocumentElement(); svg.setAttribute("fill", "blue"); svg.setAttribute("stroke", "red"); Element rect = document.createElementNS("http://www.w3.org/2000/svg", "rect"); rect.setAttribute("x", "100"); rect.setAttribute("y", "100"); rect.setAttribute("width", "200"); rect.setAttribute("height", "200"); svg.appendChild(rect); int[] data = { 10, 20, 30, 40, 50 }; D3.select(rect).data(data).attr("width", d -> d + "px"); container.getElement().appendChild(svg); RootPanel.get().add(container); } }