Question

http://chartjs.devexpress.com/Documentation/Tutorial/Configure_Charts?version=13_2

我正在努力使ChartJS api实现工作，但我只是看不到我错过的。

这是说明的原始页面。

  <!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8" />
      <script type="text/javascript" src="jquery-2.0.3.min.js"></script>
      <!--script type="text/javascript" src="knockout-3.0.0.js"></script-->
      <!--script type="text/javascript" src="angular.min.js"></script-->
      <script type="text/javascript" src="globalize.min.js"></script>
      <script type="text/javascript" src="dx.chartjs.js"></script>

  <!-- ... -->

<script type="text/javascript">
  var chartDataSource = [
{
    year: 1950, Africa: 227, Americas: 331,
    Asia: 1436, Europe: 547, Oceania: 12
},
{
    year: 1960, Africa: 285, Americas: 416,
    Asia: 1718, Europe: 605, Oceania: 15
},
{
    year: 1970, Africa: 365, Americas: 512,
    Asia: 2156, Europe: 657, Oceania: 19
},
{
    year: 1980, Africa: 478, Americas: 612,
    Asia: 2644, Europe: 695, Oceania: 22
},
{
    year: 1990, Africa: 633, Americas: 720,
    Asia: 3180, Europe: 722, Oceania: 26
},
{
    year: 2000, Africa: 810, Americas: 833,
    Asia: 3678, Europe: 731, Oceania: 30
},
{
    year: 2010, Africa: 1016, Americas: 936,
    Asia: 4149, Europe: 728, Oceania: 35
}
];
    $(function () {
        $("#chartContainer").dxChart({
dataSource: chartDataSource,
commonSeriesSettings: {
    argumentField: 'year'
},
series: [{
    name: 'Oceania',            
    valueField: 'Oceania'
}, {
    name: 'Africa',
    valueField: 'Africa'
},{
    name: 'Americas',
    valueField: 'Americas'
},{
    name: 'Asia',
    valueField: 'Asia'
},{ 
    name: 'Europe',
    valueField: 'Europe'
}]
});
      }

</script>



  </head>
  <body>

<div id="chartContainer" style="max-width:700px;height: 300px;"></div>


  </body>

Answer 1

你错过了jQuery ready函数的结束括号。也不需要将内部脚本放在正文的底部，因为使用了jQuery ready函数

所以，这是the working script

<script type="text/javascript">
    var chartDataSource = [ ... some data ... ];
    $(function () {
        $("#chartContainer").dxChart({
            dataSource: chartDataSource,
            commonSeriesSettings: {
                argumentField: 'year'
            },
            series: [{ name: 'Oceania', valueField: 'Oceania' }, 
                { name: 'Africa', valueField: 'Africa' },
                { name: 'Americas', valueField: 'Americas' },
                { name: 'Asia', valueField: 'Asia' },
                { name: 'Europe', valueField: 'Europe' }]
         });
    });
</script>
<div id="chartContainer" style="max-width:700px;height: 300px;"></div>

为什么不会运行这个html页面，Devexpress文档ChartJS

1 个答案: