Question

我有一个dygraph图表两个十进制数字相互对照。我以下列形式提供数据：

[[0.4,0.5],[0.6,0.7]]

等

我正在尝试在设置上使用labels属性来强制图形显示x值的标签，但它只是忽略它并正确使用第二个值。

我有没有办法在图例中显示名称？

这是图表的样子（显然有不同的数据！）

<div id="OptimisationCloud" style="width:100%;height:450px"></div>
<script type="text/javascript">

$(document).ready(function () {
g = new Dygraph(
                document.getElementById("OptimisationCloud"),
                [[0.4,0.5],[0.6,0.7]],
                {
                    strokeWidth: 0.0,
                    drawPoints: true,
                    xlabel:"Annualised Volatility",
                    ylabel:"Annualised Return",
                    axes: {
                        x: {
                            axisLabelFormatter: function (x) {
                                return (x * 100).toFixed(0) + "%";
                            }
                        },
                        y: {
                            axisLabelFormatter: function (y) {
                                return (y * 100).toFixed(0) + '%';
                            }
                        }
                    },
                    labels:["Ann Vol", "Ann Ret"],
                    colors: ["#1f4e6c"],
                    valueFormatter: function (y) {
                                return (y * 100).toFixed(2) + '%';
                            }
                }
            );
});

</script>

正如我所说，Ann Ret来了，但Ann Vol没有出现。

Answer 1

这是预期的行为。

例如，如果我有时间序列，我希望它显示

2013-12-25: Presents: 5, Xmas Tree: 1

我知道你想要展示价值而不是时间。所以考虑到上述情况，你只需要将x轴作为另一个y轴传递，例如

[
    //X   Y1   Y2
    [0.4, 0.4, 0.5]
    [0.6, 0.6, 0.7]
]

并隐藏生成的图例标签。

我的示例代码：

g = new Dygraph(
    document.getElementById("OptimisationCloud"),
    [
        [0.4,0.4,0.5],
        [0.6,0.6,0.7],
    ],
    {
        strokeWidth: 0.0,
        drawPoints: true,
        axes: {
            x: {
                axisLabelFormatter: function (x) {
                    return (x * 100).toFixed(0) + "%";
                },
                valueFormatter: function (y) {
                    return ""; //Hide legend label
                }
            },
            y: {
                axisLabelFormatter: function (y) {
                    return (y * 100).toFixed(0) + '%';
                },
                valueFormatter: function (y) {
                    return (y * 100).toFixed(2) + '%';
                }               
            },
            y2: {
                axisLabelFormatter: function (y) {
                    return (y * 100).toFixed(0) + '%';
                },
                valueFormatter: function (y) {
                    return (y * 100).toFixed(2) + '%';
                }
            }
        },
        labels:["X", "Ann Vol", "Ann Ret"], //The "X" is hidden by returning the empty string above
        xlabel: "Annualised Volatility",
        ylabel: "Annualised Return",
        colors: ["#1f4e6c"],
    }
);

Dygraphs：在图例中显示X名称

1 个答案: