Javascript amChart未在Laravel刀片文件中渲染_Javascript_Html_Laravel_Amcharts

Javascript amChart未在Laravel刀片文件中渲染

javascript html laravel

Javascript amChart未在Laravel刀片文件中渲染,javascript,html,laravel,amcharts,Javascript,Html,Laravel,Amcharts,我是新来的amchart，正在尝试在我的Laravel（PHP框架）项目中显示可视化。在同一个图表中，JS正在显示。但阿姆查特不起作用下面是可视化页面的chart.blade.php  <script src="https://cdn.amcharts.com/lib/4/core.js"></script> <script src="https://cdn

我是新来的amchart，正在尝试在我的Laravel（PHP框架）项目中显示可视化。在同一个图表中，JS正在显示。但阿姆查特不起作用

下面是可视化页面的

chart.blade.php

  <!-- AmCharts Resources -->
  <script src="https://cdn.amcharts.com/lib/4/core.js"></script>
  <script src="https://cdn.amcharts.com/lib/4/charts.js"></script>
  <script src="https://cdn.amcharts.com/lib/4/themes/animated.js"></script>

<body>

<div class="card">
   <div class="card-header">
     <h6>AmChart</h6>
   </div>
   <div class="card-body">
     <canvas id="chartdiv" width="341" height="253" style="display: block; width: 341px; height: 253px;">/canvas>
   </div>
</div>



 <script src="{{URL::asset('js/charts/demo.js')}}"></script>

</body>

我从Chrome的控制台日志中获取JSON数据

感谢您的时间和考虑。

将

替换为

// Create chart instance in one go
// Create chart instance
var chart = am4core.create("chartdiv", am4charts.PieChart);

// Create pie series
var series = chart.series.push(new am4charts.PieSeries());
series.dataFields.value = "litres";
series.dataFields.category = "country";

// Add data
chart.data = [{
  "country": "Lithuania",
  "litres": 501.9
}, {
  "country": "Czech Republic",
  "litres": 301.9
}, {
  "country": "Australia",
  "litres": 139.9
}, {
  "country": "Austria",
  "litres": 128.3
}, {
  "country": "The Netherlands",
  "litres": 50
}];

// And, for a good measure, let's add a legend
chart.legend = new am4charts.Legend();

console.log(chart.data);