Class: RevieveAR

RevieveAR(sdk)

new RevieveAR(sdk)

RevieveAR class. Revieve AR image manipulation.
Parameters:
Name Type Description
sdk Object instance of RevieveSDK

Members

methods

Properties:
Name Type Description
methods Object Helper list of methods available in module.
You have all the methods of the AR module subdivided in six categories:

Methods

applyBlush(strengthopt, color) → {Promise}

Apply blush in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the effect. See RevieveAR.defaultStrength
color String rgb, hex or name of the blush's color you want to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

applyEyeliner(strengthopt, color) → {Promise}

Apply eyeliner in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the effect. See RevieveAR.defaultStrength
color String rgb, hex or name of the eyeliner's color you want to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

applyEyeshadow(strengthopt, color) → {Promise}

Apply eyeshadow in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the effect. See RevieveAR.defaultStrength
color String rgb, hex or name of the eyeshadow's color you want to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

applyFoundation(strengthopt, color) → {Promise}

Apply foundation in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the effect. See RevieveAR.defaultStrength
color String rgb, hex or name of the foundation's color you want to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

applyLipliner(strengthopt, color) → {Promise}

Apply lipliner in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the effect. See RevieveAR.defaultStrength
color String rgb, hex or name of the lipliner's color you want to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

applyLipstick(strengthopt, color) → {Promise}

Apply lipstick in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the effect. See RevieveAR.defaultStrength
color String rgb, hex or name of the lipstick's color you want to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

brightenSkin(strengthopt, masks) → {Promise}

Brighten the skin in the user image areas defined in masks parameter. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
masks Array.<String> Array of RevieveAR.masks defining the areas where the effect is going to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

canVisualizeProduct(product) → {Boolean}

Method to determine if a product could be visualize by AR module
Parameters:
Name Type Description
product Object JSON object with information of a product.
See:
Returns:
Type
Boolean

dehighlightAll() → {Promise}

Method to remove all the highlights configured in picture
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

(async) drawOriginalImage()

Method to draw original image in the container

getColorInfoFromProduct(product)

Help method to get color info of a product to AR module interactions
Parameters:
Name Type Description
product Object JSON object with information of a product.
See:

getContainer()

Gets the container object where effects are going to be rendered. If no container is defined, it will use a container based on the image size.

getDefaultStrength() → {float}

Methot to get the default strength defined by AR or user
Returns:
default strength
Type
float

getDefaultStrengthFromProduct(product)

Help method to get default stregth info of a product to AR module interactions
Parameters:
Name Type Description
product Object JSON object with information of a product.
See:

getResultsDiv() → {HTMLDivElement}

See the results of the manipulations.
Returns:
After image - Div containing original image with added manipulations
Type
HTMLDivElement

(async) getResultsImage() → {Base64}

Get an image with all the active effects applied
Returns:
Returns an JPG image with all the effects and highlight you have applied with methods.
Type
Base64

highlightAcne(masks, shapeConfig) → {Promise}

Highlight areas with acne detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightAcneAreaValues(ranges, Array) → {Promise}

Highlight acne values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the acne visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightAcneIndividually(ranges, Array) → {Promise}

