Chartjs-Diplay barchart in a <div>

by

1👍

✅

Hint: Don’t access the DOM in the constructor of your element. There are lifecycle methods like ready, domReady, and attached() where you can be certain that the DOM is prepared.

<div id="chartWrapper" class="chart">
  **// The chart should be displayed here**
</div>

@CustomTag('main-app')
class MainApp extends PolymerElement {

  MainApp.created() : super.created();

  void chartdemo(Event e, var detail, Node target) {

  }

  @override
  void attached() {
    super.attached();
    initChart();
  }

  void initChart() {
    Bar bar = new Bar({
        'labels' : ["A","B","C"],
        'datasets' : [
            {
                'fillColor' : "rgba(220,220,220,0.5)",
                'strokeColor' : "rgba(220,220,220,1)",
                'data' : [65,59,90]
            },
        ]

    }, null);

    DivElement container3 = new DivElement();
    container3.style.height ='200px';
    container3.style.width =  '200px';
    $['chartWrapper'].append(container3);
    bar.show(container3);
  }
}

Caution: code not tested

Leave a comment