javascript - 使用 JavaScript 的 Bliffoscope 数据分析解决方案

Question

我想使用 javascript 解决 Bliffscope 数据分析问题。我有以下问题。

这是史莱姆鱼雷

       +
       +
      +++
    +++++++
    ++   ++
   ++  +  ++
   ++ +++ ++
   ++  +  ++
    ++   ++
    +++++++
      +++

这是测试数据

              + +    +              ++           +       +++    +     +
 +  ++     +   + ++++    + +       +         +          +  +   +++     +++ +
     +            + +   ++      ++  ++    + ++       +     +      +  +   +
+   ++      +  ++       +          + +       ++        ++  +           +
 ++++++ + +    +   ++  +  +   +   +  ++      +         +                     +
  + +   +      +               +      ++     +  ++            +   +    + +
+++   + ++   +  +            +  +++       + +       ++                     +
  +++++  +      +                            +  + +            +   +  +
 +   +   +              +    +      +            +  +   +      +    +     +
 ++    +              +     +       ++   +          +       +           ++

有一个问题已经与此类似但在 Java 中。这个问题问here .

如何在 JavaScript 中解决这个问题。

更新

我尝试了以下解决方案。

    const fs = require('fs');

    let torpedo = [], starship = [], testData = [];
        // counter = -1;

    function getTorpedoData(fileName, type) {
        let counter = -1;

        return new Promise(function(resolve, reject) {
            fs.readFile(fileName,'utf8', (err, data) => {

                if (err) {
                    reject();
                } else {
                    for (let i = 0; i < data.length; i++) {
                        if (data[i] == '\n' || counter === -1) {
                            torpedo.push([]);
                            counter++;
                        } else {
                            torpedo[counter].push(data[i]);
                        }
                    }
                }

                console.log(data);

                resolve();
            });
        });
    }

    function getTestData(fileName, type) {
        let counter = -1;

        return new Promise(function(resolve, reject) {
            fs.readFile(fileName,'utf8', (err, data) => {

                if (err) {
                    reject();
                } else {
                    for (let i = 0; i < data.length; i++) {
                        if (data[i] == '\n' || counter === -1) {
                            testData.push([]);
                            counter++;
                        } else {
                            testData[counter].push(data[i]);
                        }
                    }
                }

                console.log(data);

                resolve();
            });
        });
    }

    let score = 0;

    getTorpedoData('./SlimeTorpedo.blf', 'torpedo').then((data) => {
        getTestData('./TestData.blf', 'testData').then(() => {
            torpedo.forEach((torpedoArray, torpedoIndex) => {
                torpedoArray.filter((contents) => {
                    if (contents === '+') {
                        testData.forEach((testDataArray) => {
                            testDataArray.filter((dataContents, dataIndex) => {
                                // console.log(dataContents);
                                if (dataContents === '+') {
                                    if (torpedoIndex === dataIndex) {
                                        score++;
                                    }
    //                              console.log(score);
                                }
                            });
                        });
                    }
                });
            });
        });
    });

我创建了 3 个数组 torpedo、starship 和 testData。我阅读了所有这些文件并将它们放入多维数组(上图)中。然后我试图在 testData 数组中找到比较索引 if torpedo 数组。但是，我做错了什么。 我该如何解决？

[由 Spektre 编辑]

测试数据的测试结果(这个和来自@greybeard 链接的那个):

红色表示不匹配，黄色表示匹配。分数因匹配而递增，因不匹配而递减。 x 从零向右计数，y 从零向下计数，但您的数据被空行放大，因此您可以从 1 开始计数 ...

Answer 1

您是否在寻找这样的东西 ( Fiddle )？

    
    // Create our images: torpedo (object) and background (context)