Highlight individual acne spots detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the acne visualization. Each object has three keys, minValue (value between 0 and 2500), maxValue (value between 0 and 2500) and color. Default value is [ { minValue: 0, maxValue: 80, color: 'rgba(44, 192, 205,0.3)' }, { minValue: 80, maxValue: 300, color: 'rgba(253, 164, 98, 0.7)' }, { minValue: 300, maxValue: 2500, color: 'rgba(205, 44, 66, 1)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightCheekArea() → {Promise}

Highlight cheek area.
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect.
Type
Promise

highlightDarkcircles(masks, shapeConfig) → {Promise}

Highlight darkcircles detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightDarkcirclesAreaValues(ranges, Array) → {Promise}

Highlight dark circles values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the dark circles visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightDarkSpots(masks, shapeConfig) → {Promise}

Highlight areas with dark spots detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks String Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightDarkSpotsAreaValues(ranges, Array) → {Promise}

Highlight dark spots values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the dark spots visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightDarkSpotsIndividually(ranges, Array) → {Promise}

Highlight individual dark spots detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the dark spots visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1, color: 'rgba(44, 192, 205,0.3)' }, { minValue: 1, maxValue: 2, color: 'rgba(253, 164, 98, 0.7)' }, { minValue: 2, maxValue: 9, color: 'rgba(205, 44, 66, 1)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightEyebags(masks, shapeConfig) → {Promise}

Highlight eye bags detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightEyebagsAreaValues(ranges, Array) → {Promise}

Highlight eyebags values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the eyebags visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightEyeColor() → {Promise}

Highlight the eye color information.
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect.
Type
Promise

highlightEyesArea() → {Promise}

Highlight the eyes area.
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect.
Type
Promise

highlightFaceShape(coloropt) → {Promise}

Highlight the face shape detected by CV module.
Parameters:
Name Type Attributes Description
color String <optional>
 color to be used to stoke the face shape
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect.
Type
Promise

highlightFinding(findingName, masks, shapeConfig) → {Promise}

Highlight a finding detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
findingName String String with the finding name.
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightFreckles(masks, shapeConfig) → {Promise}

Highlight areas with freckles detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks String Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightFrecklesAreaValues(ranges, Array) → {Promise}

Highlight freckles values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the freckles visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightFrecklesIndividually(ranges, Array) → {Promise}

Highlight individual freckles detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the freckles visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1, color: 'rgba(44, 192, 205,0.3)' }, { minValue: 1, maxValue: 2, color: 'rgba(253, 164, 98, 0.7)' }, { minValue: 2, maxValue: 9, color: 'rgba(205, 44, 66, 1)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightHyperpigmentation(masks, shapeConfig) → {Promise}

Highlight areas with hyperpigmentation detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks String Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightHyperpigmentationAreaValues(ranges, Array) → {Promise}

Highlight hyperpigmentation values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the hyperpigmentation visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightHyperpigmentationIndividually(ranges, Array) → {Promise}

Highlight individual hyperpigmentation spots detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the hyperpigmentation visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1, color: 'rgba(44, 192, 205,0.3)' }, { minValue: 1, maxValue: 2, color: 'rgba(253, 164, 98, 0.7)' }, { minValue: 2, maxValue: 9, color: 'rgba(205, 44, 66, 1)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightMelasma(masks, shapeConfig) → {Promise}

Highlight areas with melasma detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks String Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightMelasmaAreaValues(ranges, Array) → {Promise}

Highlight melasma values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the melasma visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightMelasmaIndividually(ranges, Array) → {Promise}

Highlight melasma areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the melasma visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1.1, color: 'rgba(255, 255, 255, 0.4)' }, { minValue: 1.1, maxValue: 2.1, color: 'rgba(253, 164, 98, 0.8)' }, { minValue: 2.1, maxValue: 10, color: 'rgb(44, 192, 205)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightPoreDilationIndividually(ranges, Array) → {Promise}

Highlight areas with pore dilation detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the uneven skin tone visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1.1, color: 'rgba(255, 255, 255, 0.4)' }, { minValue: 1.1, maxValue: 2.1, color: 'rgba(253, 164, 98, 0.8)' }, { minValue: 2.1, maxValue: 10, color: 'rgb(44, 192, 205)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightRedness(masks, shapeConfig) → {Promise}

Highlight areas with redness detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightRednessAreaValues(ranges, Array) → {Promise}

Highlight redness values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the redness visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightRednessIndividually(ranges, Array) → {Promise}

Highlight areas with redness detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the uneven skin tone visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1.1, color: 'rgba(255, 255, 255, 0.4)' }, { minValue: 1.1, maxValue: 2.1, color: 'rgba(253, 164, 98, 0.8)' }, { minValue: 2.1, maxValue: 10, color: 'rgb(44, 192, 205)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightSkinFoundation() → {Promise}

Highlight skin foundation matching information.
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect.
Type
Promise

highlightSkinSaggingIndividually(ranges) → {Promise}

Highlight areas with skin sagging detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the skin shine visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 0.33, color: 'rgba(255,255,255, 0.3)' }, { minValue: 0.33, maxValue: 0.66, color: 'rgba(44, 192, 205, 0.3)' }, { minValue: 0.66, maxValue: 1, color: 'rgb(2205, 44, 66, 0.3)' }, ]
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightSkinShine(ranges) → {Promise}

