JS绘图Flot应用图形绘制异常解决方案


Posted in Javascript onOctober 16, 2020

今天再次动手用Flot,但是今天用的时候出现一些问题

首次报错的是

网页错误详细信息
用户代理: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; QQDownload 721; InfoPath.2)
时间戳: Fri, 8 Jun 2012 04:59:50 UTC
消息: 'window.G_vmlCanvasManager' 为空或不是对象
行: 698
字符: 17
代码: 0
URI: http://localhost:8080/chart/jquery.flot.js

'window.G_vmlCanvasManager' 是什么东西我不知道,不过经过查询知道,报错是因为没有导入

<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]-->

之前说过,不同浏览器绘图使用的方式是不一样的,插件也只是根据不同浏览器使用不同绘图方式而已,就像Hibernate一样。

然后又报错

Could not draw pie with labels contained inside canvas

感觉写对了为什么不对呢,其实这是个让人纠结的问题,我看了Demo才知道,绘图的DIV需要引入一个样式,如果没有引入该样式,因为DVI大小不确定就没办法进行绘图!

所以你要增加一个样式

<style type="text/css"> 
* { 
 font-family: sans-serif; 
} 
 
body 
{ 
  padding: 0 1em 1em 1em; 
} 
 
div.graph 
{ 
  width: 400px; 
  height: 300px; 
  float: left; 
  border: 1px dashed gainsboro; 
} 
</style>

然后DIV的

<div id="graph1" class="graph"></div>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一起来写段JS drag拖动代码
Dec 09 Javascript
jQuery实现 注册时选择阅读条款 左右移动
Apr 11 Javascript
JS如何将UTC格式时间转本地格式
Sep 04 Javascript
玩转方法:call和apply
May 08 Javascript
JavaScrip常见的一些算法总结
Dec 28 Javascript
jquery实现自适应banner焦点图
Feb 16 Javascript
js, jQuery实现全选、反选功能
Mar 08 Javascript
浅谈对Angular中的生命周期钩子的理解
Jul 31 Javascript
微信小程序实现image组件图片自适应宽度比例显示的方法
Jan 16 Javascript
微信小程序button组件使用详解
Jan 31 Javascript
mpvue构建小程序的方法(步骤+地址)
May 22 Javascript
深入了解Vue动态组件和异步组件
Jan 26 Vue.js
swiper4实现移动端导航栏tab滑动切换
Oct 16 #Javascript
JS highcharts动态柱状图原理及实现
Oct 16 #Javascript
如何手动实现一个 JavaScript 模块执行器
Oct 16 #Javascript
JS highcharts实现动态曲线代码示例
Oct 16 #Javascript
Swiper实现导航栏滚动效果
Oct 16 #Javascript
node.js通过url读取文件
Oct 16 #Javascript
vue组件实现移动端九宫格转盘抽奖
Oct 16 #Javascript
You might like
thinkphp判断访客为手机端或PC端的方法
2014/11/24 PHP
Symfony实现行为和模板中取得request参数的方法
2016/03/17 PHP
ThinkPHP5框架中使用JWT的方法示例
2020/06/03 PHP
Kibo 用于处理键盘事件的Javascript工具库
2011/10/28 Javascript
用JQuery实现表格隔行变色和突出显示当前行的代码
2012/02/10 Javascript
用js写了一个类似php的print_r输出换行功能
2013/02/18 Javascript
浅析js中的浮点型运算问题
2014/01/06 Javascript
jquery 中的each()跳出循环的语句
2014/05/23 Javascript
javascript获取dom的下一个节点方法
2014/09/05 Javascript
javascript 面向对象封装与继承
2014/11/27 Javascript
jQuery fancybox在ie浏览器下无法显示关闭按钮的解决办法
2016/02/19 Javascript
JS对HTML表格进行增删改操作
2016/08/22 Javascript
js实现随机抽选效果、随机抽选红色球效果
2017/01/13 Javascript
微信小程序 图片边框解决方法
2017/01/16 Javascript
vue中使用refs定位dom出现undefined的解决方法
2017/12/21 Javascript
JS弹窗 JS弹出DIV并使整个页面背景变暗功能的实现代码
2018/04/21 Javascript
详解vue中组件参数
2018/07/09 Javascript
node crawler如何添加promise支持
2020/02/01 Javascript
Javascript数组及类数组相关原理详解
2020/10/29 Javascript
[05:09]第二届DOTA2亚洲邀请赛决赛日比赛集锦:iG 3:0 OG夺冠
2017/04/05 DOTA
Python 遍历子文件和所有子文件夹的代码实例
2016/12/21 Python
Python中关于Sequence切片的下标问题详解
2017/06/15 Python
使用Python的Dataframe取两列时间值相差一年的所有行方法
2018/07/10 Python
德国baby-markt婴儿用品瑞士网站:baby-markt.ch
2017/06/09 全球购物
英国家用电器折扣网站:Electrical Discount UK
2018/09/17 全球购物
西班牙三叶草药房:Farmacias Trébol
2019/05/03 全球购物
Linux中如何用命令创建目录
2015/01/12 面试题
上班早退检讨书
2014/01/09 职场文书
护士检查书
2014/01/17 职场文书
党组织公开承诺书
2014/03/29 职场文书
教师考核评语
2014/04/28 职场文书
保护地球的标语
2014/06/17 职场文书
被告答辩状范文
2015/05/22 职场文书
公司晚会主持词
2019/04/17 职场文书
Python排序算法之插入排序及其优化方案详解
2021/06/11 Python
什么是css原子化,有什么用?
2022/04/24 HTML / CSS