images

October 22, 2022

images

Stability: 2-Stable

The images module provides some common picture processing functions in mobile devices, including screenshots, reading and writing pictures, picture cropping, rotation, binarization, color finding and picture finding, etc.

This module is divided into two parts, the part of finding pictures and color and the part of picture processing.

It should be noted that after the image object is created, try to recover when it is not in use, and at the same time avoid creating a large number of images in a loop. Because a picture is a resource that takes up a lot of memory, although Auto.js uses various methods (such as picture caching mechanism, reclaiming pictures during garbage collection, and reclaiming all pictures at the end of the script) to minimize the leakage of picture resources and memory usage, but Bad code can still take up a lot of memory.

The Image object is recycled by calling the recycle() function. E.g:

// read picture
var img = images.read("./1.png");
//Operate the picture
...
// Recycle pictures
img.recycle();

The exception is that the picture returned by captureScreen() does not need to be recycled.

Picture processing

images.read(path)

  • path {string} Image path

Read the image file in path path and return an Image object. If the file does not exist or the file cannot be decoded, null is returned.

images.load(url)

  • url {string} Image URL address

Load the web image at the URL address and return an Image object. If the address does not exist or the picture cannot be decoded, null is returned.

images.copy(img)

  • img {Image} image
  • Back to {Image}

Copy a picture and return to a new copy. This function will completely copy the data of the img object.

images.save(image, path[, format = "png", quality = 100])

  • image {Image} image
  • path {string} path
  • format {string} Picture format, optional values ​​are:
    • png
    • jpeg/jpg
    • webp
  • quality {number} Image quality, an integer value from 0 to 100

Save the image image to the path in PNG format. If the file does not exist, it will be created; if the file exists, it will be overwritten.

//Compress the picture to half the original quality and save
var img = images.read("/sdcard/1.png");
images.save(img, "/sdcard/1.jpg", "jpg", 50);
app.viewFile("/sdcard/1.jpg");

images.fromBase64(base64)

  • base64 {string} Base64 data of the picture
  • Back to {Image}

Decode Base64 data and return the decoded Image object. If base64 cannot be decoded, null is returned.

images.toBase64(img[, format = "png", quality = 100])

  • image {image} picture
  • format {string} Picture format, optional values ​​are:
    • png
    • jpeg/jpg
    • webp
  • quality {number} Image quality, an integer value from 0 to 100
  • Return {string}

Encode the picture as base64 data and return it.

images.fromBytes(bytes)

  • bytes {byte[]} byte array

Decode the byte array bytes and return the decoded image Image object. If bytes cannot be decoded, null is returned.

images.toBytes(img[, format = "png", quality = 100])

  • image {image} picture
  • format {string} Picture format, optional values ​​are:
    • png
    • jpeg/jpg
    • webp
  • quality {number} Image quality, an integer value from 0 to 100
  • Return {byte[]}

Encode the picture into a byte array and return.

images.clip(img, x, y, w, h)

  • img {Image} image
  • x {number} The abscissa of the upper left corner of the clipping area
  • y {number} The ordinate of the upper left corner of the clipping area
  • w {number} the width of the clipping area
  • h {number} The height of the clipping area
  • Back to {Image}

Cut an area of ​​size w * h from the position (x, y) of the picture img, and return a new picture of the cut area.

var src = images.read("/sdcard/1.png");
var clip = images.clip(src, 100, 100, 400, 400);
images.save(clip, "/sdcard/clip.png");

images.resize(img, size[, interpolation])

[v4.1.0 New]

  • img {Image} image

  • size {Array} Two-element array [w, h], respectively representing the width and height; if there is only one element, the width and height are equal

  • interpolation {string} Interpolation method, optional, the default is "LINEAR" (linear interpolation), the optional values ​​are:

    • NEAREST nearest neighbor interpolation
    • LINEAR linear interpolation (default)
    • AREA area interpolation
    • CUBIC cubic spline interpolation
    • LANCZOS4 Lanczos interpolation See InterpolationFlagsopen in new window
  • Back to {Image}

Resize the picture and return to the adjusted picture. For example, to scale the image to 200*300: images.resize(img, [200, 300]).

