Question

我有一个包含以下内容的JSON文件：

@POST("upload")
Single<ApiResponse> uploadPhoto(@Body MyRequestBody myRequestBody);

在我的HTML中，我希望有一个像这样的范围滑块：

{"mapping": [
    [
        "london",
        "51.18452",
        "-0.150839",
        "2016-04-19"
    ],
    [
        "london",
        "52.6127",
        "-2.02296",
        "2016-04-21"
    ],
    [
        "london",
        "53.334",
        "-6.2761",
        "2016-04-15"
    ]
}

在这种情况下，应显示最早的JSON数据，所以

[]-----------------
oldest       recent

当用户慢慢将范围滑块移近右端时，应显示更新的数据..

    "london",
    "53.334",
    "-6.2761",
    "2016-04-15"

显示..

----------------[]-
oldest       recent

我在JSON文件中有很多其他值，我只是用这三个例子来显示文件的格式。我正在创建一个热图，当滑块移动时，热图应该会改变以生成不同的点。感谢您的帮助！

Answer 1

将数组转换为对象是可选的，但引用这样的属性要容易得多，它也允许我们将日期字符串转换为具有要与之比较的数字值的日期对象。

const objectMapping = data.mapping.map(element => ({city:element[0], latitude:element[1], longitude:element[2], date:new Date(element[3])}));

既然你有对象而不是数组，你可以在日期对象上说Array.sort，如果b高于a，那么b会来在列表中的a之前

const sortedMapping = objectMapping.sort((a, b) => b.date - a.date);

然后sortedMapping[0] =最早的日期

HTML范围滑块显示JSON取决于日期

1 个答案: