JSFiddle - React, Tailwind, and code Playground

by Trufa

HTML

<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="https://raw.github.com/flot/flot/master/jquery.flot.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
<div ng-app='App'>
    <div ng-controller='Ctrl'>
        <chart ng-model='data'>        
        </chart>
    </div>
</div>

CSS

chart{
    display:none;
    width:400px;
    height:200px;
}

JavaScript

var App = angular.module('App', []);

App.controller('Ctrl', function($scope) {
    $scope.data = [[[0, 1], [1, 5], [2, 2]]];
});

App.directive('chart', function() {
    return {
        restrict: 'E',
        link: function(scope, elem, attrs) {
            var data = scope[attrs.ngModel];
            $.plot(elem, data, {});
            elem.show();
        }
    };
});