Incubator-echarts: 如何把tooltip中的时间字符串格式化成想要的格式,

Created on 4 May 2016  ·  2Comments  ·  Source: apache/incubator-echarts

问题简述 (One-line summary)

我使用折线图,
xAxis: {
type: 'time',
...
tooltip: {
trigger: 'item',
formatter: '{a},' +new Date(Date.parse({c})).Format("yyyy-MM-dd hh:mm:ss"), {d}(无)',
无法格式化时间格式,因为formatter是字符串,

版本及环境 (Version & Environment)

  • ECharts 版本 (ECharts version): 3
  • 浏览器类型和版本 (Browser version): chrome
  • 操作系统类型和版本 (OS Version): mac

    重现步骤 (Steps to reproduce)

期望结果 (Expected behaviour)

可以根据需求格式化时间格式

可能哪里有问题 (What went wrong)

ECharts配置项 (ECharts option)

option = {

}

var option{$k} = {
            title: {
                text: '{$key}'
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a},' +new Date(Date.parse({c})).Format("yyyy-MM-dd hh:mm:ss"), {d}(无)',
                axisPointer:{
                    show: true,
                    type : 'shadow',
                    lineStyle: {
                        type : 'dashed',
                        width : 1
                    }
                }
            },
            toolbox: {
                show : true,
                feature : {
                    mark : {show: true},
                    dataZoom : {show: true},
                    dataView : {show: true, readOnly: true,
                    },
                    restore : {show: true},
                    saveAsImage : {show: true,
                        type : 'png',
                        name : '{$key} {$linedata_starttime} 至 {$linedata_endtime}',
                  }
                }
            },
            xAxis: {
                type: 'time',
                splitLine: {
                    show: true
                }
            },
            yAxis: {
                type: 'value',
                min: 'dataMin',
                boundaryGap: [0, '100%'],
                splitLine: {
                    show: true
                }
            },
            dataZoom: [{
                type: 'inside',
                start: 0,
                end: 100
            }, {
                start: 0,
                end: 10
            }],
            series: [
  <volist name="vo" id="v">
              {
                  name: '{$v.flag|strtoupper}({$v.name})',
                  type: 'line',
                  data:  [
                  <volist name="v.data" id="vi">
                  [new Date("{$vi.dt}"),{$vi.num}],
                  </volist>
                  ]
              },
  </volist>
            ]
        };

其他信息 (Other comments)

All 2 comments

用回调函数方式,看文档。

tooltip:{
type : 'cross',
lineStyle: {
type : 'dashed',
width : 1
}
}
...
xAxis: {
type: 'time',

当配置为这种情况时, 回调函数无效,请问这种情况有解决方法吗?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

kirazxyun picture kirazxyun  ·  3Comments

Zendic picture Zendic  ·  3Comments

Thinkpad93 picture Thinkpad93  ·  3Comments

jarben picture jarben  ·  3Comments

decadef20 picture decadef20  ·  3Comments