rubyvis 0.1.0 → 0.1.1

data/vendor/src/scene/SvgDot.js

@@ -0,0 +1,81 @@
+pv.SvgScene.dot = function(scenes) {
+  var e = scenes.$g.firstChild;
+  for (var i = 0; i < scenes.length; i++) {
+    var s = scenes[i];
+
+    /* visible */
+    if (!s.visible) continue;
+    var fill = s.fillStyle, stroke = s.strokeStyle;
+    if (!fill.opacity && !stroke.opacity) continue;
+
+    /* points */
+    var radius = s.shapeRadius, path = null;
+    switch (s.shape) {
+      case "cross": {
+        path = "M" + -radius + "," + -radius
+            + "L" + radius + "," + radius
+            + "M" + radius + "," + -radius
+            + "L" + -radius + "," + radius;
+        break;
+      }
+      case "triangle": {
+        var h = radius, w = radius * 1.1547; // 2 / Math.sqrt(3)
+        path = "M0," + h
+            + "L" + w +"," + -h
+            + " " + -w + "," + -h
+            + "Z";
+        break;
+      }
+      case "diamond": {
+        radius *= Math.SQRT2;
+        path = "M0," + -radius
+            + "L" + radius + ",0"
+            + " 0," + radius
+            + " " + -radius + ",0"
+            + "Z";
+        break;
+      }
+      case "square": {
+        path = "M" + -radius + "," + -radius
+            + "L" + radius + "," + -radius
+            + " " + radius + "," + radius
+            + " " + -radius + "," + radius
+            + "Z";
+        break;
+      }
+      case "tick": {
+        path = "M0,0L0," + -s.shapeSize;
+        break;
+      }
+      case "bar": {
+        path = "M0," + (s.shapeSize / 2) + "L0," + -(s.shapeSize / 2);
+        break;
+      }
+    }
+
+    /* Use <circle> for circles, <path> for everything else. */
+    var svg = {
+      "shape-rendering": s.antialias ? null : "crispEdges",
+      "pointer-events": s.events,
+      "cursor": s.cursor,
+      "fill": fill.color,
+      "fill-opacity": fill.opacity || null,
+      "stroke": stroke.color,
+      "stroke-opacity": stroke.opacity || null,
+      "stroke-width": stroke.opacity ? s.lineWidth / this.scale : null
+    };
+    if (path) {
+      svg.transform = "translate(" + s.left + "," + s.top + ")";
+      if (s.shapeAngle) svg.transform += " rotate(" + 180 * s.shapeAngle / Math.PI + ")";
+      svg.d = path;
+      e = this.expect(e, "path", svg);
+    } else {
+      svg.cx = s.left;
+      svg.cy = s.top;
+      svg.r = radius;
+      e = this.expect(e, "circle", svg);
+    }
+    e = this.append(e, scenes, i);
+  }
+  return e;
+};

data/vendor/src/scene/SvgImage.js

@@ -0,0 +1,45 @@
+pv.SvgScene.image = function(scenes) {
+  var e = scenes.$g.firstChild;
+  for (var i = 0; i < scenes.length; i++) {
+    var s = scenes[i];
+
+    /* visible */
+    if (!s.visible) continue;
+
+    /* fill */
+    e = this.fill(e, scenes, i);
+
+    /* image */
+    if (s.image) {
+      e = this.expect(e, "foreignObject", {
+          "cursor": s.cursor,
+          "x": s.left,
+          "y": s.top,
+          "width": s.width,
+          "height": s.height
+        });
+      var c = e.firstChild || e.appendChild(document.createElementNS(this.xhtml, "canvas"));
+      c.$scene = {scenes:scenes, index:i};
+      c.style.width = s.width;
+      c.style.height = s.height;
+      c.width = s.imageWidth;
+      c.height = s.imageHeight;
+      c.getContext("2d").putImageData(s.image, 0, 0);
+    } else {
+      e = this.expect(e, "image", {
+          "preserveAspectRatio": "none",
+          "cursor": s.cursor,
+          "x": s.left,
+          "y": s.top,
+          "width": s.width,
+          "height": s.height
+        });
+      e.setAttributeNS(this.xlink, "href", s.url);
+    }
+    e = this.append(e, scenes, i);
+
+    /* stroke */
+    e = this.stroke(e, scenes, i);
+  }
+  return e;
+};

