How to use the vega-scenegraph.textMetrics.width function in vega-scenegraph

To help you get started, we’ve selected a few vega-scenegraph examples, based on popular ways it is used in public projects.

github vega / vega / packages / vega-label / src / util / placeMarkLabel.js View on Github external
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];
github vega / vega / packages / vega-label / src / util / placeAreaLabel.js View on Github external
return function(d) {
    const items = d.datum.datum.items[markIndex].items, // area points
          n = items.length, // number of points
          textHeight = d.datum.fontSize, // label width
          textWidth = textMetrics.width(d.datum), // label height
          stack = []; // flood fill stack

    let maxSize = avoidBaseMark ? textHeight : 0,
        labelPlaced = false,
        labelPlaced2 = false,
        maxAreaWidth = 0,
        x1, x2, y1, y2, x, y, _x, _y, lo, hi, mid, areaWidth;

    // for each area sample point
    for (let i=0; i<n; ++i) {
      x1 = items[i].x;
      y1 = items[i].y;
      x2 = items[i].x2 === undefined ? x1 : items[i].x2;
      y2 = items[i].y2 === undefined ? y1 : items[i].y2;

      // add scaled center point to stack