-1

I'm displaying a pie chart and a bar chart, but my line chart, with the same type of code, does not display, and I wonder why. Here is my code:

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.3/Chart.js"></script>
. . .
<canvas id="forecastLineChart"></canvas>

JQUERY

    var lineChartData = {
            labels: [
                "APPLES, GALA WAXF 138", "APPLES, GOLDEN DELICIOUS WAX
100", "APPLES, GOLDEN DELICIOUS WAXF 113"
            ],
            datasets: [
                {
                    fillColor: "rgba(220,220,220,0.5)",
                    strokeColor: "rgba(220,220,220,0.8)",
                    highlightFill: "rgba(220,220,220,0.75)",
                    highlightStroke: "rgba(220,220,220,1)",
                    data: [49, 46, 153.86]
                },
                {
                    fillColor: "rgba(151,187,205,0.5)",
                    strokeColor: "rgba(151,187,205,0.8)",
                    highlightFill: "rgba(151,187,205,0.75)",
                    highlightStroke: "rgba(151,187,205,1)",
                    data: [52, 40, 65.00]
                },
                {
                    fillColor: "rgba(120,240,180,0.5)",
                    strokeColor: "rgba(120,240,180,0.8)",
                    highlightFill: "rgba(120,240,180,0.75)",
                    highlightStroke: "rgba(120,240,180,1)",
                    data: [42, 42, 227.70]
                }
            ]
        }
        var ctxLineChart = $("#forecastLineChart").get(0).getContext("2d");
        var forecastImpactLineChart = new    Chart(ctxLineChart).Line(lineChartData);
B. Clay Shannon-B. Crow Raven
  • 8,547
  • 144
  • 472
  • 862

2 Answers2

2

The syntax to define a chart has changed a bit in version 2. Fiddle.

var forecastImpactLineChart = Chart.Line(ctxLineChart, {
    data: lineChartData
});

OR

var forecastImpactLineChart = new Chart(ctx, {
    type: 'line',
    data: lineChartData,
    options: options
});
Steven B.
  • 8,962
  • 3
  • 24
  • 45
1

typo in the code (missing the "w" from new):

 var forecastImpactLineChart = new Chart(ctxLineChart).Line(lineChartData);
gavgrif
  • 15,194
  • 2
  • 25
  • 27