D3.xml Example
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>D3.xml Example</title> | |
| <script type="text/javascript" src="http://mbostock.github.com/d3/d3.v2.js"></script> | |
| <style type="text/css"> | |
| .chart div { | |
| font: 10px sans-serif; | |
| background-color: steelblue; | |
| text-align: right; | |
| padding: 3px; | |
| margin: 1px; | |
| color: white; | |
| } | |
| </style | |
| </head> | |
| <body> | |
| <div id="chart" class="chart"> | |
| </div> | |
| <script> | |
| d3.xml("values.xml", "application/xml", function(xml) { | |
| d3.select("#chart") | |
| .selectAll("div") | |
| .data(xml.documentElement.getElementsByTagName("value")) | |
| .enter().append("div") | |
| .style("width", function(d) { return d.textContent * 10 + "px"; }) | |
| .text(function(d) { return d.textContent; }); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
| <?xml version="1.0" encoding="UTF-8" ?> | |
| <data> | |
| <value>71</value> | |
| <value>12</value> | |
| <value>44</value> | |
| <value>88</value> | |
| </data> |
This comment has been minimized.
This comment has been minimized.
|
See here for an up-to-date example: https://gist.github.com/kba/ef849c73cccd2a9db817 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This comment has been minimized.
How will I select tag 2013 and stateuts from below:
Andhra Pradesh Assault on women with intent to outrage her Modest <2013>6930 Arunachal Pradesh Assault on women with intent to outrage her Modest <2013>93 Assam Assault on women with intent to outrage her Modest <2013>2409