调整
容器大小时的图表渲染问题

2024-02-18

I have two调整容器大小时图表渲染的问题。

First问题是,当容器大小调整时如何正确渲染图表。

i.e. Maximize / Restore problem, at its first rendering it works just fine, however when I restore the size of the window, the charts begin to overlay as its previous size. As you can see from the following pics: enter image description hereenter image description here

我知道如果您设置一个调整大小处理程序(并等待少量时间)以在调整窗口大小时刷新图表,则可以解决问题。我在想是否还有其他一些方法可以让图表流动到正确的大小,而无需每次都刷新图表。

The second事情是: 如果图表区域位于<div>容器,容器的大小将随着调整大小栏而改变。我使用以下代码来使其与窗口大小调整一起工作。但它won't使用移动的调整大小栏。

$(window).resize(function () {
        setTimeout(function () {
            createChart(chartData);
        }, 300);
    });

Note:网格组件在任何情况下都工作得很好,只是图表我总是遇到麻烦。 我正在使用 HighCharts、kendoUI 网格,它们都在 jQueryUI portlet 中呈现。

任何意见表示赞赏!这个问题花了我很长时间..

Update:由于我认为我对这个问题的解释不够清楚,我补充道JSFiddle 示例 http://jsfiddle.net/jxTUw/为了更好的理解。基本上我想要两件事:1.当窗口大小调整时,重新调整图表的大小以适合其容器; 2. 当调整大小栏移动时,重排图表的大小以适合其容器。

我正在使用插件高图表 http://www.highcharts.com/用于绘制图表,jQuery UI 布局 http://layout.jquery-dev.net/用于本例中的布局管理。对于我正在使用的其他一些插件,请参考here https://stackoverflow.com/questions/11378324/is-it-recommended-to-use-a-lot-of-jquery-plugins-in-your-project,我不确定他们是否有冲突。

Thanks!


我不相信如果不挂钩调整大小事件并重新绘制图表就可以完成您想要的事情。

要解决您的“div”调整大小问题,请查看类似的内容this http://benalman.com/projects/jquery-resize-plugin/它允许您将调整大小事件绑定到窗口以外的其他事物(根据您的情况,您的“容器”div)。

这是一个fiddle http://jsfiddle.net/jxTUw/4/它在行动中。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