Highlight skin shine areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the skin shine visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 2, color: 'rgba(255,255,255, 0.5)' }, { minValue: 2, maxValue: 4, color: 'rgba(44, 192, 205, 0.2)' }, { minValue: 4, maxValue: 9, color: 'rgb(255, 255, 255)' }, ]
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightSkinUndertone() → {Promise}

Highlight skin undertone information.
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect.
Type
Promise

highlightSmoothness(masks, shapeConfig) → {Promise}

Highlight areas with smoothness detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightSmoothnessAreaValues(ranges, Array) → {Promise}

Highlight smoothness values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the smoothness visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightTexture(masks, shapeConfig) → {Promise}

Highlight areas with texture detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightTextureAreaValues(ranges, Array) → {Promise}

Highlight texture values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the texture visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightTextureIndividually(ranges, Array) → {Promise}

Highlight areas with texture detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the uneven skin tone visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1.1, color: 'rgba(255, 255, 255, 0.4)' }, { minValue: 1.1, maxValue: 2.1, color: 'rgba(253, 164, 98, 0.8)' }, { minValue: 2.1, maxValue: 10, color: 'rgb(44, 192, 205)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightUnevenSkinTone(masks, shapeConfig) → {Promise}

Highlight areas with uneven skin tone problems detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks String Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightUnevenSkinToneAreaValues(ranges, Array) → {Promise}

Highlight unevenSkinTone values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the unevenSkinTone visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightUnevenSkinToneIndividually(ranges, Array) → {Promise}

Highlight uneven skin tone areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the uneven skin tone visualization. Each object has three keys, minValue (value between 0 and 10), maxValue (value between 0 and 10) and color. Default value is [ { minValue: 0, maxValue: 1.1, color: 'rgba(255, 255, 255, 0.4)' }, { minValue: 1.1, maxValue: 2.1, color: 'rgba(253, 164, 98, 0.8)' }, { minValue: 2.1, maxValue: 10, color: 'rgb(44, 192, 205)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightWrinkles(masks, shapeConfig) → {Promise}

Highlight areas with wrinkles detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
masks Array.<String> Array of RevieveAR.masks defining the areas where you want to highlight the concern. Null or empty array will highlight the worst area detected by CV module.
shapeConfig String | Object You can define a rgb, hex or name of color to be used to darken the image or you can define an object with this structure: {fill: {color: }, stroke: {color: color to use to stroke, width: width of the stroke line, lineDash: two dimensions array where first dimension is the width of the dash and second one the space between points}} Keep in mind that this properties are optional, so you can define just fill, stroke or both.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightWrinklesAreaValues(ranges, Array) → {Promise}

Highlight wrinkles values in areas detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the wrinkles visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.3, color: 'rgb(44, 192, 205)' }, { minValue: 0.3, maxValue: 0.6, color: 'rgb(253, 164, 98)' }, { minValue: 0.6, maxValue: 1, color: 'rgb(205, 44, 66)' }, ]
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

highlightWrinklesIndividually(ranges, Array) → {Promise}

Highlight individual wrinkles detected by CV module. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Description
ranges Array.<Object> Array of ranges that defines the wrinkles visualization. Each object has three keys, minValue (value between 0 and 1), maxValue (value between 0 and 1) and color. Default value is [ { minValue: 0, maxValue: 0.2, color: 'rgba(44, 192, 205,0.3)' }, { minValue: 0.2, maxValue: 0.4, color: 'rgba(253, 164, 98, 0.7)' }, { minValue: 0.4, maxValue: 1, color: 'rgba(205, 44, 66, 1)' }, ],
Array Array.<String> of RevieveAR.masks defining the areas where you want to highlight the concern.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

redrawEffects()

Method to redraw all the effects applied until now

reduceCrowsFeet(strengthopt) → {Promise}

Reduce crows feet in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

reduceDarkcircles(strengthopt) → {Promise}

Reduce dark circles in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

reduceEyebags(strengthopt) → {Promise}

Reduce eyebags in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

reduceHyperpigmentation(strengthopt, masks) → {Promise}

Reduce hyperpigmentated spots in the user image areas defined in masks parameter. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
masks Array.<String> Array of RevieveAR.masks defining the areas where the effect is going to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

reduceRedness(strengthopt, masks) → {Promise}

Reduce redness in the user image areas defined in masks parameter. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
masks Array.<String> Array of RevieveAR.masks defining the areas where the effect is going to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

reduceWrinkles(strengthopt, masks) → {Promise}

Reduce wrinkles in the user image areas defined in masks parameter. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Description
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
masks Array.<String> Array of RevieveAR.masks defining the areas where the effect is going to be applied.
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

reset()

Method to reset results and delete all the effects applied before.

setContainer(container, disableOnResize)

Sets the container Id where you want to render automatically results of setting effects
Parameters:
Name Type Default Description
container String | Object valid HTML Element or HTML tag id
disableOnResize Boolean false set to true if you don't want to redraw all the events on window resize

setDefaultStrength(strength)

Method to update the default strength of the effects
Parameters:
Name Type Description
strength float default strength to apply in all effects

setEffectByName(effectName, masks, strengthopt, fillColoropt, highlightopt, highlightShapeopt, ranges) → {Promise}

Please don't use this method directly. You have the general effect methods to work with them. Set an effect determined by parameter effect name in the user image. Resulting effects will be applied to div containing the image returned by getResults or to the container specified in constructor.
Parameters:
Name Type Attributes Default Description
effectName String Name of the effect to be applied.
masks Array.<String> Array of RevieveAR.masks defining the areas where the effect is going to be applied.
strength Float <optional>
 Strength of the reduction effect. See RevieveAR.defaultStrength
fillColor String <optional>
 Rgb, hex or name of color you want to be applied.
highlight Boolean <optional>
 false true if you want to highlight a problem in an area
highlightShape Boolean <optional>
 false true if you want to zoom
ranges Array.<Object> ranges configuration for wrinkles visualization. (for example, face shape)
See:
  • getResults
Returns:
When promise is resolved, it will return the style object to be applied if you wish to animate the effect
Type
Promise

setOrientation(orientation)

Sets the orientation of the container to fit image and canvas properly
Parameters:
Name Type Description
orientation String landscape, portrait or auto

setScaleFactor(factor)

Method to set the scale factor to apply in animation style returned by highlight methods. For example, if you want to increase the zoom a 20%, you will set the factor to 1.2
Parameters:
Name Type Description
factor float factor to apply.

setWhiteBalanceCorrection(value)

Activates or deactivates the white balance correction feature
Parameters:
Name Type Description
value Boolean true if you want to activate or false to deactive white balance feature when you apply effects

testImages()

Test method that add to the root of the HTML document two objects: the original image and the resulting div with all the effects applied

visualizeProduct(product, strengthopt) → {Promise}

Method to apply the simulated effect of applying a product in picture
Parameters:
Name Type Attributes Description
product Object JSON object with information of a product.
strength Float <optional>
 Strength of product effect. See RevieveAR.defaultStrength
See:
Returns:
Type
Promise