首页 > echarts的tooltip样式问题

echarts的tooltip样式问题

echarts制作的折线图tooltip和整个图表一样大,远远超过提示信息的大小

<div id="main" style="width:500px;height:500px;"></div>

var datajson = {
  title: {
    text: "",
    subtext: "",
    x: "center"
  },
  tooltip: {
    trigger: "axis"
  },
  "legend": {
    x: "left",
    data: ["营收环比增长率"]
  },
  xAxis: [{
    type: "category",
    name: "",
    data: [2001, 2002,
      2003, 2004,
      2005, 2006,
      2007, 2008,
      2009, 2010,
      2011, 2012,
      2013, 2014
    ]
  }],
  yAxis: [{
    type: "value",
    name: " % "
  }],
  series: [{
    name: "营收环比增长率",
    type: "line",
    data: [-5.76, 6.52, 28.69, 41.57, 35.30, 32.86, 13.49, 20.52, -7.37, 42.24, 30.97, 11.19, 3.38, -1.89]
  }]
}

var chart = echarts.init(document.getElementById('main'));
chart.setOption(datajson);

经过测试以上代码在echart官网可以正常显示,单独创建例子也可以显示,但是放到项目中就会出现图中的bug,有可能是项目封装中有默认的属性,但是找不到,希望有熟悉echarts的大哥给点提示,歪瑞三克油!!!


默认的属性也不会有这么大,不过这个 tooltip 并不是 canvas 画出来的,而是一个 div。
检查元素看看是不是你的项目中的样式影响了它的大小。

【热门文章】
【热门文章】