Skip to content

Latest commit

 

History

History
135 lines (93 loc) · 7.82 KB

USAGE.md

File metadata and controls

135 lines (93 loc) · 7.82 KB

front_screenshot

This module exports front_screenshot, which includes the methods detailed below, plus bundled builds of HTML2Canvas and Canvg


setDefaultOptions

Sets the default options.

Parameters

Returns FSOptions options with default properties set


FSOptions

The options that can be passed to every method. Not all of them are needed nor used on every function

Type: Object

Properties

  • quality Number? level of quality (higher is better) of the image to generate
  • selector string? Cash/jQuery selector on which to operate e.g. 'svg', '.canvg'
  • adjust_styles boolean? if true, sets the styles for typical c3 graphics
  • useCORS boolean? tell html2canvas to try to use CORS on external URLs
  • allowTaint boolean? either to allow or not tainted objects
  • logging Boolean? if true, log the results of html2canvas or canvg
  • clone boolean? if true, clone the node either to adjust styles or to capture with html2canvas
  • ignoreMouse boolean? if true, canvg will ignore mouse events
  • ignoreAnimation boolean? if true, canvg will ignore svg animations
  • hideSVG boolean? if true, hide the svg selector after canvg has converted it to image or canvas

adjustStyles

Adjust common C3 styles to avoid distorted images. This function won't modify elements with class keepstyle not its children

Parameters

  • jqContainer (Cash | jQuery | HTMLElement) The SVG element on which to apply the modifications
  • opts FSOptions The options, in particular, it will check if clone is true

Returns (Cash | jQuery) a clone of the original svg element with modified styles


html2canvas

Wrapper around html2canvas to accept either a DOMNode or a Cash/jQuery selector

Parameters

Returns HTMLCanvasElement Canvas element


svgToCanvas

Takes a jQuery container, finds its contained SVG, transforms it into a canvas

Parameters

Returns Promise<HTMLCanvasElement> a promise that unfolds to a Canvas element


svgToImg

Takes a jQuery container, finds its contained SVG, transforms it into an image

Parameters

Returns Promise<HTMLImageElement> a promise than resolves to an Image element


hiddenClone

Creates a hidden clone of a Cash/jQuery selector and appends it to the screen (allows to capture sections that are hidden due to scrolling behavior)

Parameters

Returns HTMLElement the DOM node of the clone


infoScreenShot

Given a jQuery container, takes a screenshot of it and returns it as an HTMLCanvasElement (it can capture the container contents even if they are hidden due to overlay hidden, auto or scroll CSS properties)

Parameters

  • jqContainer (HTMLElement | Cash | jQuery) Cash/jQuery selector of the element to transform into canvas
  • options FSOptions? options to pass to canvg and html2canvas

Returns Promise<HTMLCanvasElement> a promise that unfolds to a HTMLCanvasElement


selectorToImg

Transforms all contents of selector nodes found in jqContainer from SVG to images with classname .temporary_element. Original SVG element is hidden

Parameters

  • jqContainer (HTMLElement | Cash | jQuery) Cash/jQuery selector that contains N nodes with the specified selector
  • selector string a CSS selector like .className or #id

selectorToCanvas

Transforms all contents of selector nodes found in jqContainer from SVG to canvases with classname .temporary_element. Original SVG element is hidden

Parameters

  • jqContainer (HTMLElement | Cash | jQuery) Cash/jQuery selector that contains N nodes with the specified selector
  • selector string a CSS selector like .className or #id

selectorToSVG

Removes all childs from selector nodes found in jqContainer removing elements with classname .temporary_element and showing the original SVG

Parameters

  • jqContainer (HTMLElement | Cash | jQuery) Cash/jQuery selector that contains N nodes with the specified selector
  • selector string a CSS selector like .className or #id