See Imgproc.resizeopen in new window.

images.scale(img, fx, fy[, interpolation])

[v4.1.0 New]

  • img {Image} image

  • fx {number} Width zoom multiple

  • fy {number} height zoom multiple

  • interpolation {string} Interpolation method, optional, the default is "LINEAR" (linear interpolation), the optional values ​​are:

    • NEAREST nearest neighbor interpolation
    • LINEAR linear interpolation (default)
    • AREA area interpolation
    • CUBIC cubic spline interpolation
    • LANCZOS4 Lanczos interpolation See InterpolationFlagsopen in new window
  • Back to {Image}

Zoom the picture, and return to the zoomed picture. For example, the picture becomes half of the original: images.scale(img, 0.5, 0.5).

See Imgproc.resizeopen in new window.

images.rotate(img, degree[, x, y])

[v4.1.0 New]

  • img {Image} image
  • degree {number} Rotation angle.
  • x {number} The x coordinate of the rotation center, the default is the midpoint of the picture
  • y {number} The y coordinate of the rotation center, the default is the midpoint of the picture
  • Back to {Image}

Rotate the picture counterclockwise by degree, and return the rotated picture object.

For example, rotate 90 degrees counterclockwise as images.rotate(img, 90).

images.concat(img1, image2[, direction])

[v4.1.0 New]

  • img1 {Image} Picture 1
  • img2 {Image} Picture 2
  • direction {string} Connection direction, the default is "RIGHT", the optional values ​​are:
    • LEFT connect picture 2 to the left of picture 1
    • RIGHT connect picture 2 to the right of picture 1
    • TOP connect picture 2 to picture 1
    • BOTTOM connect picture 2 to the bottom of picture 1
  • Back to {Image}

Connect two pictures and return the connected image. If the sizes of the two pictures are not the same, the smaller one will be centered appropriately.

images.grayscale(img)

[v4.1.0 New]

  • img {Image} image
  • Back to {Image}

Grayscale the picture, and return to the grayscaled picture.

image.threshold(img, threshold, maxVal[, type])

[v4.1.0 New]

  • img {Image} image

  • threshold {number} threshold

  • maxVal {number} maximum value

  • type {string} Thresholding type, the default is "BINARY", see ThresholdTypesopen in new window, optional value:

    • BINARY
    • BINARY_INV
    • TRUNC
    • TOZERO
    • TOZERO_INV
    • OTSU
    • TRIANGLE
  • Back to {Image}

Threshold the image and return the processed image. You can use this function for image binarization. For example: images.threshold(img, 100, 255, "BINARY"), this code changes all values ​​greater than 100 in the image to 255, and the rest to 0, so as to achieve the effect of binarization. If the img is a grayscale image, this code will get a black and white image.

