当我将鼠标移到bar上时,tooltip就像上图一样满框。
解决:
因为要渲染图表,所以我们要给div容器设宽高,可是我之前将样式写在了css里(内部/外部都一样)。然后就出现了这样的错误。
我的碎碎念 :当时想着tooltip的宽高恰好和块的宽高是一样的,机智的认为他们必有关联,其他样式无误,那么CSS文件已经完成了它的渲染工作,所以我认为是因为CSS优先级的问题,默认的高优先级样式覆盖了我写的样式以至于出现错误,所以就改了样式写法,没想到成功了。
所以我就使用了行内样式<div id='bar' style="width=300px;height=200px;"></div>
tip:引入的js文件要放在body的底部,不然会因为由于页面结构未加载完至使无法找到相应节点来操作而报错。
上图完整例子(github)
上面的问题分析只是我的碎碎念,待我有空看看源码,再来补充。