首页 \ 问答 \ SIMILE时间线替代时间线可视化?(Alternative to SIMILE Timeline for timeline visualization? [closed])

SIMILE时间线替代时间线可视化?(Alternative to SIMILE Timeline for timeline visualization? [closed])

所以我一直在玩SIMILE时间线很多乐趣,但不幸的是,似乎全部放弃了 (最近的封闭机票2009年5月),并充斥着内存泄漏 ,特别是当你动态加载和卸载事件时 (尤其是在我的情况下是真的)。

我是JavaScript的新手,所以调试这些漏洞将会有点复杂。 在我潜入头脑之前,我不明白某个语言的问题,或者我从来没有看过的代码库,我想知道是否有任何东西与我可以用Timeline的功能集进行比较:

  1. 一个频段上的多个事件
    • 而不是拥有10,100,1000 数据,尽可能使用可用的空间来适应一行上的多个事件
  2. 滚动
  3. CSS风格到具体事件
    • 如果需要,我可以为每个事件指定一个特定的图标,字体等。 这非常适合突出显示错误事件或有趣的事件
  4. 过滤/搜索/突出
  5. 突出一段时间或时间点
    • 这将是一个垂直乐队,显示一个“现在”的时刻,或一个乐队,涵盖一段时间的开始和结束时间

我知道很多这些功能可能会被放在诸如Flot或HighCharts之类的东西上,但是这些东西在我可以在Timeline中使用的旁边,所以我在衡量成本/收益是否更容易修复内存泄漏或推出一些没有它的库的3 - 4功能。 我的直觉说“修复泄漏,这更容易”,但是我想知道,如果有人能够告诉我可能是90%的方式,进入的另一个10%的障碍。


So I have been having lots of fun playing with SIMILE Timeline, but unfortunately, it appears to be all but abandoned (most recently closed ticket May 2009) and riddled with memory leaks, especially when you are dynamically loading and unloading events (which is especially true in my case).

I am a novice in JavaScript, so debugging these leaks is going to be more than a little complicated. Before I dive head-first into fixing a problem in a language I don't understand or a codebase I have never looked at, I want to know if there is anything out there that compares to the feature-set that I can get with Timeline:

  1. Multiple events on one band
    • instead of having 10, 100, 1000 rows of data, use the space available to fit multiple events on one line when possible
  2. Scrollable
  3. CSS styling down to the specific event
    • I can specify a specific icon, font, etc., for each event if I need to. This is great for highlighting error events or interesting events
  4. filtering/searching/highlighting
  5. highlighting a band of time or point in time
    • This would be a vertical band that shows a 'now' moment, or a band that covers a time period's start and end time

I know that alot of these features can probably be put into things such as Flot or HighCharts, but these things were next to free for me to use in Timeline, so I'm weighing the cost/benefit of whether it is easier to fix a memory leak or roll out 3 - 4 features on some library that doesn't have it. My gut says "fix the leak, it's easier", but I would like to know if anyone can show me something that might be 90% of the way there with a low barrier of entry to getting that other 10%.


原文:https://stackoverflow.com/questions/4700419
更新时间:2021-05-31 15:05

最满意答案

