var chart = new F2.Chart({

    id: 'mountNode',
    pixelRatio: window.devicePixelRatio
});

chart.source(newData, {
    value: {
        tickCount: 5,
        min: 0
    },
    date: {
        //type: 'timeCat',
        range: [0, 1],
        values: values,//使用拖拽要初始化数据
        tickCount: 10
    }
});
chart.tooltip({
    custom: true,
    showXTip: true,
    showYTip: true,
    snap: true,
    step:1,

    crosshairsType: 'xy',
    crosshairsStyle: {
        lineDash: [2]
    }
});
chart.axis('date', {
    label: function label(text, index, total) {
        //console.log(text)
        var textCfg = {};
        if (index === 0) {
            textCfg.textAlign = 'left';
        } else if (index === total - 1) {
            textCfg.textAlign = 'right';
        }
        console.log(text)
        return textCfg;
    }
});


chart.area().position('date*value').color('l(90) 0:#f4c125 1:#f7f7f7');
chart.line().position('date*value').color('l(90) 0:#f4c125 1:#f7f7f7');

chart.guide().text({
    position: ['min', 'max'],
    content: '水量(ml)',
    offsetY: -15,
});

chart.interaction('pan',{
    mode: 'x',
    pressTime:300
});
// 定义进度条
chart.scrollBar({
    mode: 'x',
    xStyle: {
        offsetY: -5
    },
    pressTime:300
});

chart.render();

解决方案 :设置不同 pressTime 来先后响应

最后修改:2020 年 11 月 03 日
如果觉得我的文章对你有用,请随意赞赏