在Laravel中将集合循环到jQuery

Question

我有一个带有jquery的静态图表，我想在其中使用动态数据，但它返回SyntaxError: unexpected token: ':'

代码

Static

Morris.Area({
  element: 'dashboard-area-1',
  data: [
    { y: '2014-10-10', a: 17,b: 19, c: 10},
    { y: '2014-10-11', a: 19,b: 21, c: 11},
    { y: '2014-10-12', a: 22,b: 25, c: 33},
    { y: '2014-10-13', a: 20,b: 22, c: 55},
    { y: '2014-10-14', a: 21,b: 24, c: 89},
    { y: '2014-10-15', a: 34,b: 37, c: 34},
    { y: '2014-10-16', a: 43,b: 45, c: 65}
  ],
  xkey: 'y',
  ykeys: ['a','b', 'c'],
  labels: ['Page', 'Visitors','Page Views'],
  resize: true,
  hideHover: true,
  xLabels: 'day',
  gridTextSize: '10px',
  lineColors: ['#1caf9a','#33414E', '#2344d3'],
  gridLineColor: '#E5E5E5'
});

Dynamic

var analysdata = "{{$analyticsData}}";
Morris.Area({
  element: 'dashboard-area-1',
  data: [
    $.each( analysdata, function( key, value ) {
      y: '2014-10-10', a: value.pageTitle,b: value.visitors, c: value.pageViews,
    });
  ],
  xkey: 'y',
  ykeys: ['a','b', 'c'],
  labels: ['Page', 'Visitors','Page Views'],
  resize: true,
  hideHover: true,
  xLabels: 'day',
  gridTextSize: '10px',
  lineColors: ['#1caf9a','#33414E', '#2344d3'],
  gridLineColor: '#E5E5E5'
});

错误来自：

y: '2014-10-10', a: value.pageTitle,b: value.visitors, c: value.pageViews,

我做错了什么？

Answer 1

在您的控制器中，您需要这样做：

return view( 'your_view_name',[ 
    'analyticsData'=> json_encode($analyticsData, JSON_UNESCAPED_SLASHES ); 
]);

然后，尝试以下操作：

var analysdata = {!! $analyticsData !!};
const theData = [];
$.each( analysdata, function( key, value ) {
    theData.push({
        y: '2014-10-10', a: value.pageTitle,b: value.visitors, c: value.pageViews
    });
});

Morris.Area({
    element: 'dashboard-area-1',
    data: theData,
    xkey: 'y',
    ykeys: ['a','b', 'c'],
    labels: ['Page', 'Visitors','Page Views'],
    resize: true,
    hideHover: true,
    xLabels: 'day',
    gridTextSize: '10px',
    lineColors: ['#1caf9a','#33414E', '#2344d3'],
    gridLineColor: '#E5E5E5'
});