V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
nocoo
V2EX  ›  分享创造

数据可视化 InfoViz

  •  
  •   nocoo · 2012-09-19 09:24:11 +08:00 · 6304 次点击
    这是一个创建于 4467 天前的主题,其中的信息可能已经有所发展或是发生改变。
    小弟自己做的一个js控件库。
    数据可视化控件库InfoViz,基于Raphaël,支持大部分正常浏览器,完美支持iOS以及各种Retina显示屏。求使用,求fork,求star,求watch~



    Website: http://infoviz.org
    GitHub: https://github.com/nocoo/InfoViz

    谢谢支持!
    29 条回复    1970-01-01 08:00:00 +08:00
    guotie
        1
    guotie  
       2012-09-19 10:05:31 +08:00
    great!
    simo
        2
    simo  
       2012-09-19 12:36:20 +08:00
    楼主V5!!!
    leeoo
        3
    leeoo  
       2012-09-19 13:34:31 +08:00
    LZ这个外观看起来不错。我项目中一直用的Highcharts
    csx163
        4
    csx163  
       2012-09-19 15:53:10 +08:00
    楼主NIU x
    markmx
        5
    markmx  
       2012-09-19 15:57:10 +08:00
    V5
    nocoo
        6
    nocoo  
    OP
       2012-09-19 16:07:01 +08:00
    @leeoo

    highchart很好很强大。只是授权费太贵啦~
    amcharts很好很强大,授权费也很贵...
    咱贡献一个MIT协议的,让大家都有的用~
    icyflash
        7
    icyflash  
       2012-09-19 16:18:46 +08:00
    不知道有没这样的功能,我鼠标移到菜单的china上,charts里面china数据的tip都显示出来
    pzhang
        8
    pzhang  
       2012-09-19 16:42:43 +08:00
    V5
    kavinyao
        9
    kavinyao  
       2012-09-19 16:47:52 +08:00
    Radidar -> radar/radial?

    还有绘图是阻塞的?一开网页整个卡住了。
    nocoo
        10
    nocoo  
    OP
       2012-09-19 18:33:21 +08:00
    @pzhang 门儿哥~
    @kavinyao 确实,现阶段还没考虑异步的问题。
    @icyflash 此功能确实有,可以看文档的tooltip部分。可以通过类似模板的方式,把数据里面的一些字段按需求展现在tooltip里。

    另,给大家看一个花絮,一个控件的诞生过程~

    nocoo
        11
    nocoo  
    OP
       2012-09-19 18:37:24 +08:00   ❤️ 1
    @kavinyao 阻塞的问题在慢速的计算设备上比较明显,主要是下面的HeatMap和SmithGraph的结点随机生成的多了一点。HeatMap是1024个结点,SmithGraph是256个bar,每个bar至多生成6条边。实际使用环境里可能不需要这么多数据。后面可以规划模块化和异步绘制的优化,使得体验更好。
    谢谢您的建议。
    guotie
        12
    guotie  
       2012-09-19 18:49:02 +08:00
    能做出这样的效果吗:
    假设有三个系列的值:最小,平均,最大,界面上显示平均值的连线,每个平均值的到最大值和最小值之间的区域使用阴影的深浅来表示,类似于rrdtool,例如:

    http://oss.oetiker.ch/smokeping-demo/?displaymode=n;start=2012-09-19%2009:43;end=now;target=Customers.OP.james-console
    nocoo
        13
    nocoo  
    OP
       2012-09-19 19:56:48 +08:00
    @guotie 可以做呦~安排在Tree类控件之后做一个试试呗。这个需求,目前可以用三条线的LineChart实现,一条average,一条max,一条min。只是失去三条线直接如参考控件所示的联系了。
    egen
        14
    egen  
       2012-09-19 23:25:34 +08:00
    v5了
    zh0501
        15
    zh0501  
       2012-09-20 00:07:34 +08:00
    弱弱的问下 这个怎么用?
    nocoo
        16
    nocoo  
    OP
       2012-09-20 21:25:38 +08:00
    @zh0501 您可以围观Demo页面 http://infoviz.org/ 的源代码,有些页面编程基础的话,还是蛮易用的~
    @kavinyao 今天更新了一个版本,使用了SeaJS对控件库进行了模块化,顺便SeaJS也帮我解决了异步绘图的问题。希望您能满意,谢谢支持。
    cabinw
        17
    cabinw  
       2012-09-20 22:14:14 +08:00
    很棒,周末用用试试
    dreamwing
        18
    dreamwing  
       2012-09-20 22:26:20 +08:00
    很帅!
    nocoo
        19
    nocoo  
    OP
       2012-09-22 09:55:47 +08:00
    @guotie 你需要的控件做好啦~
    http://infoviz.org/#stockchart

    guotie
        20
    guotie  
       2012-09-22 10:18:32 +08:00
    楼主天才,佩服!
    wbrover
        21
    wbrover  
       2012-09-22 20:19:24 +08:00
    那几幅图好美啊。楼主不光技术牛,兼顾了各种兼容性,而且还如此谦逊。

    真是非常非常赞!
    nocoo
        22
    nocoo  
    OP
       2012-09-23 07:59:06 +08:00
    @guotie
    @wbrover

    哎呀说的我太不好意思了...大家喜欢就好
    nodexy
        23
    nodexy  
       2012-10-23 11:34:19 +08:00
    LZ 的这个项目与我的兴趣之一相重合啊 哈哈

    我以前一直打算用 Raphaël.js做一个类似circos.ca的框架来着。
    zhangxiao
        24
    zhangxiao  
       2012-10-23 12:01:54 +08:00
    非常赞啊,有需要的时候一定使用!
    rainchen
        25
    rainchen  
       2012-10-23 12:32:56 +08:00
    有个d3.js比较强大,也可以做数据库可视化,楼主可以参考参考
    HowardMei
        26
    HowardMei  
       2012-10-23 12:57:15 +08:00
    很给力,Raphaël.js 灌数据和自定义坐标轴很麻烦的,你封装得太赞了,曾经Debug到想撞墙的人路过~~~
    nocoo
        27
    nocoo  
    OP
       2012-10-24 10:41:16 +08:00
    @nodexy 这个事情吧,我觉得控件可视化和专门可视化要区分,现在的项目专注于实现公认成熟的展现形式,然后封装成控件。对于一些具体的数据,定制一种展现形式往往会更棒,这个貌似没法抽象。

    @HowardMei 确实,库选对了生活会美好很多~
    zhangxiao
        28
    zhangxiao  
       2013-03-07 04:40:47 +08:00
    @nocoo 想问下是否可以通过api动态的改变图表?比如一个pie chart,改变各个部分的比例之后,有一个transition来体现改变?
    nocoo
        29
    nocoo  
    OP
       2013-03-07 15:17:21 +08:00   ❤️ 1
    @zhangxiao 没时间,动画没做... 通过API换是没问题的。可以参考这些页面的Test3:
    http://infoviz.org/test/bubblechart.html
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5529 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 02:42 · PVG 10:42 · LAX 18:42 · JFK 21:42
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.