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 常用校验函数
Mar 26 Javascript
javascript定义函数的方法
Dec 06 Javascript
javascript 学习笔记(六)浏览器类型及版本信息检测代码
Apr 08 Javascript
Jquery时间验证和转换工具小例子
Jul 01 Javascript
微信小程序 倒计时组件实现代码
Oct 24 Javascript
动态加载css方法实现和深入解析
Jan 18 Javascript
解析jquery easyui tree异步加载子节点问题
Mar 08 Javascript
详解Angular2 之 结构型指令
Jun 21 Javascript
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 jQuery
解决Vue2.x父组件与子组件之间的双向绑定问题
Mar 06 Javascript
Weex开发之地图篇的具体使用
Oct 16 Javascript
JavaScript实现贪吃蛇游戏
Jun 16 Javascript
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
php数组函数序列之array_slice() - 在数组中根据条件取出一段值,并返回
2011/11/07 PHP
hadoop中一些常用的命令介绍
2013/06/19 PHP
PHP程序员常见的40个陋习,你中了几个?
2014/11/20 PHP
discuz目录文件资料汇总
2014/12/30 PHP
QQ邮箱的一个文本编辑器代码
2007/03/14 Javascript
JavaScript Event学习第十章 一些可替换的事件对
2010/02/10 Javascript
基于Jquery的表格隔行换色,移动换色,点击换色插件
2010/12/22 Javascript
jquery数组之存放checkbox全选值示例代码
2013/12/20 Javascript
BootStrap和jQuery相结合实现可编辑表格
2016/04/21 Javascript
浅析Javascript中bind()方法的使用与实现
2016/05/30 Javascript
Jquery为DIV添加click事件的简单实例
2016/06/02 Javascript
Javascript发送AJAX请求实例代码
2016/08/21 Javascript
炫酷的js手风琴效果
2016/10/13 Javascript
Bootstrap基本组件学习笔记之导航(10)
2016/12/07 Javascript
微信小程序本作用域下调用全局JS详解及实例
2017/02/22 Javascript
ES6下React组件的写法示例代码
2017/05/04 Javascript
js使用generator函数同步执行ajax任务
2017/09/05 Javascript
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
2018/04/13 Javascript
使用bootstrap实现下拉框搜索功能的实例讲解
2018/08/10 Javascript
使用webpack搭建pixi.js开发环境
2020/02/12 Javascript
jquery实现简单拖拽效果
2020/07/20 jQuery
wxPython定时器wx.Timer简单应用实例
2015/06/03 Python
Python数据结构之顺序表的实现代码示例
2017/11/15 Python
python 实现在一张图中绘制一个小的子图方法
2019/07/07 Python
通过PHP与Python代码对比的语法差异详解
2019/07/10 Python
pandas实现excel中的数据透视表和Vlookup函数功能代码
2020/02/14 Python
受希腊女神灵感的晚礼服、鸡尾酒礼服和婚纱:THEIA
2018/04/15 全球购物
幼儿园大班毕业教师寄语
2014/04/03 职场文书
法院先进个人事迹材料
2014/05/04 职场文书
党旗在我心中演讲稿
2014/09/15 职场文书
八一建军节慰问信
2015/02/14 职场文书
学校证明范文
2015/06/24 职场文书
呼兰河传读书笔记
2015/06/30 职场文书
Django使用redis配置缓存的方法
2021/06/01 Redis
Python包argparse模块常用方法
2021/06/04 Python
mysql序号rownum行号实现方式
2022/12/24 MySQL