data/vendor/src/scene/SvgLabel.js

@@ -0,0 +1,46 @@
+pv.SvgScene.label = function(scenes) {
+  var e = scenes.$g.firstChild;
+  for (var i = 0; i < scenes.length; i++) {
+    var s = scenes[i];
+
+    /* visible */
+    if (!s.visible) continue;
+    var fill = s.textStyle;
+    if (!fill.opacity || !s.text) continue;
+
+    /* text-baseline, text-align */
+    var x = 0, y = 0, dy = 0, anchor = "start";
+    switch (s.textBaseline) {
+      case "middle": dy = ".35em"; break;
+      case "top": dy = ".71em"; y = s.textMargin; break;
+      case "bottom": y = "-" + s.textMargin; break;
+    }
+    switch (s.textAlign) {
+      case "right": anchor = "end"; x = "-" + s.textMargin; break;
+      case "center": anchor = "middle"; break;
+      case "left": x = s.textMargin; break;
+    }
+
+    e = this.expect(e, "text", {
+        "pointer-events": s.events,
+        "cursor": s.cursor,
+        "x": x,
+        "y": y,
+        "dy": dy,
+        "transform": "translate(" + s.left + "," + s.top + ")"
+            + (s.textAngle ? " rotate(" + 180 * s.textAngle / Math.PI + ")" : "")
+            + (this.scale != 1 ? " scale(" + 1 / this.scale + ")" : ""),
+        "fill": fill.color,
+        "fill-opacity": fill.opacity || null,
+        "text-anchor": anchor
+      }, {
+        "font": s.font,
+        "text-shadow": s.textShadow,
+        "text-decoration": s.textDecoration
+      });
+    if (e.firstChild) e.firstChild.nodeValue = s.text;
+    else e.appendChild(document.createTextNode(s.text));
+    e = this.append(e, scenes, i);
+  }
+  return e;
+};

data/vendor/src/scene/SvgLine.js