在你的代码上完美地工作: Js小提琴我改变了.on('click', to .on('click', method。

您应该检查元素并以样式来看看还有什么会覆盖您的:悬停颜色


Works perfectly here on your code: Js fiddle I've changed .click to .on('click', method.

You should inspect element and see in styles what else overrides your :hover color

相关问答

更多
  • 在你的代码上完美地工作: Js小提琴我改变了.on('click', to .on('click', method。 您应该检查元素并以样式来看看还有什么会覆盖您的:悬停颜色 Works perfectly here on your code: Js fiddle I've changed .click to .on('click', method. You should inspect element and see in styles what else overrides your :hover co ...
  • 你可以像这样连接类: .accordionButton.cyan:hover{ color: cyan; } 这种悬停适用于两种样式的元素。 You can chain classes together like this: .accordionButton.cyan:hover{ color: cyan; } This hover is applied to elements with both styles.
  • .portfolio-item-hover { opacity: 0; } 在这里将不透明度改为.9。 和 .portfolio-item: hover { opacity: .9; } chage opacity为0。 有用.. .portfolio-item-hover { opacity: 0; } change opacity to .9 here. and .portfolio-item: hover { opacity: .9; } chage opacity to 0 ...
  • 改用toggleClass: $(document).ready(function() { $("div.bar").mouseover(function(){ $(this).toggleClass("hover"); }).mouseout(function(){ $(this).toggleClass("hover"); }); }); 如果不存在,它将添加类,如果已经应用则删除。 正确的: div.bar.hover不 ...
  • 尝试使用这样的替代方法: $('#selectable li').on('mouseenter',function(){ $(this).addClass('selecting'); }).on('mouseleave',function(){ $(this).removeClass('selecting'); }); 你需要一个当前版本的jQuery。 版本1.7+ 不太确定您是否尝试使用addClass/removeClass调用中的数字参数来完成。 jQuery文档定义了这些函数,如下所示: ...
  • 这个问题似乎有两个部分: 为什么徘徊片状? 就像Palpatim说的那样,只要unfold-button悬停在它上面,它就会跳开,所以你需要有一个不动的元素来捕捉你的徘徊而不会徘徊。 所以让我们添加一个div来执行此操作:
    Hello World
    同样,让我们相应地更新CSS选择器: .container:hover .unfold-button ...
  • 将模板中最外层控件的Background设置为Transparent ,这样无论内容是什么,都应该进行测试。 Set the Background of the outermost control in the template to Transparent, that way it should hit-test, no matter what the content is.
  • 他们都需要自己的选择器,但你可以用它们分开: .a:hover, .a:hover ~ .b, .a:hover ~ .c { stroke: red; } (注意~是“sibling after”而不是“同时”。) 如果他们有任何共同点(比如说他们都是
    s,或者你可以给他们每个人另外一个类),那就用它: .a:hover, .a:hover ~ div { stroke: red; } They all need their own selectors, but you can separa ...
  • 我认为Javascript是这里的简单解决方案。 如果要设置父元素的颜色,CSS没有可用的当前选择器。 $('.dropdown li').mouseenter(function(){ $(this).parent().css('background-color', 'blue'); }); $('.dropdown li').mouseleave(function(){ $(this).parent().css('background-color', 'red'); }); html ...
  • 单独添加: .element:hover .element-add, .element:hover .element-add2 { display: block; } Add each seperately: .element:hover .element-add, .element:hover .element-add2 { display: block; }

相关文章

更多

最新问答

更多
  • 您如何使用git diff文件,并将其应用于同一存储库的副本的本地分支?(How do you take a git diff file, and apply it to a local branch that is a copy of the same repository?)
  • 将长浮点值剪切为2个小数点并复制到字符数组(Cut Long Float Value to 2 decimal points and copy to Character Array)
  • OctoberCMS侧边栏不呈现(OctoberCMS Sidebar not rendering)
  • 页面加载后对象是否有资格进行垃圾回收?(Are objects eligible for garbage collection after the page loads?)
  • codeigniter中的语言不能按预期工作(language in codeigniter doesn' t work as expected)
  • 在计算机拍照在哪里进入
  • 使用cin.get()从c ++中的输入流中丢弃不需要的字符(Using cin.get() to discard unwanted characters from the input stream in c++)
  • No for循环将在for循环中运行。(No for loop will run inside for loop. Testing for primes)
  • 单页应用程序:页面重新加载(Single Page Application: page reload)
  • 在循环中选择具有相似模式的列名称(Selecting Column Name With Similar Pattern in a Loop)
  • System.StackOverflow错误(System.StackOverflow error)
  • KnockoutJS未在嵌套模板上应用beforeRemove和afterAdd(KnockoutJS not applying beforeRemove and afterAdd on nested templates)
  • 散列包括方法和/或嵌套属性(Hash include methods and/or nested attributes)
  • android - 如何避免使用Samsung RFS文件系统延迟/冻结?(android - how to avoid lag/freezes with Samsung RFS filesystem?)
  • TensorFlow:基于索引列表创建新张量(TensorFlow: Create a new tensor based on list of indices)
  • 企业安全培训的各项内容
  • 错误:RPC失败;(error: RPC failed; curl transfer closed with outstanding read data remaining)
  • C#类名中允许哪些字符?(What characters are allowed in C# class name?)
  • NumPy:将int64值存储在np.array中并使用dtype float64并将其转换回整数是否安全?(NumPy: Is it safe to store an int64 value in an np.array with dtype float64 and later convert it back to integer?)
  • 注销后如何隐藏导航portlet?(How to hide navigation portlet after logout?)
  • 将多个行和可变行移动到列(moving multiple and variable rows to columns)
  • 提交表单时忽略基础href,而不使用Javascript(ignore base href when submitting form, without using Javascript)
  • 对setOnInfoWindowClickListener的意图(Intent on setOnInfoWindowClickListener)
  • Angular $资源不会改变方法(Angular $resource doesn't change method)
  • 在Angular 5中不是一个函数(is not a function in Angular 5)
  • 如何配置Composite C1以将.m和桌面作为同一站点提供服务(How to configure Composite C1 to serve .m and desktop as the same site)
  • 不适用:悬停在悬停时:在元素之前[复制](Don't apply :hover when hovering on :before element [duplicate])
  • 常见的python rpc和cli接口(Common python rpc and cli interface)
  • Mysql DB单个字段匹配多个其他字段(Mysql DB single field matching to multiple other fields)
  • 产品页面上的Magento Up出售对齐问题(Magento Up sell alignment issue on the products page)