init

.gitignore

@@ -0,0 +1 @@
+bower_components

README.md

@@ -0,0 +1,49 @@
+
+## About
+
+ngECharts - A simple AngularJS directive for beautiful responsive [ECharts](http://echarts.baidu.com/doc/example-en.html)
+
+**Requirement**:
+
+* AngularJS 1.x
+* ECharts 2.x
+
+## Why ECharts?
+It's one of the most powerful and beautiful charts on the Internet ( [See examples](http://echarts.baidu.com/doc/example-en.html) ). 
+
+More importantly, it's FREE! Both personal projects **and commercial** ones.
+
+
+## Demo
+
+
+
+## Get started
+
+### Install with Bower
+
+```
+$ bower install ngecharts --save
+```
+
+### Usage
+
+Add *Angular*, *ECharts* and *ngECharts* to your page
+
+```
+<script src="bower_components/angular/angular.min.js"></script>
+<script src="bower_components/echarts/build/dist/echarts-all.js"></script>
+<script src="bower_components/ngecharts/dist/ngecharts.min.js"></script>
+```
+
+Add 'ngecharts' module to your Angular app
+
+```
+var app = angular.module('app', ['ngecharts']);
+```
+
+That's it! Now you can start creating beautiful charts :)
+
+## License
+
+MIT

bower.json

@@ -0,0 +1,31 @@
+{
+  "name": "ngECharts",
+  "homepage": "https://github.com/gudh/ngECharts",
+  "main": [
+    "./dist/ngecharts.js"
+  ],
+  "authors": [
+    "gudh"
+  ],
+  "description": "using ECharts with Angular.js",
+  "main": "",
+  "moduleType": [],
+  "keywords": [
+    "angular",
+    "angularjs",
+    "echarts",
+    "charts"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "devDependencies": {
+    "echarts": "~2.x",
+    "angular": "~1.x"
+  }
+}

dist/ngecharts.js

@@ -0,0 +1,45 @@
+(function () {
+    'use strict';
+
+    var app = angular.module('ngecharts', [])
+    app.directive('echarts', ['$window', function ($window) {
+        return {
+            restrict: 'EA',
+            template: '<div></div>',
+            scope: {
+                options: '=options'
+            },
+            link: buildLinkFunc($window)
+        };
+    }]);
+
+    function buildLinkFunc($window) {
+        return function (scope, ele, attrs) {
+            var chart, options;
+            chart = echarts.init(ele[0], 'macarons'); 
+
+            createChart(scope.options);
+
+            function createChart(options) {
+                if (!options) return;
+
+                chart.setOption(options); 
+                // scope.$emit('create', chart);
+
+                angular.element($window).bind('resize', function(){
+                    chart.resize();
+                });
+
+            }
+
+            scope.$watch('options', function (newVal, oldVal) {
+                if (angular.equals(newVal, oldVal)) return;
+                createChart(newVal);
+            })
+
+
+        };
+    }
+
+})(); 
+

ngecharts.js

@@ -0,0 +1,45 @@
+(function () {
+    'use strict';
+
+    var app = angular.module('ngecharts', [])
+    app.directive('echarts', ['$window', function ($window) {
+        return {
+            restrict: 'EA',
+            template: '<div></div>',
+            scope: {
+                options: '=options'
+            },
+            link: buildLinkFunc($window)
+        };
+    }]);
+
+    function buildLinkFunc($window) {
+        return function (scope, ele, attrs) {
+            var chart, options;
+            chart = echarts.init(ele[0], 'macarons'); 
+
+            createChart(scope.options);
+
+            function createChart(options) {
+                if (!options) return;
+
+                chart.setOption(options); 
+                // scope.$emit('create', chart);
+
+                angular.element($window).bind('resize', function(){
+                    chart.resize();
+                });
+
+            }
+
+            scope.$watch('options', function (newVal, oldVal) {
+                if (angular.equals(newVal, oldVal)) return;
+                createChart(newVal);
+            })
+
+
+        };
+    }
+
+})(); 
+