@@ -0,0 +1,159 @@
+pv.SvgScene.line = function(scenes) {
+  var e = scenes.$g.firstChild;
+  if (scenes.length < 2) return e;
+  var s = scenes[0];
+
+  /* segmented */
+  if (s.segmented) return this.lineSegment(scenes);
+
+  /* visible */
+  if (!s.visible) return e;
+  var fill = s.fillStyle, stroke = s.strokeStyle;
+  if (!fill.opacity && !stroke.opacity) return e;
+
+  /* points */
+  var d = "M" + s.left + "," + s.top;
+
+  if (scenes.length > 2 && (s.interpolate == "basis" || s.interpolate == "cardinal" || s.interpolate == "monotone")) {
+    switch (s.interpolate) {
+      case "basis": d += this.curveBasis(scenes); break;
+      case "cardinal": d += this.curveCardinal(scenes, s.tension); break;
+      case "monotone": d += this.curveMonotone(scenes); break;
+    }
+  } else {
+    for (var i = 1; i < scenes.length; i++) {
+      d += this.pathSegment(scenes[i - 1], scenes[i]);
+    }
+  }
+
+  e = this.expect(e, "path", {
+      "shape-rendering": s.antialias ? null : "crispEdges",
+      "pointer-events": s.events,
+      "cursor": s.cursor,
+      "d": d,
+      "fill": fill.color,
+      "fill-opacity": fill.opacity || null,
+      "stroke": stroke.color,
+      "stroke-opacity": stroke.opacity || null,
+      "stroke-width": stroke.opacity ? s.lineWidth / this.scale : null,
+      "stroke-linejoin": s.lineJoin
+    });
+  return this.append(e, scenes, 0);
+};
+
+pv.SvgScene.lineSegment = function(scenes) {
+  var e = scenes.$g.firstChild;
+
+  var s = scenes[0];
+  var paths;
+  switch (s.interpolate) {
+    case "basis": paths = this.curveBasisSegments(scenes); break;
+    case "cardinal": paths = this.curveCardinalSegments(scenes, s.tension); break;
+    case "monotone": paths = this.curveMonotoneSegments(scenes); break;
+  }
+
+  for (var i = 0, n = scenes.length - 1; i < n; i++) {
+    var s1 = scenes[i], s2 = scenes[i + 1];
+
+    /* visible */
+    if (!s1.visible || !s2.visible) continue;
+    var stroke = s1.strokeStyle, fill = pv.Color.transparent;
+    if (!stroke.opacity) continue;
+
+    /* interpolate */
+    var d;
+    if ((s1.interpolate == "linear") && (s1.lineJoin == "miter")) {
+      fill = stroke;
+      stroke = pv.Color.transparent;
+      d = this.pathJoin(scenes[i - 1], s1, s2, scenes[i + 2]);
+    } else if(paths) {
+      d = paths[i];
+    } else {
+      d = "M" + s1.left + "," + s1.top + this.pathSegment(s1, s2);
+    }
+
+    e = this.expect(e, "path", {
+        "shape-rendering": s1.antialias ? null : "crispEdges",
+        "pointer-events": s1.events,
+        "cursor": s1.cursor,
+        "d": d,
+        "fill": fill.color,
+        "fill-opacity": fill.opacity || null,
+        "stroke": stroke.color,
+        "stroke-opacity": stroke.opacity || null,
+        "stroke-width": stroke.opacity ? s1.lineWidth / this.scale : null,
+        "stroke-linejoin": s1.lineJoin
+      });
+    e = this.append(e, scenes, i);
+  }
+  return e;
+};
+
+/** @private Returns the path segment for the specified points. */
+pv.SvgScene.pathSegment = function(s1, s2) {
+  var l = 1; // sweep-flag
+  switch (s1.interpolate) {
+    case "polar-reverse":
+      l = 0;
+    case "polar": {
+      var dx = s2.left - s1.left,
+          dy = s2.top - s1.top,
+          e = 1 - s1.eccentricity,
+          r = Math.sqrt(dx * dx + dy * dy) / (2 * e);
+      if ((e <= 0) || (e > 1)) break; // draw a straight line
+      return "A" + r + "," + r + " 0 0," + l + " " + s2.left + "," + s2.top;
+    }
+    case "step-before": return "V" + s2.top + "H" + s2.left;
+    case "step-after": return "H" + s2.left + "V" + s2.top;
+  }
+  return "L" + s2.left + "," + s2.top;
+};
+
+/** @private Line-line intersection, per Akenine-Moller 16.16.1. */
+pv.SvgScene.lineIntersect = function(o1, d1, o2, d2) {
+  return o1.plus(d1.times(o2.minus(o1).dot(d2.perp()) / d1.dot(d2.perp())));
+}
+
+/** @private Returns the miter join path for the specified points. */
+pv.SvgScene.pathJoin = function(s0, s1, s2, s3) {
+  /*
+   * P1-P2 is the current line segment. V is a vector that is perpendicular to
+   * the line segment, and has length lineWidth / 2. ABCD forms the initial
+   * bounding box of the line segment (i.e., the line segment if we were to do
+   * no joins).
+   */
+  var p1 = pv.vector(s1.left, s1.top),
+      p2 = pv.vector(s2.left, s2.top),
+      p = p2.minus(p1),
+      v = p.perp().norm(),
+      w = v.times(s1.lineWidth / (2 * this.scale)),
+      a = p1.plus(w),
+      b = p2.plus(w),
+      c = p2.minus(w),
+      d = p1.minus(w);
+
+  /*
+   * Start join. P0 is the previous line segment's start point. We define the
+   * cutting plane as the average of the vector perpendicular to P0-P1, and
+   * the vector perpendicular to P1-P2. This insures that the cross-section of
+   * the line on the cutting plane is equal if the line-width is unchanged.
+   * Note that we don't implement miter limits, so these can get wild.
+   */
+  if (s0 && s0.visible) {
+    var v1 = p1.minus(s0.left, s0.top).perp().norm().plus(v);
+    d = this.lineIntersect(p1, v1, d, p);
+    a = this.lineIntersect(p1, v1, a, p);
+  }
+
+  /* Similarly, for end join. */
+  if (s3 && s3.visible) {
+    var v2 = pv.vector(s3.left, s3.top).minus(p2).perp().norm().plus(v);
+    c = this.lineIntersect(p2, v2, c, p);
+    b = this.lineIntersect(p2, v2, b, p);
+  }
+
+  return "M" + a.x + "," + a.y
+       + "L" + b.x + "," + b.y
+       + " " + c.x + "," + c.y
+       + " " + d.x + "," + d.y;
+};

data/vendor/src/scene/SvgPanel.js

