首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >当试图隐藏第二轴蜱时,Flot图向上移动。

当试图隐藏第二轴蜱时,Flot图向上移动。
EN

Stack Overflow用户
提问于 2016-07-05 15:36:06
回答 1查看 120关注 0票数 1

目前,我正在研究一些显示与时间有关的单一和多组数据的flot图形。下面是图上一组数据的示例图像。

单数据集

日期时间选择器允许用户比较第二数据集在初始集上绘制的两个时间范围。我遇到的问题是,当第二个数据集在第一个数据集上绘制时,整个图向上移动,显示隐藏的滴答应该是一个大的空白,参见下面的示例图像。

多数据集

正如您可以看到的,数据集是不同的时间范围,因此不能在同一轴上,因为它们是比较。这是我对斧头的选择。

代码语言:javascript
复制
xaxes: [{
            tickColor: "#fff",
            mode: "time",
            timeformat: timeFormat,
            minTickSize: tickSize,
            font: {
                style: "normal",
                color: "#666666"
            },
            axisLabel: xLabel,
            axisLabelUseCanvas: true,
            axisLabelFontSizePixels: 11,
            axisLabelColour: "#666666",
            axisLabelFontFamily: 'Open Sans',
            axisLabelPadding: 20
        },
        {
            ticks: [],
            mode: "time",
            timeFormat: timeFormat
        }],

应用该选项将显示:第二个xaxis上的false将完全删除移位,但是由于它是假的,我的图形点工具提示也被删除。

如果需要了解,我将使用flot.time、flot.tooltip和flot.axislabels。这是我的第一个问题,所以任何反馈都会很好:)

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-07-05 16:11:33

我在JSFiddle上的例子。

这一切归结为两个主要的变化。将比较图数据分配给第二个x轴:

代码语言:javascript
复制
var dataSet = [{
            data:  [
                [1467669600000, 12],
                [1467709200000, 14]
            ],
            label: 'data1',
            xaxis: 1
        }, {
            data:  [
                [1467583200000, 15],
                [1467622800000, 13],
                [1467662400000, 16]
            ],
            label: 'data2',
            xaxis: 2
        }];

为了美观起见,您应该隐藏第二个x轴,这样它就不会反映相同的时间(设置为show: false)。

代码语言:javascript
复制
{
    "show": false,
    "mode": "time",
    "timeformat": "%H:%M",
    "tickSize": [2, "hour"],
    "min": 1467583200000,
    "max": 1467666000000,
    "timezone": "browser"
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/38207450

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档