Highcharts 不会调整选项卡内图表的大小

2023-12-30

我正在使用带有选项卡的 Twitter Bootstrap。我有多个选项卡和每个选项卡内的图表。调整浏览器大小后,不在当前活动选项卡上的图表不会调整大小。事实上,它看起来很有趣,有一个细条。当前活动选项卡工作正常。有谁见过这个问题并且有任何解决方法吗?


这是一个工作示例:

http://codepen.io/colinsteinmann/pen/BlGfE http://codepen.io/colinsteinmann/pen/BlGfE

基本上,当单击选项卡时,会在每个图表上调用 .reflow() 函数。这样,图表就会根据容器可见时应用的新尺寸重新绘制。

这是最重要的代码片段:

// fix dimensions of chart that was in a hidden element
jQuery(document).on( 'shown.bs.tab', 'a[data-toggle="tab"]', function (e) { // on tab selection event
    jQuery( ".contains-chart" ).each(function() { // target each element with the .contains-chart class
        var chart = jQuery(this).highcharts(); // target the chart itself
        chart.reflow() // reflow that chart
    });
})
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Highcharts 不会调整选项卡内图表的大小 的相关文章

  • 将 Unix 纪元时间戳转换为 JavaScript 日期时间戳

    我有一个带有 Unix 纪元时间戳的数据库 我想在 Highcharts 图表中绘制这些值 这需要 JavaScript 日期时间戳 自 1970 年 1 月 1 日以来的毫秒数 数据库数组当前如下所示 data 1519395624 10
  • 将 Highcharts 最大 Y 值设置为精确值而不进行四舍五入

    每次我在 Highcharts 中设置最小值和最大值时 我都不会得到具有我发送的精确最小值和最大值的图表 但总是有些接近的值 似乎 Highcharts 正在为轴选择一个间隔范围 如果我的最大值不符合正确的间隔 它就会被忽略或四舍五入 例如
  • Highcharts 有“趋势线”功能吗?

    基本上 我试图让 Highcharts 自动绘制从第一个数据点到最后一个数据点的直线 以便我可以更轻松地看到 总体趋势 我相信这被称为 趋势线 或其他东西 但我在文档中没有找到与之相关的任何内容 不过 它很可能仍然具有此功能 可以 据我所知
  • 禁用 HighCharts 上的悬停

    我使用 HighCharts 库构建了一个饼图 这是我的图表 http jsfiddle net t2MxW 20890 var chart new Highcharts Chart colors 0072BC BFDAFF DDDF00
  • 自定义 highcharts 工具提示以显示日期时间

    我正在开发一个项目 预计会显示此图 http jsfiddle net Kc23N http jsfiddle net Kc23N 当我单击一个点 工具提示 时 我想显示一个可以理解的日期 而不是以毫秒为单位的值 我认为需要更改这段代码 t
  • 重叠数据标签折线图高图

    How i can solve the problem of the values dataLabels below 我的 JSFiddle http jsfiddle net 3kVJS 3 http jsfiddle net 3kVJS
  • Highcharts 反转折线图在最小值处部分隐藏

    当使用具有最小值和最大值的反向折线图时 线条在最小值处部分隐藏 问题在于绘图画布恰好在最小值线处结束 当一条粗线只有一部分可见时 位于最小值线上方的部分将被隐藏 你可以看一个例子here http jsfiddle net DruGa 2
  • Highcharts:仅针对单个系列的工具提示

    我的系列中有 3 个数据集 低 正常 高 显示在散点图上 如何强制仅对普通数据集启用工具提示和标记 非常感谢 格式化程序 功能用于格式化工具提示文本的回调函数 返回 false 以禁用系列上特定点的工具提示 参考 http api high
  • Highcharts 工具提示裁剪

    我正在使用高图表 但遇到了较大的工具提示在 SVG 外部元素处被裁剪的问题 如下图所示 选项useHTML工具提示和 xAxis 设置为 true 因为我正在应用一些自定义 CSS 这些元素 有没有办法让工具提示不被裁剪 我的 highch
  • 加载 highchart 时 Android 错误膨胀类

    我正在尝试加载highcharts via Dialog 下面是我的代码 Gradle implementation com highsoft highcharts highcharts 9 0 1 XML
  • Highcharts - 使用选定的饼图切片获得 3D 效果

    在 highcharts 中 我试图使当用户选择或将鼠标悬停在饼图的切片上时 该切片会产生沿 z 轴 朝向用户 上升的效果 我试图通过 css 设置阴影过滤器并使切片的边框更宽 填充颜色相同 来实现此目的 然而 我面临的问题是切片仍然可以位
  • highcharts 可点击标签如何转到锚点

    我在 Backbone 应用程序中使用 Highcharts 在柱形图中显示一些信息 我使用图表中的数据标签来允许用户单击并移动到该数据点的详细信息页面 这不是正常的 window location 调用 而应该是 window locat
  • 单击 hPlot 图表中闪亮的数据点时打印组名称

    我有一个闪亮的应用程序 它使用 rCharts 中的 highcharts 库显示一些图表 在某些情况下 我在单个图表上有多个图表 这些图表是使用 hPlot 中的组选项创建的 我希望在单击图表时打印单个数据点的所有参数 x y 和组值 我
  • highchart堆积柱每个类别的总数据

    我想获取每个类别的总数据 这point stackTotal只给出活动数据的总数 从我粘贴的代码示例中 我想知道每种水果的总消耗量 因此 即使我单击右上角图例上的乔的名字 这使得堆叠图表上的所有乔信息都处于非活动状态 我仍然可以知道约翰 简
  • 如何纠正 Highcharts 中的鼠标事件

    我正在尝试绘制 xy 线 其中 y 轴反转 并且我得到了图 但是mouse event我无法纠正它 它显示反向事件 我想自动找到轴的最小值和混合 如何做到这一点 以及如何将 x 轴置于顶部 这是我的代码 JS function var ch
  • 高图表的分散工具提示未显示

    我有一个散点图和条形图 我无法查看酒吧上方散点的工具提示 这是小提琴http jsfiddle net tZ9Rt http jsfiddle net tZ9Rt 我正在使用这两个系列 series type scatter index 2
  • highcharts图表重绘方法不刷新图表

    我很好奇为什么按钮 2 不起作用example http jsfiddle net uKWQ9 1 在这个 jsfiddle 示例中 附加到按钮 1 的 更新 方法正在工作 但在我的原始代码中 更新 也不起作用 它显示错误 对象 没有方法
  • 使用 MVC3 根据 Highchart 条形图中的值更改条形颜色

    我正在使用 Dotnet Highchart 和 MVC3 我目前正在使用一个如下所示的图表 我正在尝试修改我的代码 以便我可以根据条形的数量更改条形的颜色 我还想知道如何删除按钮 Snittbetyg 正如您在图像上看到的那样 这是我的代
  • 如何在使用类型分散时将箭头添加到行尾

    如何在 y 不等于 0 且系列类型以线宽 2 分散的情况下正确地将箭头添加到行的每一端 在这里我可以看到箭头已添加但未正确添加 请看这个 部分工作小提琴 http jsfiddle net vnYCX 这是我的 JS 最初的原型是由 sta
  • Highcharts / Highmaps with Angular - 无法运行演示

    我正在发现 Highcharts Highmaps 现在 我想使用在我的机器上重现一些演示示例角6 但我无法让它发挥作用 官方的 JS 示例在这里 https www highcharts com maps demo map drilldo