var object = "    +\n    +\n   +++\n +++++++\n ++   ++\n++  +  ++\n++ +++ ++\n++  +  ++\n ++   ++\n +++++++\n   +++",
    context = "              + +    +              ++           +       +++    +     +\n +  ++     +   + ++++    + +       +         +          +  +   +++     +++ +\n     +            + +   ++      ++  ++    + ++       +     +      +  +   +\n+   ++      +  ++       +          + +       ++        ++  +           +\n ++++++ + +    +   ++  +  +   +   +  ++      +         +                     +\n  + +   +      +               +      ++     +  ++            +   +    + +\n+++   + ++   +  +            +  +++       + +       ++                     +\n  +++++  +      +                            +  + +            +   +  +\n +   +   +              +    +      +            +  +   +      +    +     +\n ++    +              +     +       ++   +          +       +           ++ ";


    var c = document.getElementById("test_canvas"),
        ctx = c.getContext("2d"),
        scale = 10;

// Draw a pixel on canvas
function draw_pixel(x, y, fill_style) {
    ctx.fillStyle = fill_style;
    ctx.fillRect(x * scale, y * scale, scale, scale);
}

// Receive an array of coordinates, draw pixels
function draw_image(serialized_image, fill_style) {
    for (var i = 0, len = serialized_image.length; i < len; i++) {
        draw_pixel(serialized_image[i][0], serialized_image[i][1], fill_style);
    }
}

// Receive a text string, turn it into an array of coordinates of filled in pixels
function serialize_map(char_map) {
    var x = 0,
        y = 0,
        c,
        map = [];
    for (var i = 0, len = char_map.length; i < len; i++) {
        c = char_map[i];
        if (c == '+') {
            map.push([x, y])
        }
        x += 1;
        if (c == '\n') {
            x = 0;
            y += 1;
        }
    }
    return map;
}

// Find number of intersections between two images
function array_intersect() {
    var a, d, b, e, h = [],
        f = {},
        g;
    g = arguments.length - 1;
    b = arguments[0].length;
    for (a = d = 0; a <= g; a++) {
        e = arguments[a].length, e < b && (d = a, b = e);
    }
    for (a = 0; a <= g; a++) {
        e = a === d ? 0 : a || d;
        b = arguments[e].length;
        for (var l = 0; l < b; l++) {
            var k = arguments[e][l];
            f[k] === a - 1 ? a === g ? (h.push(k), f[k] = 0) : f[k] = a : 0 === a && (f[k] = 0);
        }
    }
    return h;
}

// Translate the coordinates of a serialized image
function translate(coords, ix, iy) {
    return [coords[0] + ix, coords[1] + iy];
}

// Find in which position the object has more intersections with the background
function get_best_position(context, object) {

    // Calculate image dimensions
    context_width = context.sort(function(a, b) {
        return b[0] - a[0];
    })[0][0];
    context_height = context.sort(function(a, b) {
        return b[1] - a[1];
    })[0][1];
    object_width = object.sort(function(a, b) {
        return b[0] - a[0];
    })[0][0];
    object_height = object.sort(function(a, b) {
        return b[1] - a[1];
    })[0][1];

    // Swipe context, store amount of matches for each patch position
    similaritudes = [];
    for (var cx = 0; cx < context_width; cx++) {
        for (var cy = 0; cy < context_height; cy++) {
            translated_object = object.map(function(coords) {
                return translate(coords, cx, cy);
            })
            intersection = array_intersect(context, translated_object);
            // console.log(translated_object);
            similaritudes[intersection.length] = [cx, cy];

        }
    }
    // Return position for which number of matches was greater
    return similaritudes.slice(-1)[0];
}

// Parse our images from the text strings
var serialized_context = serialize_map(context);
var serialized_object = serialize_map(object);

// Find best position for our torpedo
var best_position = get_best_position(serialized_context, serialized_object);

// Translate torpedo to best position
positioned_object = serialized_object.map(function(coords) {
    return translate(coords, best_position[0], best_position[1]);
});

// Draw background and torpedo 
draw_image(serialized_context, "gray");
draw_image(positioned_object, "rgba(0, 255, 0, 0.5)");

<canvas id="test_canvas" width="800" height="120" style="border:1px solid #000000;">
</canvas>