Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen gezeigt.

Link zu der Vergleichsansicht

Beide Seiten, vorherige Überarbeitung Vorherige Überarbeitung
Nächste Überarbeitung
Vorherige Überarbeitung
playground:playground [2019/03/31 18:28]
marcel.pietschmann
playground:playground [2019/04/04 18:38] (aktuell)
marcel.pietschmann
Zeile 2: Zeile 2:
  
 <​chartjs>​ <​chartjs>​
 +var ctx = document.getElementById('​myChart'​);​
 +var myChart = new Chart(ctx, {
 +   type: '​line',​
 +   data: {
 +      labels: [2013,​2014,​2015,​2016,​2017,​2018,​2019],​
 +      datasets: [{
 +         ​label:​ "​Preis-Quote",​
 +         fill: false,
 +         ​borderColor:​ "#​3e95cd",​
 +         ​showLine:​ true,
 +         ​yAxisID:​ '​B',​
 +         data: [0.41, 0.45, 0.42, 0.35, 0.24, 0.22, 0.32]
 +      }, {
 +         ​label:​ "​Teilnehmeranzahl",​
 +         fill: false,
 +         ​borderColor:​ "#​f4d442",​
 +         ​showLine:​ true,
 +         ​yAxisID:​ '​A',​
 +         data: [346,​416,​401,​409,​460,​469,​474]
 +      }, {
 +         ​label:​ "1. Preis",​
 +         fill: false,
 +         ​borderColor:​ "#​345fe2",​
 +         ​showLine:​ true,
 +         ​yAxisID:​ '​A',​
 +         data: [,,,,,,46]
 +      }, {
 +         ​label:​ "2. Preis",​
 +         fill: false,
 +         ​borderColor:​ "#​a834e2",​
 +         ​showLine:​ true,
 +         ​yAxisID:​ '​A',​
 +         data: [,,,,,,48]
 +      }, {
 +         ​label:​ "3. Preis",​
 +         fill: false,
 +         ​borderColor:​ "#​e23479",​
 +         ​showLine:​ true,
 +         ​yAxisID:​ '​A',​
 +         data: [,,,,,,56]
 +      }]
 +   },
 +   ​options:​ {
 +      responsive: true,
 +      scales: {
 +      xAxes: [{
 +           ​position:​ '​bottom',​
 +           ​gridLines:​ {
 +             ​zeroLineColor:​ "​rgba(0,​255,​0,​1)"​
 +           },
 +           ​scaleLabel:​ {
 +             ​display:​ true,
 +             ​labelString:​ '​Jahr'​
 +           }
 +         }],
 +      yAxes: [{
 +        id: '​A',​
 +        type: '​linear',​
 +        position: '​left',​
 +      }, {
 +        id: '​B',​
 +        type: '​linear',​
 +        position: '​right',​
 +        gridLines: false,
 +        ticks: {
 +          max: 1,
 +          min: 0
 +        }
 +      }]
 +    }
 +   }
 +});
 +</​chartjs>​