facing-screen 2019-12-22 10:43 采纳率: 50%
浏览 1227
已采纳

echarts.js怎么设置时间的显示格式?

图片说明

如图,提示想让提示框里显示的时间的格式和下面一样只显示时分秒该怎么弄呢?

下面是代码:

    let myChart = echarts.init(document.getElementById('timeShaft'));
    var data = [['2009/6/12 16:09:00', '2009/6/12 16:09:40', 1, 'A','字幕'], ['2009/6/12 16:10:00', '2009/6/12 16:10:10', 1, 'B','字幕'], ['2009/6/12 16:12:00', '2009/6/12 16:12:40', 1, 'C','字幕'], ['2009/6/12 16:18:00', '2009/6/12 16:18:10', 1, 'D','字幕']];
    var colorList = ['#4f81bd', '#9bbb59', '#604a7b']; // , '#e46c0b' '#3a3d44',

    data = echarts.util.map(data, function (item, index) {
        return {
            value: item,
            itemStyle: {
                normal: {
                    color: colorList[index % 3]
                }
            }
        };
    });

    function renderItem(params, api) {
        var yValue = api.value(2);
        var start = api.coord([api.value(0), yValue]);
        var size = api.size([api.value(1) - api.value(0), yValue]);
        var style = api.style();

        return {
            type: 'rect',
            shape: {
                x: start[0],
                y: start[1],
                width: size[0],
                height: size[1]
            },
            style: style
        };
    }

    let option = {
        title: {
            // text: 'Profit',
            left: 'center'
        },
        tooltip: {
        },
        xAxis: {
            scale: true,
            type:'time'
            // splitLine:{show:false}, // 网格线
        },
        yAxis: {
            splitLine:{show:false}, // 网格线
            axisLabel:[1,2]
        },
        dataZoom: [
            {
                type: 'slider',
                start: 0,
                end: 100
            },
            {
                type: 'inside',
                start: 0,
                end: 100
            }
        ],
        series: [{
            type: 'custom',
            renderItem: renderItem,
            label: {
                normal: {
                    show: true,
                    position: 'top'
                }
            },
            dimensions: ['from', 'to'],
            encode: {
                x: [0, 1],
                y: 2,
                tooltip: [0, 1],
                itemName: 4
            },
            data: data
        }],
        grid: {
            left: '20px',
            right: '20px',
            top: '4px',
            bottom: '20px'
        } 
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  • 写回答

1条回答 默认 最新

  • 崽崽的谷雨 2019-12-23 14:22
    关注

    你可以自己写个方法格式化一下

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 已采纳回答 2月22日

悬赏问题

  • ¥15 u盘问题:盘符不显示 无媒体
  • ¥50 R语言读取nc按月均值转为tif
  • ¥30 智能车串级pid调参
  • ¥15 visual studio code翻译老是错误
  • ¥20 卫星测高数据的高程转换
  • ¥15 爬取招聘网站数据信息
  • ¥15 安装完tensorflow,import tensorflow as tf后报错,如何解决?
  • ¥15 ultralytics库导出onnx模型,模型失去预测能力
  • ¥15 linux下点对点协议连接2个USB串口的硬件流量控制问题
  • ¥15 SQL数据自动生成问题