Highcharts兼容性 包括移动终端以及IE6
我的图书馆
Highcharts兼容性 包括移动终端以及IE6
Highcharts兼容性
兼容所有现代浏览器，适配主流js框架
Highcharts完全基于本地浏览器技术，不需要任何插件，甚至不需要安装任何服务器环境，只需要两个js文件即可运行。Highcharts针对不同的js框架jQuery、Mootools、Prototype做了适配工作，不同框架开发人员不需要再额外学习其他框架即可上手。
highcharts可以运行在任何现代浏览器，包括移动终端以及IE6，标准的浏览器用SVG技术渲染图表，对于遗留的浏览器，则用VML来绘图。
浏览器兼容性测试
浏览器厂商
Internet Explorer
iOS(Safari)
Android Borwser
说明：对android浏览器部分支持，点击。
Javascript框架支持
目前已经测试过的框架及版本如下
其他版本都能正常使用只是没有测试。
图表渲染引擎及性能
不同的浏览器支持不同的渲染技术，现在大多数浏览器支持 SVG，只有较老的版本的IE不支持，这些较老的浏览器用VML绘制图表，针对不同浏览器图表绘制性能测试结果如下
浏览器及版本
使用的渲染技术
Internet Explorer 9
Internet Explorer 8
Internet Explorer 7
Internet Explorer 6
iOS Safari
Android 3+
Android 2.x
Android 2.x
Android 2.x 没有提供 SVG 支持，针对Android 2.x，Highcharts 开发出基于canvg的独立渲染器，但是其有如下限制：
数据提示框（tooltip）总是显示
图表在第一次渲染时，会从 code.highcharts.com下载 canvg 渲染器 + rgbcolor.js + canvg.js （包含在同一个文件里），这个地址可以通过
属性指定。
图表和数据列（series）动画效果无效（无动画效果）
点击图例（legend）无法显示或隐藏数据列（series）
数据列（series）和数据点（point）的触摸事件无效
图表缩放（zoom）无效
使用渲染API直接添加图形到图表上无效
相关信息：
发表于： ，
最后更新： 09:00:07，贡献者：Mr.Zhang、布躲躲
本文固定链接：
本文由中文网管理团队编写并发布，Highcharts中文网保留所有权利，除非得到允许，不得以任何形式转载！
留言区：（提问、讨论、建议、纠错等）
吃葡萄不吐葡萄皮“不同的浏览器支持不懂的渲染技术”
这里有个笔误，应该是“不同的渲染技术”吧。2月12日你看的好仔细！2月13日吃葡萄不吐葡萄皮呃，也不是仔细了，一下就注意到了。可惜的是教程还在编写过程中，看来还得自己摸索啊。2月13日是啊！2月19日你好，你反馈的文字错误已经修改，感谢你的支持2月20日请问Highcharts支持平板上的拖动吗？，谢谢6月3日使用Highchart制作的折线图，导出功能其他浏览器都能正常使用，在IE浏览器下使用导出功能，导出的是一个index.html文件!这是怎么回事啊！我的IE的版本是11的！3月8日好强大。3月18日第十九层空间为啥手机不能登录这个页面？？？3月18日感谢你的反馈。根据你的反馈我排查了下，是服务器配置问题，现在已经修复。3月20日黑手恩很不错，讲的通俗易懂，非常感谢。4月4日使用Highchart制作的折线图，导出功能其他浏览器都能正常使用，在IE浏览器下使用导出功能，导出的是一个index.html文件!这是怎么回事啊4月30日我做出来的用 其他流浪器都可以正常显示 ie无法显示 会报 hightchart.js有错6月9日Herschel拼写错误
Highcahrts可以运行在任何现代浏览器
Highcharts6月27日已改，谢谢6月30日hyzhang在ie下 7-10版本，样式均出现问题，鼠标移到图表上，第一次显示正常，移到另一块，字体换行就不一样了。下载时出现SCRIPT5007: 无法获取未定义或 null 引用的属性“length” ，火狐下显示正常，求指导6月30日小虎牛逼 ...9月19日Highcharts趋势图用ie浏览器都能显示，用google浏览器为什么不显示9月27日JQuery 1.3.2 下错误 Uncaught TypeError: Cannot read property 'opacity' of undefined11月14日zhjfitHighcharts 是否可以再手机浏览器中打开？为什么我在电脑上打开可以 在手机上打开确什么都没有？11月14日为什么同样是IE8，有的显示出来了，有的没有显示出来？11月21日阿麟在qq浏览器4.1版本上不显示？11月21日社交帐号登录:
[转]&[转]&[转]&[转]&[转]&[转]&
喜欢该文的人也喜欢怎样设置Tooltip自动隐藏呢
<a data-traceid="question_detail_above_text_l&&
自己画了几个图标，在Tooltip中需要显示中文，发现默认字体太小。然后手动进行设置，设置如下Tooltip tip = new Tooltip() &.setShadow(false) &.setColour(&&) &.setBackgroundColour(&&) &.setTitleStyle(&{font-size: 14}&) &.setBodyStyle( &&&&{font-size: 14}&); //统一设置全图的Tooltip样式
chart.setTooltip(tip);
修改后：字体大小是可以了 可是鼠标移走之后tip没有消失。
然后发现还有一个方法 tip.setHover(); 设置后鼠标移走tip外面的框消失了，文字还在。
有人知道怎么解决吗？或者还有没有其他改变tip字体大小的方式基础教程数据处理图表类型高级特性图表导出模块图表设计及样式插件扩展地图HighstockHighcharts.NET数据提示框指的当鼠标悬停在某点上时，以框的形式提示该点的数据，比如该点的值、数据单位等。数据提示框内提示的信息完全可以通过格式化函数动态指定；通过设置 tooltip.enabled = false 即可不启用提示框。一、提示框外观下面的实例代码给出了关于数据提示框的外观的常用配置tooltip: {
backgroundColor: '#FCFFC5',
// 背景颜色
borderColor: 'black',
// 边框颜色
borderRadius: 10,
// 边框圆角
borderWidth: 3,
// 边框宽度
shadow: true,
// 是否显示阴影
animation: true
// 是否启用动画效果
// 文字内容相关样式
color: "#ff0000",
fontSize: "12px",
fontWeight: "blod",
fontFamily: "Courir new"
提示：背景颜色也可以设置为渐变色二、提示框内容数据提示框的目的是为了展示数据点相关的数据，具体展示的内容完全可以通过多种灵活的方式来实现。1、格式化函数formatter数据提示框格式化函数，功能最强大也是最灵活的方法，函数里 this 关键字代表着当前数据点对象，常用的变量有：this.x ： 当前点 X 值this.y / this.point[i].y ： 当前点的 Y 指 / 当前第 i 个点的 Y 值 （tooltip 共享的情况下，关于共享见下方说明）this.point / this.point[i] ： 当前点 / 当前第 i 个点（tooltip 共享的情况下）this.series / this.point[i].series ： 当前数据列 / 当前第 i 个点的数据列（tooltip共享）this.totalthis.percentage所有的可用属性可以通过 console.log(this) 来查看小技巧：通过 console.log() 可以很清楚的看到对象中的所有属性及值，这在调试的时候非常好用。pointFormatter数据提示框中单个点的格式化函数。默认是：pointFormatter: function() {
return '&span style="color: '+ this.series.color + '"&\u25CF&/span& '+
this.series.name+': &b&'+ this.y +'&/b&&br/&.'
2、格式化字符串格式化字符串是格式化函数的简化版，是一种利用特殊符号加变量字符的形式来代替函数的表达式。headerFormat数据提示框头部格式化字符，默认是：&span style="font-size: 10px"&{point.key}&/span&&br/&
pointFormat单个点的格式化字符串，实现的内容同 pointFormatter，默认实现是：&span style="color:{series.color}"&\u25CF&/span& {series.name}: &b&{point.y}&/b&&br/&.
对比下 pointFormatter 和 pointFormat 我们可以知道两两种方式的差别：pointFormat 更简单，适用于简单的内容格式化pointFormatter 更灵活，适用于相对复杂的自定义内容上述两个观点也就是格式化函数和格式化字符串的优缺点，在使用的时候，请灵活运用。3、时间格式化在时间图表中，很常见的一个需求是时间的格式化显示，在数据提示框中，我们可以通过时间格式化来统一时间的显示。dateTimeLabelFormats数据框中的时间点的格式化，默认实现是：{
millisecond:"%A, %b %e, %H:%M:%S.%L",
second:"%A, %b %e, %H:%M:%S",
minute:"%A, %b %e, %H:%M",
hour:"%A, %b %e, %H:%M",
day:"%A, %b %e, %Y",
week:"Week from %A, %b %e, %Y",
month:"%B %Y",
xDateFormat数据提示框头部时间格式化字符串。4、html 内容数据提示框默认（在没开启支持 HTML 模式的情况下）支持少量的 HTML 标签，包括 &b&、&i&、&br& 、&strong&、&em&、&span&，标签的内容可以通过 style 属性来指定，不过仅限文字相关的 CSS 样式属性。通过设置 tooltip.useHTML = true 可以开启 HTML 模式，即可以用纯 HTML 内容来渲染数据提示框（默认是以 SVG 渲染）。开启 HTML 模式后，就可以给提示框添加 链接、图片、表格等 HTML 元素，给提示框添加表格的示例代码是：tooltip: {
shared: true,
useHTML: true,
headerFormat: '&small&{point.key}&/small&&table&',
pointFormat: '&tr&&td style="color: {series.color}"&{series.name}: &/td&' +
'&td style="text-align: right"&&b&{point.y} EUR&/b&&/td&&/tr&',
footerFormat: '&/table&',
valueDecimals: 2
5、值的前缀、后缀及小数点在展现数据信息时，我们经常会给数据添加一些修饰信息，例如数据单位。highcharts 提供了 valuePrefix、valueSuffix 来给数据添加前缀及后缀。tooltip: {
valuePrefix: '￥',
valueSuffix: '元'
另外，对于小数点的处理，可以通过 valueDecimals 来指定保留小数位数（当然可以通过格式化函数来进行更复杂的处理）。对于多个数据列数据提示框添加后缀时，一般是将属性分别配置在数据列中，实例：series: [{
name: 'Rainfall',
type: 'column',
data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
tooltip: {
valueSuffix: ' mm'
name: 'Temperature',
type: 'spline',
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
tooltip: {
valueSuffix: '°C'
6、共享的提示框（Shared）多个数据列的图表中，常常需要对多个数据列的数据做对比，将多个数据列的相同分类同时展示在数据提示框中也是非常常见的需求，Highchart 中， tooltip.shared 的作用就是将多个数据分享到同一个数据提示框中，也就是多个数据共用的数据提示框。三、其他特性1、十字准星注：在 Highcharts 5.0.0 后十字准星线相关的配置移至坐标轴下面了，使用方法同之前的配置，为了兼容之前版本，我们继续保留提示框下的十字准星配置，更多详情参考 crosshairs 有三种配置形式，最基础的是设置 crosshairs = true 表示启用竖直方向准星线，三种设置方式是：crosshairs: true
// 启用竖直方向准星线
crosshairs: [true, true]
// 同时启用竖直及水平准星线
crosshairs: [{
// 设置准星线样式
color: 'green'
color: "#006cee",
dashStyle: 'longdashdot',
zIndex: 100
2、固定位置显示提示框通过配置 tooltip.positioner 可以让数据提示框以固定位置显示，实例如下positioner: function() {
其中 x 表示相对图表右上角水平偏移，y 为竖直方向的偏移。3、鼠标行为：设置提示框触发模式，默认是鼠标在点的附近就触发提示框，设置 false 后只有鼠标划过点才触发hideDelay：提示框隐藏延迟时间四、常见问题1、提示框乱码了怎么办？通过上面的学习我们知道，数据点的默认格式化内容是：&span style="color:{series.color}"&\u25CF&/span& {series.name}: &b&{point.y}&/b&&br/&.
其中的 \u25CF 是一个 Unicode 码，也是导致乱码的根源，最简单的解决办法有两种：1）将你的页面编码设置 UTF-8&!DOCTYPE html&
&html lang="en"&
&meta charset="UTF-8"&
// 设置网页编码
// ... 省略代码
2）重写提示框数据点格式化函数或格式化字符串，例如将 pointFormat 重写为：&span style="color:{series.color}"&&/span& {series.name}: &b&{point.y}&/b&&br/&.
2、如何在外部触发提示框？见：即调用 chart.tooltip.refresh() 函数实现3、提示框内容被遮挡了？问题重现当设置了文字标签以 HTML 的形式渲染（即设置 useHTML = true ）后，该标签会覆盖提示框里的文字，详细可参看
及 问题产生的原因HTML 渲染是独立于整个图表的 svg 标签外的，其层叠值（zIndex）大于图表（及图表里的元素，包括提示框）的层叠值，所以就会导致提示框内容被覆盖。解决办法将提示框的渲染模式也设置为 HTML模式，并将其层叠值调整到比覆盖的内容大，具体的解决方案参考 赏&&目录订阅更新
在线客服选择服务类型当前位置：
highcharts 数据提示框tooltip内容过多 超出图的范围被截断
猜你喜欢的文章
highcharts 数据提示框tooltip内容过多 超出图的范围被截断
来源：网络整理&&&&&时间: 16:40:00&&&&&关键词:
关于网友提出的“ highcharts 数据提示框tooltip内容过多 超出图的范围被截断
”问题疑问，本网通过在网上对“ highcharts 数据提示框tooltip内容过多 超出图的范围被截断
”有关的相关答案进行了整理，供用户进行参考，详细问题解答如下：
问题： highcharts 数据提示框tooltip内容过多 超出图的范围被截断
highcharts&数据提示框(tooltip)内容过多&超出图的范围被截断&，有哪位大神知道，如图：
以上介绍了“ highcharts 数据提示框tooltip内容过多 超出图的范围被截断”的问题解答，希望对有需要的网友有所帮助。
本文网址链接：http://www.codes51.com/itwd/4359407.html
上一篇： 下一篇：highcharts 数据提示框(tooltip)内容过多 超出图的范围被截断_百度知道
highcharts 数据提示框(tooltip)内容过多 超出图的范围被截断
下图中的数据提示框的内容还没有显示完全，海南下面实际上还有数据，但是受限于图表的区域，没有显示完全。这种情况，如何让它的数据显示全？
以下是我tooltip的设置：
tooltip: {
headerFormat: &#039;&span style=&font-size:10px&&{point....
我有更好的答案
你非要一列啊，可以多列啊
为您推荐：
&#xe675;换一换
回答问题，赢新手礼包&#xe6b9;
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。