attempt to draw svg switches. doesn't look great.
diff --git a/web/ons-demo/js/map.js b/web/ons-demo/js/map.js
index 35ca77d..62df872 100644
--- a/web/ons-demo/js/map.js
+++ b/web/ons-demo/js/map.js
@@ -1,6 +1,3 @@
-
-
-
(function () {
var projection = d3.geo.mercator()
@@ -8,6 +5,8 @@
.scale(8000)
.rotate([-180,0]);
+var switchXML;
+
function createMap(svg, cb) {
topology = svg.append('svg:svg').attr('id', 'viewBox').attr('viewBox', '0 0 1000 1000').
attr('id', 'viewbox');
@@ -23,7 +22,10 @@
.append('path')
.attr('d', path)
- cb();
+ d3.xml('assets/switch.svg', function (xml) {
+ switchXML = document.importNode(xml.documentElement, true);;
+ cb();
+ });
});
}
@@ -220,12 +222,26 @@
function switchEnter(d) {
var g = d3.select(this);
- var width = widths[d.className];
+ var width;
- g.append('svg:circle').attr('r', width)
- .classed(d.className, true)
- .attr('cx', d.x)
- .attr('cy', d.y);
+ // attempt to draw an svg switch
+ if (false && d.className == 'core') {
+ width = 30;
+ g.select(function () {
+ return this.appendChild(switchXML.cloneNode(true));
+ })
+ .classed(d.className, true)
+ .attr('x', d.x - 30)
+ .attr('y', d.y - 30);
+
+ } else {
+ width = widths[d.className];
+ g.append('svg:circle').attr('r', width)
+ .classed(d.className, true)
+ .attr('cx', d.x)
+ .attr('cy', d.y);
+ }
+
if (d.label) {
g.append('svg:text')