我在Bootstrap选项卡中使用Morris图表(每个选项卡都有不同时间段的图表)。
搜索此站点后,我发现为了在选项卡中显示图表,我应使用此代码:
$('ul.nav a').on('shown.bs.tab', function (e) {
new Morris.Line({......chart_data_goes_here
它很好用(当不使用代码时,图表仅显示在第一个选项卡中),但是当我一遍又一遍地单击选项卡(以在不同的图表之间切换)时,图表会以某种方式“重叠”。第一次单击任何选项卡后,一切正常,但是从那时起,任何其他单击都会使“覆盖”越来越大。查看示例:
我该如何停止?我猜是因为所有图表都是同时在'shown.bs.tab'事件上创建的,如果仅在'shown.bs.tab'事件上创建了一张图表,问题可能会消失吗?如果是这样,我可以指定单击特定ta后需要创建哪个图表吗?我正在使用标准标签:
<li class=""><a href="#stats-week" data-toggle="tab">weekly</a></li>
<li class=""><a href="#stats-month" data-toggle="tab">month</a></li>
在shown.bs.tab
事件处理程序内部,只需在加载图表之前清空div的内容,以清除最后加载的图表的内容。
$('#yourChartDivID').empty();
new Morris.Line({...chart data});
我有相反的问题。我很讨厌编码。期。
我有5个标签。标签内的元素与面孔不同。
第一眼第二鼻子等
元素有多种变体,例如第一眼-绿色,蓝色,棕色。
我想要的是让标签像叠加层。
因此,如果用户在“眼睛”选项卡中选择了蓝眼睛,当他进入下一个选项卡以添加眉毛或嘴巴时,它将保持可见。
在我看来,keepstate语句有些问题,但是我真的不知道如何实现它。
有答案吗?