Я использую morris.js для построения графиков, и я хотел бы показать эти диаграммы карусельной загрузкой, однако Firefox перестает отвечать, если я это сделаю. Они могут работать хорошо по отдельности, но будут разбиваться, если их собрать вместе. firebug сказал мне, что есть что-то делать с библиотекой Рафаэля, но я все еще не могу понять. Кто-то там столкнулся с подобной проблемой и знает, как это решить? Благодарю.Кассета Bootstrap имеет конфликт с графиком morris.js?
Это часть моего кода.
<div id="myCarousel" class="carousel slide">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item">
<div id="A-lineChart" style="height:250px;"></div>
</div>
<div class="item">
<div id="B-lineChart" style="height:250px;"></div>
</div>
<div class="item">
<div id="C-lineChart" style="height:250px;"></div>
</div>
</div>
<!-- Carousel nav -->
<a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
</div>
<script>
$('.carousel').carousel({
interval: 1000
});
$.post('/my/handler.json',{
parameter:value},
function(data){
if(data.hasOwnProperty('error')){
alert('error');
}
else{
var r = data['results']
var AData = new Array();
var BData = new Array();
var CData = new Array();
for(var i = 0; i < r.length; i++){
d = r[i];
col = {'date':date, 'A': A};
AData.push(col);
col = {'date':date, 'B': B};
BData.push(col);
col = {'date':date, 'C': C};
CData.push(col);
}
new Morris.Line({
element: 'A-lineChart',
data: AData,
xkey: 'date',
ykeys: ['A'],
labels: ['A']
});
new Morris.Line({
element: 'B-lineChart',
data:BData,
xkey:'date',
ykeys:['B'],
labels:['B']
});
new Morris.Line({
element: 'C-lineChart',
data:CData,
xkey:'date',
ykeys:['C'],
labels:['C']
});
}
});
</script>
То же самое произошло, когда я попытался использовать вкладку. Я думаю, проблема в том, что скрытая/отображаемая диаграмма ... но на самом деле не знаю, как исправить .... –
Можете ли вы опубликовать пример json, возвращенный вашим вызовом AJAX, чтобы я мог проверить это? – asgallant
Вы разрешили это? @GigiWu Тот же вопрос здесь, но с Slick. – Ben