调整
容器大小时的图表渲染问题 的相关文章

  • 将 GMT 时间转换为当地时间

    我以这种格式从我的服务器获取 GMT 时间 Fri 18 Oct 2013 11 38 23 GMT 我的要求是使用Javascript将此时间转换为本地时间 例如 如果用户来自印度 首先我需要采用时区 5 30并将其添加到我的服务器时间并
  • 为什么 IE8 在我的图像锚标记上添加底部边框?

    我知道 这很可悲 但今天早上 IT 刚刚在我的机器上安装了 IE8 我立刻遇到了一个明显的问题 尽管我知道答案就在我面前 但我已经把它搞砸了太久了 首先 这是网站 www mchenry edu http www mchenry edu 在
  • Jquery 数据表列总和

    我只是参考一下这个链接 https datatables net examples advanced init footer callback html了解如何获取 jquery 数据表中的列总计 但我已经完成了一半的项目 我在html页面
  • 使用 CSS 使一行 div 高度相同

    我有一排必须具有相同高度的 div 但我无法提前知道该高度可能是多少 内容来自外部源 我最初尝试将 div 放置在封闭的 div 中并将它们向左浮动 然后我将它们的高度设置为 100 但这没有明显的效果 通过将封闭 div 的高度设置为固定
  • Javascript split 不是一个函数

    嘿朋友们 我正在使用 javascript sdk 通过 jQuery facebook 多朋友选择器在用户朋友墙上发布信息 但是我收到此错误friendId split 不是函数 这是我的代码 function recommendToFr
  • 刷新页面时保存用户的选择

    我目前有一个页面显示不同团队的数据 我有一些数据 用户可以单击使其处于 打开 或 关闭 状态 并为每个数据显示不同的图标 它基本上就像一个清单 只是没有物理复选框 我想记住哪些 复选框 已被选中 即使在用户刷新页面或关闭浏览器并稍后返回之后
  • DataTables row.add 到特定索引

    我正在替换这样的行项目 var targetRow entity row dataTable targetRow closest table dataTable DataTable dataTable row targetRow remov
  • 页面上使用 HTML Editor Extender 进行回发会导致 IE11 中出现 JavaScript 错误

    我已将 HTML 编辑器扩展程序添加到我正在处理的页面中 现在每当我在页面上发回帖子时 都会收到以下 Javascript 错误 JavaScript 运行时错误 参数无效 之后什么也没有发生 这在 IE10 或更低版本以及我所知道的所有其
  • 可以设置标题样式吗? (并且使用CSS或js?)[重复]

    这个问题在这里已经有答案了 我想知道是否可以设计一个title a href title This is a title Hello a 样式问题有两个方面 文本格式 编码 我猜这是可能的 所以在问题中这样做 工具提示样式 你能把它弄大一点
  • 从数据库检查数据的异步解决方案各种循环子句

    我想要做的是异步检查数据库并从中获取结果 在我的应用程序中我试图实现Asynchronously将此步骤解决为 从数据库中检查手机号码JsonArray循环子句的种类 Create JsonArray从结果 打印创建的数组 我学到了足够多的
  • 在移动设备上滚动

    这个问题更多的是一个建议研究 我确实希望它对其他人有帮助 并且它不会关闭 因为我不太确定在哪里寻求有关此事的建议 在过去的 6 个月里 我一直在进行移动开发 我有机会处理各种设备上的各种情况和错误 最麻烦的是滚动问题 当涉及到在网站的多个区
  • 如何创建适合屏幕宽度的等宽/高框? [复制]

    这个问题在这里已经有答案了 我正在尝试建立一个网站 其中有很多宽度和高度相等的框 例如 我有一个页面 其中并排有两个相同大小的框 简单的解决方案是将宽度和高度设置为 50vw 这在出现滚动条之前效果很好 我已经用谷歌搜索了几个小时 但无法理
  • 使用 Vue 的多模式组件

    我在 Vue 中实现动态模式组件时遇到问题 A common approach I follow to display a set of data fetched from the db is I dump each of the rows
  • 在 HTML 下拉列表中有一个滚动条

    我正在寻找一种在 HTML 的下拉列表中添加滚动条的方法 这样如果下拉列表包含的内容超过例如 5 项 将出现滚动条以查看其余项 这是因为我将被迫列出一些大清单 过去几个小时我一直在谷歌上搜索它 但没有运气 它需要适用于 IE8 FF 和 C
  • Chrome//kendoUI/jQuery:超出最大调用堆栈大小

    我正在使用 hottowell 模板来创建 spa 应用程序 并且我从 jquery 中收到了一个很好的错误 基本上我的问题从此刻开始尝试绑定我的视图 viewModelBinder js 来自 durandal 库 viewModelBi
  • 如何使用 crypto-js 解密 AES ECB

    我正在尝试将加密数据从 flash 客户端 发送到服务器端的 javascript 在 asp 中作为 jscript 运行 有几个 javascript Aes 库 但它们实际上没有文档记录 我正在尝试使用 crypto js 但无法让代
  • 在 JavaScript 循环之外声明变量可以提高速度和内存?

    C 也有类似的问题 但我们没有看到 JavaScript 的任何问题 在循环内声明变量是否可以接受 假设循环有 200 次迭代 使用样本 2 相对于样本 1 是否有性能要求 内存和速度 我们使用 jQuery 来循环 它提高了我们将 var
  • 如何用另一个响应替换窗口的 URL 哈希?

    我正在尝试使用替换方法更改哈希 URL document location hash 但它不起作用 function var anchor document location hash this returns me a string va
  • 如何使用asm.js进行测试和开发?

    最近我读到asm js规范 看起来很酷 但是是否有任何环境 工具来开发和测试这个工具 这还只是处于规范阶段吗 您可以尝试使用 emscripten 和 ASM JS 1 并从侧分支在 firefox 构建中运行它 有关 asm js 的链接
  • 如何在react-highcharts中使用图表工具提示格式化程序?

    如何使用图表工具提示格式化程序 我正在使用高图表的反应包装器 我有这样的配置 const CHART CONFIG tooltip formatter tooltip gt var s b this x b each this points

