`

HighCharts 的悬停框与chrome的冲突

阅读更多
浏览器版本:chrome 16.0.912.15
HighCharts版本:Highstock JS v1.1.2

在tomcat中调试程序时发现鼠标滑过chart的时候,跟随鼠标的悬停框(小提示框)不见了。但是浏览其它静态画面时,悬停框的显示还是正常的。
打开chrome的审查元素,看到下面的一行错误提示:
Uncaught TypeError: Cannot read property 'plotX' of undefined
并且当鼠标再次滑过chart是,错误的提示数字在不停增加。

折腾了半边,无意中发现这个现象与chrome的缩放有关,调整回100%,现象消失。
注:在IE8.0的缩放功能中不存在这个问题。

原因:chrome和IE对JS的解释稍有不同。
开发周期紧张,所以没详细调查。 大家有知道的还请多多指教哈。
0
1
分享到:
评论

相关推荐

    Highcharts框架js包

    - **易于集成**:Highcharts是基于JavaScript的,可以方便地与jQuery、AngularJS、React等前端框架结合使用。 - **图表导出**:内置导出功能,允许用户将图表保存为PNG、JPEG、PDF或SVG格式。 通过深入研究和应用这...

    Highcharts多个图表共用一个提示框,每个图表多条曲线

    首先,我们要理解Highcharts的提示框(tooltip)是用于显示鼠标悬停在数据点上时的相关信息。默认情况下,每个图表都有自己的独立提示框。要实现多个图表共用一个提示框,我们需要自定义提示框的行为,并利用事件...

    highCharts提示框中显示当前时间的方法

    在JavaScript图表库HighCharts中,有时我们需要在提示框(tooltip)中显示实时更新的时间信息,以便用户能够看到数据与当前时间的关联。本篇文章主要介绍了如何在HighCharts提示框中实现这一功能。 首先,我们要理解...

    highcharts

    5. **交互性**:Highcharts的图表支持鼠标悬停、点击等交互事件,可以触发自定义函数,实现图表的进一步操作,如弹出详细信息框、高亮数据点等。 6. **图表类型**:Highcharts支持多种图表类型,包括但不限于: - ...

    jquery Highcharts jquery Highcharts

    Highcharts是一款强大的JavaScript图表库,它能够为网页和应用程序提供丰富多样的数据可视化效果。基于jQuery库,Highcharts使得在Web页面上创建交互式图表变得简单易行。在这个压缩包中,很可能包含了Highcharts的...

    highcharts官方文档

    Highcharts的浏览器兼容性范围包括多个品牌和版本:Internet Explorer 6.0+、Firefox 2.0+、Chrome 1.0+、Safari 4.0+以及iOS的Safari 3.0+和Android Browser 2.0+。需要注意的是,Android Browser 2.x版本的支持有...

    highcharts示例代码(官方例子)

    4. **交互性**:用户可以通过点击、悬停等操作与图表进行互动,例如高亮数据点、显示数据提示框等。这增强了用户体验,使得数据更加直观易理解。 5. **自定义选项**:Highcharts提供了大量的配置选项,可以调整图表...

    使用Highcharts结合PHP与Mysql生成饼状图

    使用Highcharts结合PHP与Mysql生成饼状图 为了更好的讲解,实例中在Mysql数据库中建立一张表chart_pie,用于表示各搜索引擎带来的访问量,表中分别有id、title和pv三个字段,id是自增长整型、主键;title表示搜素...

    Learning Highcharts

    - **交互性**:支持鼠标悬停事件、点击事件等,提供数据提示、缩放和平移功能,增强用户与数据的互动体验。 - **跨平台兼容性**:Highcharts在各种浏览器和设备上表现一致,无需额外的插件支持,确保了广泛的用户...

    Highcharts与ExtJs结合使用

    本文将深入探讨如何将Highcharts与ExtJS结合使用,以实现更高效、更美观的数据呈现。 首先,Highcharts是一个强大的JavaScript图表库,它支持各种类型的图表,包括折线图、柱状图、饼图、散点图等。Highcharts以其...

    highcharts-zh_CN.js 文件下载

    8. **兼容性**:Highcharts通常与各种现代浏览器兼容,包括Chrome、Firefox、Safari、Edge和Internet Explorer(从版本9开始)。中文语言包也应保持这种兼容性。 9. **性能优化**:在大型数据集或者实时更新的数据...

    Highcharts-Gantt-7.2.1_highcharts_highchartsgantt_

    4. **资源管理**:Highcharts Gantt可以展示每个任务与特定资源的关联,例如分配给任务的人员或设备。这有助于跟踪资源的使用情况和利用率。 5. **交互性**:图表具有高度的交互性,用户可以通过点击、悬停和拖拽来...

    Highcharts-9.3.2.zip

    在实际应用中,Highcharts不仅可以用于数据可视化,还可以实现交互效果,如数据点的悬浮提示、图表缩放、拖动等,增强了用户与数据之间的互动性。 解压"Highcharts-9.3.2"文件后,通常会包含JavaScript文件、CSS...

    Highcharts-2.2.5源码

    标签“Highcharts”表明这个压缩包的内容主要与Highcharts相关。Highcharts的特点包括: 1. **易用性**:API简洁,易于理解和使用。 2. **响应式设计**:图表会根据屏幕大小自动调整,适应移动设备。 3. **丰富的...

    Highcharts-3.0.2.rar

    8. **易于集成**:由于其轻量级的特性,Highcharts可以轻松地与现有的Web应用框架(如AngularJS、React、Vue.js等)集成。 9. **开源许可证**:Highcharts提供了商业和开源两种许可证,为开发者提供了灵活的选择。 ...

    Highcharts

    Highcharts是一款广泛应用于Web开发中的JavaScript图表库,它允许开发者轻松地在网页上创建交互式、数据丰富的图表。Highcharts以其灵活性、易用性和丰富的功能而受到赞誉,适合各种业务需求,包括折线图、柱状图、...

    highcharts struts demo

    5. **Struts2与视图的整合**:Struts2可以与多种视图技术结合,如JSP、FreeMarker、Velocity等,本示例中可能使用JSP来展示Highcharts图表。 **项目实施步骤** 1. **集成Highcharts库**:将Highcharts的JavaScript...

    highcharts 与ajax的应用

    在Highcharts与Ajax的结合应用中,Ajax通常用于后台数据的异步获取,然后将这些数据传递给Highcharts,以动态展示图表。 首先,我们需要理解Ajax的工作原理。Ajax的核心是XMLHttpRequest对象,它允许JavaScript在...

Global site tag (gtag.js) - Google Analytics