Php 在div显示设置为block之后，不显示任何内容

我在我的项目中使用了引导。在每个选项卡中，我显示一个图表，我的问题是div display属性为none，用户单击a标记后，div显示将更改为块。我还编写了一个函数来处理图表的显示。但当用户单击选项卡时，图表不会显示。但是如果我删除display:none属性，它的显示就没有问题了。 这是我的部门：

<div id="bar" style="display: none">
   <?php echo chart($title,$data,'Bar');?>
</div>

---

解决了。我只需要将可见性设置为隐藏，当用户单击一个标记时，将其设置为可见，一切正常。

在单击时显示#条的脚本在哪里？我猜无论您在图表中使用什么插件，它都在初始化时使用容器维度。一旦元素可见，您就应该初始化插件，或者使用其他方式将元素设置在视口之外，而不是

display:none

function chart($title,$data,$type){
ob_start();
?>
<script src="<?php echo url()?>/assets/chart/Chart.min.js" type="text/javascript"></script>
<script src="<?php echo url()?>/assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<canvas style="display: block;margin: 0 auto;" id="myCanvas" width="600" height="300"></canvas>
<script>
$(function(){
  var ctx = $('#myCanvas').get(0).getContext('2d');
  var barChartData = {
    labels : <?php echo json_encode($title) ?>,
    datasets : [
      {
        fillColor : "rgba(10, 150, 100, 0.8)",
        strokeColor : "rgba(24, 107, 2, 0.8)",
        highlightFill: "rgba(4, 20, 60, 0.9)",
        highlightStroke: "rgba(5, 35, 70, 1)",
        data : <?php echo json_encode($data) ?>
      }
    ]
  };
  var pieChart = new Chart(ctx).<?php echo $type?>(barChartData);
});
</script>
<?php
$view = ob_get_clean();
return $view;
}

 $('#aBar').on('click',function(){
  $('#circle').css('display','none');
  $('#line').css('display','none');
  $('#bar').css('display','block');
});