Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/mercurial/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Echarts 设置触发器=项的工具提示中的轴值格式_Echarts - Fatal编程技术网

Echarts 设置触发器=项的工具提示中的轴值格式

Echarts 设置触发器=项的工具提示中的轴值格式,echarts,Echarts,我有一个折线图,在x轴上绘制月份,在y轴上绘制每个月的值。 看起来像这样 我的选项配置是 option = { title: { text: 'Title', }, tooltip: { trigger: 'item', axisPointer: { label: { formatter: 'format1', }, }, }, legend: {}, xAxis: { axisPointe

我有一个折线图,在x轴上绘制月份,在y轴上绘制每个月的值。 看起来像这样

我的选项配置是

option = {
  title: {
    text: 'Title',
  },
  tooltip: {
    trigger: 'item',
    axisPointer: {
      label: {
        formatter: 'format1',
      },
    },
  },
  legend: {},
  xAxis: {
    axisPointer: {
      label: {
        formatter: 'format2',
      },
    },
    axisLabel: {
      formatter: 'format3',
    },
    type: 'category',
    splitLine: {
      show: true,
    },
    axisLine: {
      show: true,
    },
  },
  yAxis: [
    {
      position: 'right',
      type: 'value',
      splitLine: {
        show: true,
      },
      axisLine: {
        show: true,
      },
    },
  ],
  dataset: {
    source: [
      {
        month: 1420070400000,
        value1: 5,
        value2: 0,
        value3: 3,
        value4: 4,
      },
      {
        month: 1422748800000,
        value1: 10,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1425168000000,
        value1: 11,
        value2: 0,
        value3: 3,
        value4: 4,
      },
      {
        month: 1427846400000,
        value1: 15,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1430438400000,
        value1: 20,
        value2: 0,
        value3: 3,
        value4: 4,
      },
      {
        month: 1433116800000,
        value1: 5,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1435708800000,
        value1: 10,
        value2: 0,
        value3: 3,
        value4: 4,
      },
      {
        month: 1438387200000,
        value1: 15,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1441065600000,
        value1: 20,
        value2: 0,
        value3: 3,
        value4: 4,
      },
      {
        month: 1443657600000,
        value1: 0,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1446336000000,
        value1: 10,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1448928000000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1451606400000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1454284800000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1456790400000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1459468800000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1462060800000,
        value1: 12,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1464739200000,
        value1: 22,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1467331200000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1470009600000,
        value1: 12,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1472688000000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1475280000000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1477958400000,
        value1: 22,
        value2: 1,
        value3: 3,
        value4: 4,
      },
      {
        month: 1480550400000,
        value1: 2,
        value2: 1,
        value3: 3,
        value4: 4,
      },
    ],
    dimensions: ['month', 'value1', 'value2', 'value3', 'value4'],
  },
  series: [
    {
      type: 'line',
      tooltip: {
        formatter: 'format4',
      },
    },
    {
      type: 'line',
      tooltip: {
        formatter: 'format4',
      },
    },
    {
      type: 'line',
      tooltip: {
        formatter: 'format4',
      },
    },
    {
      type: 'line',
      tooltip: {
        formatter: 'format4',
      },
    },
  ],
};
我正在使用
trigger:'item'
作为工具提示,我的工具提示与屏幕截图中的工具提示类似。 我需要将工具提示中的月份值格式化为
MMM-YYYY
格式,我将使用以下格式化程序函数

function formatter(params) {
  console.log(params);
  return dayjs(params.value.month).format('MMM, YYYY');
}
如果我在
系列[index].tooltip.formatter
中指定格式化程序,它将用格式化程序返回的值替换整个工具提示,而不仅仅是月份值

如何在工具提示中格式化月份值,使工具提示的其他内容保持默认状态


实时演示链接:

Echart允许您修改工具提示中的所有字段,而不仅仅是一个字段。因此,您需要在使用工具提示格式化程序时生成所有剩余字段。所有必需的详细信息将显示在参数中。您可以使用下面的格式化程序

function formatter(params) {
   console.log(params);
   return `${params.seriesName}<br>${params.marker} ${dayjs(params.value.month).format('MMM, YYYY')`enter code here`}: ${params.value[params.seriesName]}`;
}
函数格式化程序(params){
控制台日志(params);
返回`${params.seriesName}
${params.marker}${dayjs(params.value.month.format('MMM,yyyyy')`在此处输入代码`:${params.value[params.seriesName]}; }