随机推荐

  • 如何在 R 中对行和列进行子集化

    我是R新手 在阅读 R in action 这本书时 遇到了一个问题 代码有什么区别newdata lt leadership order leadership age and newdata lt leadership order lea
  • 协变和逆变之间的区别

    我无法理解协变和逆变之间的区别 问题是 协变和逆变有什么区别 协变和逆变是将集合中的一个成员与另一个成员关联起来的映射函数 更具体地说 映射可以是协变的或逆变的relation在那一套上 考虑所有 C 类型集的以下两个子集 第一的 Anim
  • 存储目录结构的数据结构?

    我正在使用 struts 2 框架开发一个简单的 java web 应用程序 该应用程序的目的是使用JSP页面显示我的计算机下的特定目录结构 我的问题是使用哪种数据结构为了存储目录结构 以便 JSP 页面可以从操作类访问该目录结构对象 ps
  • 我应该从 Python 3.0 开始吗​​? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 最近我决定扩大我的编程视野并学习Python编程语言 虽然我在大学课程和工作中的一两个项目中使用过一点 Python 但我绝不是专家 我的问题如
  • 使用 Perl 正则表达式捕获 C 样式代码块之前和之后的文本

    我正在尝试使用 Perl 正则表达式捕获 C 样式代码块之前和之后的一些文本 到目前为止 这就是我所拥有的 use strict use warnings my text lt lt END int max int x int y if x
  • 可绘制选择器在 Jelly Bean 中不起作用

    我有一个可绘制的选择器作为每个项目的背景ListView以突出显示所选行 一切在冰淇淋三明治中都可以正常工作 但在果冻豆中似乎不起作用 找不到任何文档说明哪些更改可能导致它停止工作以及我需要做什么来修复它 不工作是指当我单击行中的一行时Li
  • 什么是聚合初始化?

    数组初始化 第 4 章第 231 页中的部分 Java 思维 第二版 有这样说 在 C 中初始化数组很容易出错且乏味 C 使用 聚合初始化以使其更安全 Java没有 像 C 一样的 聚合 因为 Java 中一切都是对象 确实如此 有数组 并
  • 斑马打印机可以直接打印pdf吗

    是否可以通过Java中的斑马打印机直接打印存储的pdf 我找不到任何提及它们与直接打印兼容的内容 而且我无法打印它 我需要直接通过 zpl 进行通信吗 通过 Acrobat Reader 打印时 zebra 打印机工作正常 Adobe Re
  • 是什么导致在 iOS 应用程序 UI 测试期间获取元素快照时出现错误 -25204

    我在 UI 测试期间收到以下错误 使用 iPhone 6 模拟器 Assertion Failure UI Testing Failure Failure getting snapshot Error Domain XCTestManage
  • Math.floor(Math.random() * (Max - Min + 1) + Min) 在 JavaScript 中如何工作? (理论)

    我正在学习 JavaScriptfreecodecamp org https www freecodecamp org 基本 JavaScript 在舞台上103 110有一个任务是创建一个带有 2 个参数 最小值和最大值 的函数 并且该函
  • 如何使用电子邮件登录用户并使用 Django Rest Framework JSON Web 令牌将其注销?

    我有一个现有的 正在运行的 Django 应用程序 它实现了许多 Django REST framework API 我刚刚添加了用户身份验证Django rest framework JWT https github com GetBli
  • Linux 内核导出的符号

    我想检查Linux内核导出的符号列表 所以我发出命令 cat proc kallsyms 0000000000000000 D per cpu irq stack union 0000000000000000 D per cpu start
  • 如何在android中的按钮顶部显示进度条

    好的 这是我可以在 iOS 中在五分钟内完成的事情 但我似乎无法在 Android 上得到它 我只是想在按钮顶部显示进度条 我成功地渲染了进度条beside像这样的按钮 使用此代码
  • 这 2 个@synthesize 模式和推荐的模式有什么区别?

    在示例代码的很多地方我都看到了 synthesize 变量的两种不同方式 例如 我在这里使用 1 个示例按钮 property 强 非原子 IBOutlet UIButton logonButton 1 synthesize logonBu
  • 如何检查进程是否处于挂起状态(Linux)[关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 Linux中是否有任何命令可以让我知道进程是否处于挂起状态 Linux中是否有任何命令可以让我知道进程是否处于挂起状态 没有命令 但有一次
  • Mysql中如何删除空白行?

    我确实有一个包含超过 100000 个数据元素的表 但其中有近 350 个空白行 如何使用 phpmyadmin 删除这些空白行 手动删除是一项繁琐的任务 一般的答案是 DELETE FROM table name WHERE some c
  • 如何使用 NGINX 部署 NextJS?

    所以我知道如何在服务器上部署 React 应用程序 npm 运行构建 创建一个服务器块并将根指向我的反应应用程序文件夹构建 根 var www xfolder build systemctl 重新启动 nginx 运行我的节点服务器 noh
  • Android 共享首选项示例

    我正在尝试学习 SharedPreferences 但出现错误 我的布局有一个按钮可以对该方法做出反应doThis 这是我的java package com example sharedprefs import android app Ac
  • Qt:用于插件参数的 C++ 动态参数 GUI

    我的基于 Qt 的应用程序可以通过插件进行扩展 http doc qt io archives 4 6 plugins howto html the lower level api extending qt applications htt
  • 调整

    I have two调整容器大小时图表渲染的问题 First问题是 当容器大小调整时如何正确渲染图表 i e Maximize Restore problem at its first rendering it works just fin