@@ -0,0 +1,126 @@
+pv.SvgScene.panel = function(scenes) {
+  var g = scenes.$g, e = g && g.firstChild;
+  for (var i = 0; i < scenes.length; i++) {
+    var s = scenes[i];
+
+    /* visible */
+    if (!s.visible) continue;
+
+    /* svg */
+    if (!scenes.parent) {
+      s.canvas.style.display = "inline-block";
+      if (g && (g.parentNode != s.canvas)) {
+        g = s.canvas.firstChild;
+        e = g && g.firstChild;
+      }
+      if (!g) {
+        g = s.canvas.appendChild(this.create("svg"));
+        g.setAttribute("font-size", "10px");
+        g.setAttribute("font-family", "sans-serif");
+        g.setAttribute("fill", "none");
+        g.setAttribute("stroke", "none");
+        g.setAttribute("stroke-width", 1.5);
+        for (var j = 0; j < this.events.length; j++) {
+          g.addEventListener(this.events[j], this.dispatch, false);
+        }
+        e = g.firstChild;
+      }
+      scenes.$g = g;
+      g.setAttribute("width", s.width + s.left + s.right);
+      g.setAttribute("height", s.height + s.top + s.bottom);
+    }
+
+    /* clip (nest children) */
+    if (s.overflow == "hidden") {
+      var id = pv.id().toString(36),
+          c = this.expect(e, "g", {"clip-path": "url(#" + id + ")"});
+      if (!c.parentNode) g.appendChild(c);
+      scenes.$g = g = c;
+      e = c.firstChild;
+
+      e = this.expect(e, "clipPath", {"id": id});
+      var r = e.firstChild || e.appendChild(this.create("rect"));
+      r.setAttribute("x", s.left);
+      r.setAttribute("y", s.top);
+      r.setAttribute("width", s.width);
+      r.setAttribute("height", s.height);
+      if (!e.parentNode) g.appendChild(e);
+      e = e.nextSibling;
+    }
+
+    /* fill */
+    e = this.fill(e, scenes, i);
+
+    /* transform (push) */
+    var k = this.scale,
+        t = s.transform,
+        x = s.left + t.x,
+        y = s.top + t.y;
+    this.scale *= t.k;
+
+    /* children */
+    for (var j = 0; j < s.children.length; j++) {
+      s.children[j].$g = e = this.expect(e, "g", {
+          "transform": "translate(" + x + "," + y + ")"
+              + (t.k != 1 ? " scale(" + t.k + ")" : "")
+        });
+      this.updateAll(s.children[j]);
+      if (!e.parentNode) g.appendChild(e);
+      e = e.nextSibling;
+    }
+
+    /* transform (pop) */
+    this.scale = k;
+
+    /* stroke */
+    e = this.stroke(e, scenes, i);
+
+    /* clip (restore group) */
+    if (s.overflow == "hidden") {
+      scenes.$g = g = c.parentNode;
+      e = c.nextSibling;
+    }
+  }
+  return e;
+};
+
+pv.SvgScene.fill = function(e, scenes, i) {
+  var s = scenes[i], fill = s.fillStyle;
+  if (fill.opacity || s.events == "all") {
+    e = this.expect(e, "rect", {
+        "shape-rendering": s.antialias ? null : "crispEdges",
+        "pointer-events": s.events,
+        "cursor": s.cursor,
+        "x": s.left,
+        "y": s.top,
+        "width": s.width,
+        "height": s.height,
+        "fill": fill.color,
+        "fill-opacity": fill.opacity,
+        "stroke": null
+      });
+    e = this.append(e, scenes, i);
+  }
+  return e;
+};
+
+pv.SvgScene.stroke = function(e, scenes, i) {
+  var s = scenes[i], stroke = s.strokeStyle;
+  if (stroke.opacity || s.events == "all") {
+    e = this.expect(e, "rect", {
+        "shape-rendering": s.antialias ? null : "crispEdges",
+        "pointer-events": s.events == "all" ? "stroke" : s.events,
+        "cursor": s.cursor,
+        "x": s.left,
+        "y": s.top,
+        "width": Math.max(1E-10, s.width),
+        "height": Math.max(1E-10, s.height),
+        "fill": null,
+        "stroke": stroke.color,
+        "stroke-opacity": stroke.opacity,
+        "stroke-width": s.lineWidth / this.scale
+      });
+    e = this.append(e, scenes, i);
+  }
+  return e;
+};