热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

隐藏一些图形元素c3js,而不卸载数据

如何解决《隐藏一些图形元素c3js,而不卸载数据》经验,为你挑选了1个好方法。

是否可以隐藏c3js图表中的某些线条,条形图和其他图形元素,而无需卸载或隐藏数据?

我希望将这些数据保存在工具提示中,但隐藏一些图形元素.将鼠标悬停在一个栏上,查看其他隐藏栏的数据.

我知道hide方法 - chart.hide(['data2', 'data3']);但是这也会从工具提示中删除数据.

我的问题似乎没有在文档中讨论过.

11月的类似问题没有解决.

我现在没有任何代码 - 只是寻找制作自定义工具提示的替代方法.

谢谢



1> Chetan..:

一个简单的解决方案是使用CSS显示属性为图表svg元素,如: -

http://jsfiddle.net/chetanbh/j9vx0dmg/

var chart = c3.generate({
  data: {
    columns: [
        ['data1', 100, 200, 150, 300, 200],
        ['data2', 400, 500, 250, 700, 300],
    ]
  }
});

在上面的c3js图表示例中,线条图用两条线渲染.

每一行都是Group元素下的Path svg元素.这些组元素将获得类属性值,如'c3-target-data1'和'c3-target-data2'.

利用这个我们可以使用CSS,如: -

.c3-target-data2 {
    display: none;
}

隐藏图表中的整个"data2",但工具提示将继续显示"data2"的数据.

在此输入图像描述

希望这可以帮助.


推荐阅读
author-avatar
花逝留香人走荼茶凉_442
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有