How to use vega-scenegraph - 10 common examples

function drawGL(context, scene, bounds) {
    visit(scene, function(item) {
      if (bounds && !bounds.intersects(item.bounds)) return; // bounds check

      var x = item.x || 0,
          y = item.y || 0,
          shapeGeom;

      context._tx += x;
      context._ty += y;

      if (context._fullRedraw || item._dirty || !item._geom || item._geom.deleted) {
        shapeGeom = shape(context, item);
        item._geom = geometryForItem(context, item, shapeGeom);
      }
      drawGeometry(item._geom, context, item);

      context._tx -= x;

function drawGL(context, scene, bounds) {
  var renderer = this;

  visit(scene, function(item) {
    if (bounds && !bounds.intersects(item.bounds)) return; // bounds check

    var image = getImage(item, renderer),
        x = item.x || 0,
        y = item.y || 0,
        w = item.width || image.width || 0,
        h = item.height || image.height || 0;

    x -= imageXOffset(item.align, w);
    y -= imageYOffset(item.baseline, h);

    if (image.loaded) {
      var imgInfo = loadImageAndCreateTextureInfo(context, image);
      imgInfo.x = x + context._tx + context._origin[0];
      imgInfo.y = y + context._ty + context._origin[1];
      imgInfo.w = w;

drawGeometry(group._geom, context, group);

    // set clip and bounds
    if (group.clip) {
      oldClip = context._clip;
      context._clip = [
        context._origin[0] + context._tx,
        context._origin[1] + context._ty,
        context._origin[0] + context._tx + w,
        context._origin[1] + context._ty + h
      ];
    }
    if (bounds) bounds.translate(-gx, -gy);

    // draw group contents
    visit(group, function(item) {
      renderer.draw(context, item, bounds);
    });

    // restore graphics context
    if (bounds) bounds.translate(gx, gy);
    if (group.clip) {
      context._clip = oldClip;
    }

    context._tx -= gx;
    context._ty -= gy;
    context._textContext.restore();
  });
}

function drawGL(context, scene, bounds) {
  visit(scene, function(item) {
    var x1, y1, x2, y2, shapeGeom;
    if (bounds && !bounds.intersects(item.bounds)) return; // bounds check
    if (context._fullRedraw || item._dirty || !item._geom || item._geom.deleted) {
      x1 = item.x || 0;
      y1 = item.y || 0;
      x2 = item.x2 != null ? item.x2 : x1;
      y2 = item.y2 != null ? item.y2 : y1;
      shapeGeom = {
        lines: [[[x1, y1], [x2, y2]]],
        closed: false
      };
      shapeGeom.key = JSON.stringify(shapeGeom.lines);
      item._geom = geometryForItem(context, item, shapeGeom);
    }
    drawGeometry(item._geom, context, item);
  });

function drawGL(context, scene, bounds) {
  var renderer = this;

  visit(scene, function(group) {
    var gx = group.x || 0,
        gy = group.y || 0,
        w = group.width || 0,
        h = group.height || 0,
        offset, oldClip;

    // setup graphics context
    context._tx += gx;
    context._ty += gy;
    context._textContext.save();
    context._textContext.translate(gx, gy);

    // draw group background
    if (context._fullRedraw || group._dirty || !group._geom || group._geom.deleted) {
      offset = group.stroke ? 0.5 : 0;
      var shapeGeom = rectangleGL(context, group, offset, offset);

yc = boundary[4 + dy] + (insideFactor * textHeight * dy) / 2 + offsets[i] * dy * sizeFactor;
      y1 = yc - textHeight / 2;
      y2 = yc + textHeight / 2;

      _x1 = $(x1);
      _y1 = $(y1);
      _y2 = $(y2);

      if (!textWidth) {
        // to avoid finding width of text label,
        if (!test(_x1, _x1, _y1, _y2, bm0, bm1, x1, x1, y1, y2, boundary, isInside)) {
          // skip this anchor/offset option if we fail to place a label with 1px width
          continue;
        } else {
          // Otherwise, find the label width
          textWidth = textMetrics.width(d.datum);
        }
      }

      xc = x1 + (insideFactor * textWidth * dx) / 2;
      x1 = xc - textWidth / 2;
      x2 = xc + textWidth / 2;

      _x1 = $(x1);
      _x2 = $(x2);

      if (test(_x1, _x2, _y1, _y2, bm0, bm1, x1, x2, y1, y2, boundary, isInside)) {
        // place label if the position is placeable
        d.x = !dx ? xc : dx * insideFactor < 0 ? x2 : x1;
        d.y = !dy ? yc : dy * insideFactor < 0 ? y2 : y1;

        d.align = Aligns[dx * insideFactor + 1];

y = offset + height;
      s = Math.max(minExtent, Math.min(maxExtent, bounds.y2));
      if (title) {
        title.y = titlePadding + s;
        s += titleSize;
      }
      bounds.add(0, y).add(width, y + s);
      break;
    }
  }

  item.x = x + 0.5;
  item.y = y + 0.5;

  // update bounds
  boundStroke(bounds, item);
  item.mark.bounds.clear().union(bounds);
  return bounds;
}

y += height - h - offset;
      break;
    case 'bottom-right':
      x += width - w - offset;
      y += height - h - offset;
      break;
  }

  // update legend layout
  item.x = x;
  item.y = y;
  item.width = w;
  item.height = h;

  // update bounds
  boundStroke(bounds.set(x, y, x + w, y + h), item);
  item.mark.bounds.clear().union(bounds);
  return bounds;
}

if (title) if (title.auto) {
        s += titlePadding;
        title.y = s;
        s += title.bounds.height();
      } else {
        bounds.union(title.bounds);
      }
      bounds.add(0, 0).add(range, s);
      break;
    default:
      x = item.x;
      y = item.y;
  }

  // update bounds
  boundStroke(bounds.translate(x, y), item);

  if (set(item, 'x', x + AxisOffset) | set(item, 'y', y + AxisOffset)) {
    item.bounds = tempBounds;
    view.dirty(item);
    item.bounds = bounds;
    view.dirty(item);
  }

  return item.mark.bounds.clear().union(bounds);
}

break;
    case 'bottom-left':
      x += offset;
      y += height - h - offset;
      break;
    case 'bottom-right':
      x += width - w - offset;
      y += height - h - offset;
      break;
    default:
      x = item.x;
      y = item.y;
  }

  // update bounds
  boundStroke(bounds.set(x, y, x + w, y + h), item);

  // update legend layout
  if (set(item, 'x', x) | set(item, 'width', w) |
      set(item, 'y', y) | set(item, 'height', h)) {
    item.bounds = tempBounds;
    view.dirty(item);
    item.bounds = bounds;
    view.dirty(item);
  }

  return item.mark.bounds.clear().union(bounds);
}