javascript使用$.each解析内容，并创建一个数组发送给函数

javascript parse contents using $.each and create an array to send to function

本文关键字：一个 数组 函数 创建 each 使用 javascript      更新时间：2023-09-26

我正试图解决从json格式数据创建数组的问题。

以下是我试图以正确格式发送给函数的数据示例。

{"polylines":[{"1":"-3555.00","2":"-2354.00","3":"-981.00","id":"1","text":"line1"},
{"1":"2564.25","2":"2566.00","3":"2664.50","id":"2","text":"line2"}]}

数据可以重新排列/更改/并变得不同，这只是我一直在努力工作的一个例子。我用数字来表示X和Y坐标。我真的不知道还有什么其他方式可以表示多个x和y坐标的数据，所以我用奇数和偶数来表示它们。

我试图创建的数组就像这个

[Array[4]]
    0: Array[4]
        0: Array[2]
            0: -82.1002847583325
            1: -98.19580078125
            length: 2
        1: Array[2]
            0: -82.1002847583325
            1: -98.19580078125
            length: 2
[Array[5]]
    0: Array[4]
        0: Array[2]
            0: -82.1002847583325
            1: -98.19580078125
            length: 2
        1: Array[2]
            0: -82.1002847583325
            1: -98.19580078125
            length: 2

0是X，1是Y

正如你在数据中看到的，有两行，我需要将这两行的X和Y坐标分别发送给函数。

这是我当前的来源

$.getJSON("data.php", function(e) {
var x = [];
var y = [];
var xy = [];
// Get each polyline
$.each(e.polylines, function(t, n) {
//go through each x and y so we can convert the x and y in a separate function
   $.each(n, function(n, r) {
        // If odd
        if(n % 2 == 1){
        x.push(r);
         // If even
        } else if (n % 2 == 0){
            y.push(r);
            // Convert each coordinate
            xy[r] = convertPoint(x, y);
            x = []; // Clear x
            y = []; // Clear y
            xy.push(xy[r]);
        }
    });
    console.log(xy);
    // My problem is here, I cant seem to create the correct array 
    //because the code is just going through both lines and sending them together.
    //I need to somehow separate them And send both arrays to the line below 
    //using the above each function.
    var r = L.multiPolyline([xy], {
        color: n.color,
        clickable: false,
        lineCap: "round"
    }).addTo(map);
});
});

我已经想了好几个小时了。。我现在没有什么想法了。

我真的很想知道怎么做。。

您可以创建如下json（对象数组），而不是奇数/偶数组合

var json = [{"X":"100","Y":"100"},{"X":"200","Y":"200"},{"X":"300","Y":"300"}];

然后使用循环对其进行处理并访问适当的坐标。

$(json).each(function(i){
    var x = json[i].X;
    var y = json[i].Y;
});

如果您在服务器端使用MVC和C#，您可以在下面创建类似json的

坐标类

public class Coordinates
{
    public string X { get; set; }
    public string Y { get; set; }
}

您的控制器操作代码将类似于：-

List<Coordinates> lst = new List<Coordinates>();
lst.Add(new Coordinates { X = "100", Y = "100" });
lst.Add(new Coordinates { X = "200", Y = "200" });
lst.Add(new Coordinates { X = "300", Y = "300" });
lst.Add(new Coordinates { X = "400", Y = "400" });
var json = new JavaScriptSerializer().Serialize(lst);
ViewBag.Coordinates = json;

然后在视图部分，访问这个json，如下所示；

//var json = [{"X":"100","Y":"100"},{"X":"200","Y":"200"},{"X":"300","Y":"300"}];
var json = JSON.parse('@ViewBag.Coordinates');

我想了想吃点东西后，终于自己解决了这个问题。尽管我昨天做了，哈哈。

这是解决方案。。。

    var x = [];
    var y = [];
    var xy = [];
    var pushed = [];
    var pushed2 = [];
    $.each(e.polylines, function(t, n) {
        $.each(n, function(n, r) {
            if(n % 2 == 1){
                x.push(r);
            } else if (n % 2 == 0){
                y.push(r);
                xy = convertPoint(x, y);
                pushed.push(xy);
                x = [];
                y = [];
            }
        });
        pushed2 = [pushed];
        pushed = [];
        console.log(pushed2);
        var r = L.multiPolyline(pushed2, {
            color: "#ffffff",
            clickable: false,
            lineCap: "round"
        }).addTo(map);

我有时觉得自己很笨。。。哈哈也许我。。在玩了一点阵列并对它们有了更多的了解之后。

所以基本上xy是被发送和转换的，推送将xy保存到一个数组中。。我的问题是，在数组创建了第一行之后，我没有清除它，所以它将数组堆叠起来，导致了奇怪的行为。

当它是如此小的东西时，它是如此令人讨厌。哈哈。我知道我走在了正确的轨道上。。。谢谢大家。

相关文章：