nvd3 multibarchart xAxis按键排序答案

【问题标题】：nvd3 multibarchart xAxis sorted by keynvd3 multibarchart xAxis按键排序
【发布时间】：2024-04-21 08:00:02
【问题描述】：

我无法设置能够按 xAxis 中的日期对条形进行排序的 NVD3 多条形图。我知道输入数据在显示到多条形图中之前必须按键分组。

这里有一个 jsfiddle 说明我在说什么：http://jsfiddle.net/fontanon/z4aZ4/54/

正如您在数据变量中看到的，我添加了三组条形（key1、key2 和 key3）。每个组的 x 值按升序排列。 key2 的第一个栏应该是第一个（至于具有最小 x 值），然后是 key1 的第一个栏，然后是 key2 的第二个栏，等等。但这不是显示栏的方式。

究竟发生了什么？数据下方。

var data = [
    {
        "key": "Key1",
        "values": [
            {
                "x": 2393337532000,
                "y": 1401431
            },
            {
                "x": 4394337660000,
                "y": 26188
            },
            {
                "x": 7395510769000,
                "y": 865575
            },
        ]
    },
    {
        "key": "Key2",
        "values": [
            {
                "x": 1396337532000,
                "y": 1401431
            },
            {
                "x": 3397337660000,
                "y": 26188
            },
            {
                "x": 6398510769000,
                "y": 865575
            }
        ]
    },
    {
        "key": "Key3",
        "values": [
            {
                "x": 5399337532000,
                "y": 1401431
            },
            {
                "x": 8400337660000,
                "y": 26188
            },
            {
                "x": 9401510769000,
                "y": 865575
            }
        ]
    }
]

【问题讨论】：

标签： sorting d3.js nvd3.js

【解决方案1】：

你的数据应该是这样的

var data = [
    {
        "key": "Key1",
        "values": [
            {
                "x": 7393337532000,
                "y": 1401431
            },
            {
                "x": 8394337660000,
                "y": 26188
            },
            {
                "x": 3398510769000,
                "y": 865575
            }
        ]
    },
    {
        "key": "Key2",
        "values": [
            {
                "x": 7393337532000,
                "y": 1401431
            },
            {
                "x": 8394337660000,
                "y": 26188
            },
            {
                "x": 3398510769000,
                "y": 865575
            }
        ]
    },
    {
        "key": "Key3",
        "values": [
            {
                "x": 7393337532000,
                "y": 1401431
            },
            {
                "x": 8394337660000,
                "y": 26188
            },
            {
                "x": 3398510769000,
                "y": 865575
            }
        ]
    }
]

【讨论】：

实际解释如何？