How to use the snapsvg.parse function in snapsvg

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

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github microsoft / PowerBI-visuals-ClusterMap / lib / @uncharted / personas / src / personas.persona.label.js View on Github external
/* member variables */
    this.mOptions = options;
    this.mShadowFilter = null;
    this.mNameBackground = null;
    this.mName = name;
    this.mCountGroup = null;
    this.mNameText = null;
    this.mCountText = null;
    this.mTotalCount = totalCount.toString();
    this.mTotalCountText = null;
    this.mPaper = null;
    this.mMaxNameWidth = maxNameWidth;

    /* initialization */
    var shadow = Snap.parse(Snap.filter.shadow(0, 0, 2, '#000000'));
    this.mShadowFilter = new Node('filter');
    this.mShadowFilter.append(shadow);
    this.append(this.mShadowFilter);

    /* create the name background */
    this.mNameBackground = new Node('rect');
    this.mNameBackground.attr({'pointer-events': 'none'});
    this.mNameBackground.addClass(this.mOptions.classes.namecontainer);
    this.append(this.mNameBackground);

    /* create the name text */
    this.mNameText = new Node('text', {x: 0, y: 0});
    this.mNameText.attr({
        'text': name,
        'text-anchor': 'middle',
        'pointer-events': 'none',
github microsoft / PowerBI-visuals-ClusterMap / lib / @uncharted / personas / src / personas.persona.avatar.js View on Github external
/* populate the URLs array */
    if (imageURLs instanceof Array) {
        Array.prototype.push.apply(this.mImageURLs, imageURLs);
    } else {
        this.mImageURLs.push(imageURLs);
    }

    /* images container */
    this.mContainer = new Node();
    this.mContainer.addClass('prsnas_nopointer');
    this.append(this.mContainer);

    /* blur filter */
    var blurStrength = this.mBlurStrength;
    var blur = Snap.parse(Snap.filter.blur(blurStrength, blurStrength));
    blur.node.firstChild.setAttribute('color-interpolation-filters', 'sRGB'); // safari fix
    var filter = new Node('filter');
    filter.append(blur);
    this.mContainer.append(filter);
    this.mContainer.attr({filter: filter});
    this.mFilter = filter;

    /* mask */
    this.mMask = new Node('circle', { 'cx': 0, 'cy': 0, 'r': radius });
    this.mMask.attr('fill', '#fff');
    this.mContainer.attr({ mask: this.mMask });

    /* load the images */
    var imageRadius = radius + (blurStrength * 2); // consider the blur to avoid displaying semi-transparent edges
    this.mImageRadius = imageRadius;
    this.mContainer.attr({ display: 'none' });
github anthonydugois / polynom / src / actions / projects.js View on Github external
reader.onload = (f) => {
        let svg = Snap(Snap.parse(f.target.result).node)

        if (svg.type !== "svg") {
          svg = svg.select("svg")
        }

        const { width, height } = svg.attr("viewBox")
        const paths = svg.selectAll("path")

        dispatch(addProject(name, width, height))

        paths.forEach((path, index) => dispatch(importPath(
          newProjectId,
          index,
          path.attr("d")
        )))
      }
github CodeForPhilly / philly-ward-leaders / src / baseball-card.js View on Github external
var card = s.rect(5, 5, config.cardWidth - 10, config.cardHeight - 10, 2)
    .attr({
      fill: config.cardBorderColor,
      stroke: config.cardBorderColor,
      strokeWidth: 10
    });

    var inside = s.rect(config.cardBorderWidth, config.cardBorderWidth, config.cardWidth - config.cardBorderWidth * 2, config.cardHeight - config.cardBorderWidth * 2)
    .attr({
      fill: config.cardInsideColor,
      stroke: '#000',
      strokeWidth: 1
    });

    var contents = Snap.parse(BackTemplate(config));

    var g = s.group().append(contents);

    return s;
  }
};

snapsvg

JavaScript Vector Library

Apache-2.0
Latest version published 7 years ago

Package Health Score

58 / 100
Full package analysis

Similar packages