2017-09-17 32 views
0

我已經搜索和搜索,閱讀和閱讀,並嘗試和嘗試。我一定錯過了一些東西,因爲實現這個功能讓我難以忘懷。 因此,我發佈希望徵求一些建議。 我也意識到Morris圖表不再被支持,但它被分配給我,所以我盡我所能。 下面是錯誤的:無法讓我的morris圖表正常工作

morris-0.5.1.min.js:6 Uncaught TypeError: Cannot read property 'length' of undefined 
    at d.<anonymous> (morris-0.5.1.min.js:6) 
    at d.<anonymous> (morris-0.5.1.min.js:6) 
    at d.b.Grid.d.setData (morris-0.5.1.min.js:6) 
    at d [as constructor] (morris-0.5.1.min.js:6) 
    at d.c [as constructor] (morris-0.5.1.min.js:6) 
    at new d (morris-0.5.1.min.js:6) 
    at Object.d [as Area] (morris-0.5.1.min.js:6) 
    at HTMLDocument.<anonymous> (proc-totals-chartX.php:194) 
    at j (jquery-2.1.1.js:2) 
    at Object.fireWith [as resolveWith] (jquery-2.1.1.js:2) 

,這裏是我的功能:

$(document).ready(function() { 
    Morris.Area({ 
     element: 'ChartArea', 
     data: [ 
      { y: '2017/01', ortiz: 155, curiel: 32, covarrubias: 20, castillo: 3 }, 
      { y: '2017/02', ortiz: 130, curiel: 25, covarrubias: 20, castillo: 6 }, 
      { y: '2017/03', ortiz: 186, curiel: 44, covarrubias: 61, castillo: 4 }, 
      { y: '2017/04', ortiz: 165, curiel: 29, covarrubias: 60, castillo: 5 }, 
      { y: '2017/05', ortiz: 182, curiel: 11, covarrubias: 40, castillo: 8, montalvo: 12 }, 
      { y: '2017/06', ortiz: 198, curiel: 9, covarrubias: 58, castillo: 13, montalvo: 18 } 
     ], 
     xkey: ['y'], 
     ykey: ['ortize','curiel','covarrubias','castillo','montalvo'], 
     labels: ['Ortiz', 'Curiel', 'Covarrubias', 'Castillo', 'Montalvo'] 
    }); 
}); 

而且我一直在努力,研究每一個描述。我仍然沒有答案。所以任何指針,建議,決議將不勝感激。 謝謝

回答

0

設置yKey複數形式 - yKeys

JS Bin Example

你的代碼工作

Morris.Area({ 
 
    element: 'area-example', 
 
    data: [ 
 
     { y: '2017/01', ortiz: 155, curiel: 32, covarrubias: 20, castillo: 3 }, 
 
     { y: '2017/02', ortiz: 130, curiel: 25, covarrubias: 20, castillo: 6 }, 
 
     { y: '2017/03', ortiz: 186, curiel: 44, covarrubias: 61, castillo: 4 }, 
 
     { y: '2017/04', ortiz: 165, curiel: 29, covarrubias: 60, castillo: 5 }, 
 
     { y: '2017/05', ortiz: 182, curiel: 11, covarrubias: 40, castillo: 8, montalvo: 12 }, 
 
     { y: '2017/06', ortiz: 198, curiel: 9, covarrubias: 58, castillo: 13, montalvo: 18 } 
 
    ], 
 
    xkey: 'y', 
 
    ykeys: ['ortize','curiel','covarrubias','castillo','montalvo'], 
 
    labels: ['Ortiz', 'Curiel', 'Covarrubias', 'Castillo', 'Montalvo'] 
 
});
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css"> 
 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script> 
 
</head> 
 
<body> 
 
    <div id="area-example" style="height: 250px;"></div> 
 
</body> 
 
</html>