随机推荐

  • 使用 ruby​​ on Rails 发送 HTTP 请求

    我是 ruby on Rails 的新手 并尝试测试我是否可以从我的控制器执行如下操作 curl v H Content Type application json X GET d bbrequest BBTest reqid 44 dat
  • android.util.Patterns.EMAIL_ADDRESS 正在验证无效电子邮件

    这些是一些无效的电子邮件 电子邮件受保护 cdn cgi l email protection 电子邮件受保护 cdn cgi l email protection 我在以下网站检查了上述电子邮件 所有这些邮件均返回无效 http isem
  • 修改(简化)主题标题以在 url 中显示

    我正在用 PHP 创建一个小型留言板 我需要 简化 主题标题以将其显示在主题的 url 中 例子 Ceci est un sujet d exemple变成ceci est un sujet d exemple J ai t la plag
  • 从 HTTP 切换到 HTTPS,失去了所有 Facebook“点赞”计数

    我从http to https两个月前 现在我失去了所有的 喜欢 即使当我使用脸书调试工具 https developers facebook com tools debug 现在它之间的计数相同http and https 有人知道这是否
  • 在类中声明动态 2D 矢量

    我们尝试使用 2D 向量 因为我们想要一个能够动态增长的 2D 数组 我们尝试过这个 在类声明中 vector
  • 使用经典 asp 收集数组中的第一个元素

    我有一个经典 asp 中的二维数组 我的目标是找到该数组中的第一个元素并将其保存在变量中 之后剩余的元素 第一个元素除外 保存在同一个数组中 例子 如果 aryReturn 是一个类似数组 aryReturn 0 0 1001 aryRet
  • Android SDK 管理器中的 MIPS 系统映像是什么?

    对于每个 SDK 我都有一个安装解决方案MIPS system image 它是什么 它有什么作用以及何时有人使用它 如果我不安装它会发生什么 它是什么 它是一个模拟器映像 可模拟具有 MIPS CPU 而不是 ARM 或 x86 CPU
  • 在 PyPy 上运行 Scrapy

    是否可以运行Scrapy on PyPy 我浏览了文档和 github 项目 但唯一的地方PyPy提到的是有一些单元测试正在执行PyPy2年前 参见PyPy support https github com scrapy scrapy pu
  • 布尔值在 Hibernate 和 MySQL 中无法正确映射

    我正在尝试将存在查询的结果 返回 TRUE FALSE 从 MySQL 数据库映射到 POJO 通过结果集转换器 我希望这个存在查询的结果可以映射到布尔值 但它没有并抛出以下错误 org hibernate PropertyAccessEx
  • Android中的ActivityThread异常?

    我正在执行搜索存储在数据库中的位置的任务 之后我必须在相应的位置上放置一个图钉 我对快速搜索框 QSB 进行了修改以搜索我的应用程序中的数据库 为了获得 QSB 性能 我遵循 API 演示中的搜索词典示例 当我单击搜索建议时 它会重新加载当
  • android:使用多个place_id调用Google API .getPlaceById

    为了减少 API 调用次数 我尝试通过一次传递多个 place id 最多 10 个 来查询地点详细信息 除了文档之外 我没有找到任何有用的信息 https developers google com android reference c
  • 需要在 Ruby 中将数组拆分为指定大小的子数组[重复]

    这个问题在这里已经有答案了 我有一个类似这样的数组 arr 4 5 6 7 8 4 45 11 我想要一个像这样的奇特方法 sub arrays split arr 3 这应该返回以下内容 4 5 6 7 8 4 45 11 注意 这个问题
  • 通过url获取json数据并在python中使用(simplejson)

    我想这一定有一个简单的答案 但我很挣扎 我想获取一个 url 输出 json 并在 python 中的可用字典中获取数据 我被困在最后一步了 gt gt gt import urllib2 gt gt gt import simplejso
  • 将 ES6 类对象序列化为 JSON

    class MyClass constructor this foo 3 var myClass new MyClass 我想序列化myClass对象转为 json 我能想到的一种简单方法是 因为每个成员实际上都是 javascript 对
  • 检查整型变量中是否设置了标志

    我正在制作自己的简单绘图引擎 我试图使用我认为所谓的按位比较来确定变量是否已设置为特定值 但我可能错了 我一直对以下内容以及如何使用它感到有点困惑 int DRAW REPEAT X 70001 I have a feeling I sho
  • 将毫秒格式设置为 simpledateformat

    将毫秒格式化为 SimpleDate 格式时 我遇到一个奇怪的结果 输出是 Start date time 11 06 30 09 45 48 970 End date time 11 06 30 09 45 52 831 Executio
  • 使用xquery从xml中提取数据的最佳方法

    考虑以下 xml
  • ValueError:序数必须 >= 1

    这段代码 从谷歌金融获取直线的 2 个坐标 并将第三个点放置在同一条线上一定距离处 import datetime as dt from datetime import timedelta as td import matplotlib p
  • 从 URL 加载图像并将其显示在 iPhone 应用程序中的更快方法

    我使用以下代码在 ImageView 中显示图像 imgbackBG image UIImage imageWithData NSData dataWithContentsOfURL NSURL URLWithString NSString
  • Highcharts 不会调整选项卡内图表的大小

    我正在使用带有选项卡的 Twitter Bootstrap 我有多个选项卡和每个选项卡内的图表 调整浏览器大小后 不在当前活动选项卡上的图表不会调整大小 事实上 它看起来很有趣 有一个细条 当前活动选项卡工作正常 有谁见过这个问题并且有任何