You can refer to related blogs (such as Use of Threshold Functionopen in new window) or OpenCV document [threshold](https://docs.opencv.org/3.4 .4/d7/d1b/group__imgproc__misc.html#gae8a4a146d1ca78c626a53577199e9c57).

images.adaptiveThreshold(img, maxValue, adaptiveMethod, thresholdType, blockSize, C)

[v4.1.0 New]

  • img {Image} image
  • maxValue {number} maximum value
  • adaptiveMethod {string} The algorithm used to calculate the threshold in a neighborhood. The optional values ​​are:
    • MEAN_C calculates the average value of the field and subtracts the value of parameter C
    • GAUSSIAN_C calculates the Gaussian mean of the field and subtracts the value of parameter C
  • thresholdType {string} Thresholding type, optional values ​​are:
    • BINARY
    • BINARY_INV
  • blockSize {number} neighborhood block size
  • C {number} Offset adjustment amount
  • Back to {Image}

Perform adaptive thresholding on the picture and return the processed image.

You can refer to related blogs (such as threshold and adaptiveThresholdopen in new window) or the OpenCV document [adaptiveThreshold](https://docs.opencv.org/3.4. 4/d7/d1b/group__imgproc__misc.html#ga72b913f352e4a1b1b397736707afcde3 ).

images.cvtColor(img, code[, dstCn])

[v4.1.0 New]

  • img {Image} image
  • code {string} The type of color space conversion, there are a total of 205 optional values ​​(see ColorConversionCodesopen in new window), here are only a few:
    • BGR2GRAY BGR converted to grayscale
    • BGR2HSV Convert BGR to HSV
    • ``
  • dstCn {number} The number of color channels of the target image, if not filled in, it will be automatically determined according to other parameters.
  • Back to {Image}

Perform color space conversion on the image and return the converted image.

You can refer to related blogs (such as Color Space Conversionopen in new window) or OpenCV document [cvtColor](https://docs. opencv.org/3.4.4/d8/d01/group__imgproc__color__conversions.html#ga397ae87e1288a81d2363b61574eb8cab).

images.inRange(img, lowerBound, upperBound)

[v4.1.0 New]

  • img {Image} image
  • lowerBound {string} | {number} Color lower bound
  • upperBound {string} | {number} Color lower bound
  • Back to {Image}

Binarize the picture, the colors outside the lowerBound~upperBound range all become 0, and the colors within the range become 255.

For example, images.inRange(img, "#000000", "#222222").

images.interval(img, color, interval)

[v4.1.0 New]

  • img {Image} image
  • color {string} | {number} color value
  • interval {number} The range interval of each channel
  • Back to {Image}

Binarize the picture, all colors outside the range of color-interval ~ color+interval become 0, and all colors within the range become 255. The addition and subtraction of color here is for each channel.

For example, images.interval(img, "#888888", 16), the color value of each channel is 0x88, and the range after adding and subtracting 16 is [0x78, 0x98], so this code will change #787878~#989898 The color of is changed to #FFFFFF, and the color outside this range is changed to #000000.

images.blur(img, size[, anchor, type])

[v4.1.0 New]

  • img {Image} image
  • size {Array} defines the size of the filter, such as [3, 3]
  • anchor {Array} Specify the anchor point position (the smoothed point), the default is the image center
  • type {string} Infer the edge pixel type, the default is "DEFAULT", the optional values ​​are:
    • CONSTANT iiiiii|abcdefgh|iiiiiii with some specified i
    • REPLICATE aaaaaa|abcdefgh|hhhhhhh
    • REFLECT fedcba|abcdefgh|hgfedcb
    • WRAP cdefgh|abcdefgh|abcdefg
    • REFLECT_101 gfedcb|abcdefgh|gfedcba
    • TRANSPARENT uvwxyz|abcdefgh|ijklmno
    • REFLECT101 same as BORDER_REFLECT_101
    • DEFAULT same as BORDER_REFLECT_101
    • ISOLATED do not look outside of ROI
  • Back to {Image}

Blur (smooth) the image and return to the processed image.

You can refer to related blogs (such asRealize image smoothingopen in new window) or OpenCV document [blur](https://docs.opencv.org/3.4.4/d4/d86 /group__imgproc__filter.html#ga8c45db9afe636703801b0b2e440fce37).

images.medianBlur(img, size)

[v4.1.0 New]

  • img {Image} image
  • size {Array} defines the size of the filter, such as [3, 3]
  • Back to {Image}

Perform median filtering on the image and return the processed image.

You can refer to related blogs (such as [Implementing Image Smoothing] (https://www.cnblogs.com/denny402/p/3848316.html)) or OpenCV document [blur](https://docs.opencv.org/3.4 .4/d4/d86/group__imgproc__filter.html#ga564869aa33e58769b4469101aac458f9).

images.gaussianBlur(img, size[, sigmaX, sigmaY, type])

[v4.1.0 New]

  • img {Image} image
  • size {Array} defines the size of the filter, such as [3, 3]
  • sigmaX {number} The standard deviation in the x direction, if not filled in, it will be calculated automatically
  • sigmaY {number} The standard deviation in the y direction, it will be calculated automatically if it is not filled in
  • type {string} Infer the edge pixel type, the default is "DEFAULT", see images.blur
  • Back to {Image}

Perform Gaussian blur on the image and return to the processed image.

You can refer to related blogs (such as [Implementing Image Smoothing] (https://www.cnblogs.com/denny402/p/3848316.html)) or the OpenCV document [GaussianBlur] (https://docs.opencv.org/3.4 .4/d4/d86/group__imgproc__filter.html#gaabe8c836e97159a9193fb0b11ac52cf1).

images.matToImage(mat)

[v4.1.0 New]

  • mat {Mat} OpenCV's Mat object
  • Back to {Image}

Convert Mat object to Image object.

Find pictures and colors

images.requestScreenCapture([landscape])

  • landscape {boolean} Boolean value, indicating whether the screenshot to be executed is a landscape screen. If landscape is false, it means vertical screen screenshot; true means horizontal screen screenshot.

Apply for screenshot permission from the system, and return whether the request is successful.

The first time you use this function, a screenshot permission request will pop up. It is recommended to select "Always Allow".

This function only applies for screenshot permission, and does not actually execute screenshots. The real screenshot function is captureScreen().

This function only needs to be executed once in the screenshot script, instead of calling captureScreen() every time.

If you do not specify the landscape value, the screenshot orientation is determined by the current device screen orientation, so be sure to pay attention to the screen orientation when executing this function.

It is recommended to run this function on the interface of this software. A flashing black screen is likely to occur when other software interfaces are running.

Example:

//Request a screenshot
if(!requestScreenCapture()){
    toast("Failed to request screenshot");
    exit();
}
//Continuously take screenshots of 10 pictures (with an interval of 1 second) and save them to the memory card directory
for(var i = 0; i <10; i++){
    captureScreen("/sdcard/screen_capture_" + i + ".png");
    sleep(1000);
}

This function can also be used as a global function.

images.captureScreen()

Capture the current screen and return an Image object.

Executing this function without screenshot permission will throw a SecurityException.

This function will not return null, and two calls may return the same Image object. This is because it takes a certain amount of time to update the device screenshots, and continuous calls within a short period of time (usually 16ms) will return the same screenshot.

The screenshot needs to be converted to Bitmap format, so the execution of this function takes a certain amount of time (0~20ms).

In addition, after requestScreenCapture() is executed successfully, it will take a certain amount of time for the screenshot to be available. Therefore, if you call captureScreen() immediately, it will wait for a certain period of time (usually several hundred ms) before returning the screenshot.

example:

//Request a horizontal screenshot
requestScreenCapture(true);
//Screenshot
var img = captureScreen();
//Get the color value at point (100, 100)
var color = images.pixel(img, 100, 100);
//Display the color value
toast(colors.toString(color));

This function can also be used as a global function.

images.captureScreen(path)

  • path {string} The path to save the screenshot

Capture the current screen and save it to path in PNG format. If the file does not exist, it will be created; if the file exists, it will be overwritten.

The function will not return any value. This function can also be used as a global function.

images.pixel(image, x, y)

  • image {Image} image
  • x {number} The abscissa of the pixel to be obtained.
  • y {number} The ordinate of the pixel to be obtained.

Returns the ARGB value of the pixel of the image image at point (x, y).

The format of the value is 0xAARRGGBB, which is a "32-bit integer" (although JavaScript does not distinguish between integer types and other numeric types).

The origin of the coordinate system is the upper left corner of the picture. Take the left side of the picture as the y-axis, and the upper side as the x-axis.

images.findColor(image, color, options)

  • image {Image} image
  • color {number} | {string} The RGB value of the color to be found. If it is an integer, it represents the RGB value in the form of 0xRRGGBB (the A channel will be ignored); if it is a string, it represents its RGB value with "#RRGGBB".
  • options {Object} options

Look for the color color in the picture. When it is found, it returns the found point Point, and when it cannot find it, it returns null.

Options include:

  • region {Array} Find the color region. Is an array of two or four elements. (region[0], region[1]) represents the upper left corner of the color-finding area; region[2]*region[3] represents the width and height of the color-finding area. If there are only two elements in the region, the color-finding region is (region[0], region[1]) to the lower right corner of the screen. If the region option is not specified, the color-finding area is the entire picture.
  • threshold {number} The critical value of color similarity when searching for color, the range is 0~255 (the smaller the more similar, 0 means the color is equal, 255 means any color can be matched). The default is 4. The conversion of threshold and floating point similarity (0.0~1.0) is similarity = (255-threshold) / 255.

This function can also be used as a global function.

An example of cyclic color finding is as follows:

requestScreenCapture();

//Look for the color in a loop, stop when it finds red (#ff0000) and report the coordinates
while(true){
    var img = captureScreen();
    var point = findColor(img, "#ff0000");
    if(point){
        toast("Find the red color, the coordinates are (" + point.x + ", "+ point.y + ")");
    }
}

An example of color finding in an area is as follows:

//Read local picture/sdcard/1.png
var img = images.read("/sdcard/1.png");
//Determine whether the image is loaded successfully
if(!img){
    toast("No such picture");
    exit();
}
//Find the color in the picture, and specify the color-finding area to be the area with a width of 300 and a length of 200 at the position (400, 500), and the specified color-finding critical value is 4
var point = findColor(img, "#00ff00", {
     region: [400, 500, 300, 200],
     threshold: 4
 });
if(point){
    toast("Found it:" + point);
}else{
    toast("Not found");
}

images.findColorInRegion(img, color, x, y[, width, height, threshold])

An easy way to find the color of an area.

Equivalent to

images.findColor(img, color, {
     region: [x, y, width, height],
     threshold: threshold
});

This function can also be used as a global function.

images.findColorEquals(img, color[, x, y, width, height])

  • img {Image} image
  • color {number} | {string} the color to find
  • x {number} The abscissa of the upper left corner of the color finding area
  • y {number} The ordinate of the upper left corner of the color finding area
  • width {number} The width of the color finding area
  • height {number} the height of the color finding area
  • Return {Point}

Find a point where the color and color are exactly equal in the specified area of ​​the image img, and return to the left of that point; if not found, return null.

The color finding area is specified by x, y, width, height. If the color finding area is not specified, it will be searched in the whole picture.

This function can also be used as a global function.

Example: (Judging whether there are unread messages by looking for the color of the QQ red dot)

requestScreenCapture();
launchApp("QQ");
sleep(1200);
var p = findColorEquals(captureScreen(), "#f64d30");
if(p){
    toast("There are unread messages");
}else{
    toast("No unread messages");
}

images.findMultiColors(img, firstColor, colors[, options])

  • img {Image} Looking for the color picture
  • firstColor {number} | {string} The color of the first point
  • colors {Array} represents an array of the position and color of the remaining points relative to the first point, each element of the array is [x, y, color]
  • options {Object} options, including:
    • region {Array} Find the color region. Is an array of two or four elements. (region[0], region[1]) represents the upper left corner of the color-finding area; region[2]*region[3] represents the width and height of the color-finding area. If there are only two elements in the region, the color-finding region is (region[0], region[1]) to the lower right corner of the screen. If the region option is not specified, the color-finding area is the entire picture.
    • threshold {number} The threshold of color similarity when searching for colorValue, the range is 0~255 (the smaller the more similar, 0 means the color is equal, 255 means any color can be matched). The default is 4. The conversion of threshold and floating point similarity (0.0~1.0) is similarity = (255-threshold) / 255.

Multi-point color search, similar to the multi-point color search of the button wizard, the process is as follows:

  1. Find the position of the color firstColor in the picture img (x0, y0)
  2. For each element [x, y, color] of the array colors, check whether the pixel of the image img at the position (x + x0, y + y0) is the color color, if yes, return (x0, y0), otherwise continue Find the location of firstColor and re-execute step 1
  3. Return null when the entire picture cannot be found

For example, for the code images.findMultiColors(img, "#123456", [[10, 20, "#ffffff"], [30, 40, "#000000"]]), assume that the image is at (100, 200) The color of the position is #123456, then if the color of the position (110, 220) is #fffff and the color of the position (130, 240) is #000000, the function returns the point (100, 200).

If you want to specify the color finding area, specify it in the options, for example:

var p = images.findMultiColors(img, "#123456", [[10, 20, "#ffffff"], [30, 40, "#000000"]], {
    region: [0, 960, 1080, 960]
});

images.detectsColor(image, color, x, y[, threshold = 16, algorithm = "diff"])

  • image {Image} image
  • color {number} | {string} The color to be detected
  • x {number} the abscissa of the position to be detected
  • y {number} The ordinate of the position to be detected
  • threshold {number} The threshold of color similarity, the default is 16. The value range is 0~255.
  • algorithm {string} Color matching algorithm, including:
    • "equal": Equal matching, matching only when it is exactly equal to the given color color.

    • "diff": Difference matching. Matches when the sum of the absolute values ​​of the R, G, and B differences of a given color is less than the threshold.

    • "rgb": rgb Euler distance similarity. Match when the rgb Euler distance with the given color color is less than or equal to the threshold.

    • "rgb+": Weighted rgb Euler distance matching (LAB Delta Eopen in new window).

    • "hs": hs Euler distance matching. hs is the hue value in HSV space.

Returns whether the image image matches the color color at position (x, y). Used to detect whether a certain position in the picture is a specific color.

An example of judging whether a Weibo of the Weibo client has been liked:

requestScreenCapture();
//Find the like control
var like = id("ly_feed_like_icon").findOne();
//Get the coordinates of the midpoint of the control
var x = like.bounds().centerX();
var y = like.bounds().centerY();
//Screenshot
var img = captureScreen();
//Determine whether the color at the coordinate is orange-red
if(images.detectsColor(img, "#fed9a8", x, y)){
    //If yes, I already liked it, and don’t do anything.
}else{
    //Otherwise click the like button
    like.click();
}

images.detectsMultiColors(img, x, y, firstColor, colors, options)

  • img {Image} target image
  • x {number} the x coordinate of the first point
  • y {number} the y coordinate of the first point
  • firstColor {number} | {string} The color of the first point
  • colors {Array} represents an array of the position and color of the remaining points relative to the first point, each element of the array is [x, y, color]
  • options {Object} options, including:
    • region {Array} Find the color region. Is an array of two or four elements. (region[0], region[1]) represents the upper left corner of the color-finding area; region[2]*region[3] represents the width and height of the color-finding area. If there are only two elements in the region, the color-finding region is (region[0], region[1]) to the lower right corner of the screen. If the region option is not specified, the region is the entire picture.
    • threshold {number} The critical value of color similarity in color comparison, ranging from 0 to 255 (the smaller the more similar, 0 means the color is equal, and 255 means any color can be matched). The default is 4. The conversion of threshold and floating point similarity (0.0~1.0) is similarity = (255-threshold) / 255.
  • Return boolean

Multi-point colorimetry, returns whether the colors of multiple points at the starting position (x, y) of the img match.

See the documentation of images.findMultiColors() for multi-point color finding.

log(images.detectsMultiColors(img, 100, 200, "#000000", [[3, 4, "#123456"], [8, 10, "#ff0000"]]));

images.findImage(img, template[, options])

[v8.5.5 New]

  • img {Image} big picture
  • template {Image} small image (template)
  • options {Object} Find image options

Find a picture. Find the position of the small picture template in the big picture img (module matching), return the position coordinates (Point) when found, and return null when not found.

Options include:

  • threshold {number} Image similarity. A floating point number with a value range of 0~1. The default value is 0.9.
  • region {Array} Find the map area. See the description of the findColor function for regions.
  • level {number} Generally speaking, it is not necessary to modify this parameter. When this parameter is not added, the parameter will be automatically adjusted according to the size of the picture. The image finding algorithm uses image pyramids. The level parameter indicates the level of the pyramid. The larger the level, the higher the efficiency of image finding, but it may also cause image finding failure (the image cannot be distinguished due to excessive shrinkage) or return to the wrong position. . Therefore, unless you know the meaning of this parameter and need to perform performance tuning, you do not need to use this parameter.

This function can also be used as a global function.

One of the simplest examples of finding pictures is as follows:

var img = images.read("/sdcard/大图.png");
var templ = images.read("/sdcard/小图.png");
var p = findImage(img, templ);
if(p){
    toast("Found it:" + p);
}else{
    toast("Not found");
}

An example of finding a picture for a slightly more complicated area is as follows:

auto();
requestScreenCapture();
var wx = images.read("/sdcard/WeChat icon.png");
//Return to the desktop
home();
//Take a screenshot and find the picture
var p = findImage(captureScreen(), wx, {
    region: [0, 50],
    threshold: 0.8
});
if(p){
    toast("Found the WeChat icon on the desktop: "+ p);
}else{
    toast("WeChat icon was not found on the desktop");
}

images.findImageInRegion(img, template, x, y[, width, height, threshold])

An easy way to find maps by area. Is equivalent to:

images.findImage(img, template, {
    region: [x, y, width, height],
    threshold: threshold
})

This function can also be used as a global function.

images.matchTemplate(img, template, options)

[v4.1.0 New]

  • img {Image} big picture
  • template {Image} small image (template)
  • options {Object} Options for finding images:
    • threshold {number} Image similarity. A floating point number with a value range of 0~1. The default value is 0.9.
    • region {Array} Find the map area. See the description of the findColor function for regions.
    • max {number} The maximum number of search results, the default is 5
    • level {number} Generally speaking, it is not necessary to modify this parameter. When this parameter is not added, the parameter will be automatically adjusted according to the size of the picture. The image finding algorithm uses image pyramids. The level parameter indicates the level of the pyramid. The larger the level, the higher the efficiency of image finding, but it may also cause image finding failure (the image cannot be distinguished due to excessive shrinkage) or return to the wrong position. . Therefore, unless you know the meaning of this parameter and need to perform performance tuning, you do not need to use this parameter.
  • Return {MatchingResult}

Search for small pictures in big pictures, and return the search result MatchingResult. This function can be used to find multiple positions when looking for images, and the maximum number of results can be controlled by the max parameter. You can also sort the matching results and find the best value.

MatchingResult

[v4.1.0 New]

matches

  • {Array} The array of matching results.

The element of the array is a Match object:

  • point {Point} matching position
  • similarity {number} similarity

E.g:

var result = images.matchTemplate(img, template, {
    max: 100
});
result.matches.forEach(match => {
    log("point = "+ match.point + ", similarity =" + match.similarity);
});

points

  • {Array} The array of matching positions.

first()

  • Back to {Match}

The first match result. If there is no match, null is returned.

last()

  • Back to {Match}

The last matching result. If there is no match, null is returned.

leftmost()

  • Back to {Match}

The matching result at the far left of the big picture. If there is no match, null is returned.

topmost()

  • Back to {Match}

The matching result at the top of the big picture. If there is no match, null is returned.

rightmost()

  • Back to {Match}

The matching result on the far right of the big picture. If there is no match, null is returned.

bottommost()

  • Back to {Match}

The matching result at the bottom of the big picture. If there is no match, null is returned.

best()

  • Back to {Match}

The matching result with the highest similarity. If there is no match, return null.

worst()

  • Back to {Match}

The matching result with the lowest similarity. If there is no match, null is returned.

sortBy(cmp)

  • cmp {Function}|{string} Comparison function, or a string indicating the sorting direction. For example, "left" means to sort the matching results from left to right according to the matching position, "top" means to sort the matching results from top to bottom according to the matching position, and "left-top" means to sort the matching results from left to right according to the matching position, Sort from top to bottom. The directions include left (left), top (up), right (right), and bottom (down).
  • {MatchingResult}

Sort the matching results and return the sorted results.

var result = images.matchTemplate(img, template, {
    max: 100
});
log(result.sortBy("top-right"));

Image

Represents a picture, which can be a screenshot picture, or a picture read locally, or a picture obtained from the Internet.

Image.getWidth()

Returns the width of the image in pixels.

Image.getHeight()

Returns the height of the image in pixels.

Image.saveTo(path)

  • path {string} path

Save the picture to the path path. (Overwrite if the file exists)

Image.pixel(x, y)

  • x {number} abscissa
  • y {number} ordinate

Returns the ARGB value of the pixel of the image image at point (x, y).

The format of the value is 0xAARRGGBB, which is a "32-bit integer" (although JavaScript does not distinguish between integer types and other numeric types).

The origin of the coordinate system is the upper left corner of the picture. Take the left side of the picture as the y-axis, and the upper side as the x-axis.

Point

findColor, the object returned by findImage. Represents a point (coordinate).

Point.x

Abscissa.

Point.y

Y-axis.

Last update:
Contributors: hyb1996