first commit, version stable

bitliner · bitliner · commit a58160002f92 · 2013-02-23T16:41:00.000+01:00
diff --git a/angular-chart.js b/angular-chart.js
@@ -0,0 +1,97 @@
+angular.module('AngularChart', []).directive('chart', function () {
+    return {
+        restrict:'E',
+        template:'<div></div>',
+        transclude:true,
+        replace:true,
+        scope: '=',
+        link:function (scope, element, attrs) {
+            console.log('oo',attrs,scope[attrs.formatter])
+            var opt = {
+                chart:{
+                    renderTo:element[0],
+                    type:'line',
+                    marginRight:130,
+                    marginBottom:40
+                },
+                title:{
+                    text:attrs.title,
+                    x:-20 //center
+                },
+                subtitle:{
+                    text:'by top K pattern',
+                    x:-20
+                },
+                xAxis:{
+                    //categories:['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+                    tickInterval:1,
+                    title:{
+                        text:attrs.xname
+                    }
+                },
+                plotOptions:{
+                    lineWidth:0.5
+                },
+                yAxis:{
+                    title:{
+                        text:attrs.yname
+                    },
+                    tickInterval:(attrs.yinterval)?new Number(attrs.yinterval):null,
+                    max:attrs.ymax,
+                    min: attrs.ymin
+//                    ,
+//                    plotLines:[
+//                        {
+//                            value:0,
+//                            width:1,
+//                            color:'#808080'
+//                        }
+//                    ]
+                },
+                tooltip:{
+                    formatter:scope[attrs.formatter]||function () {
+                        return '<b>' + this.y + '</b>'
+                    }
+                },
+                legend:{
+                    layout:'vertical',
+                    align:'right',
+                    verticalAlign:'top',
+                    x:-10,
+                    y:100,
+                    borderWidth:0
+                },
+                series:[
+                    {
+                        name:'Tokyo',
+                        data:[7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
+                    }
+                ]
+            }
+
+
+            //Update when charts data changes
+            scope.$watch(function (scope) {
+                return JSON.stringify({
+                    xAxis:{
+                        categories:scope[attrs.xdata]
+                        },
+                    series:scope[attrs.ydata]
+                });
+            }, function (news) {
+                console.log('ola')
+//                if (!attrs) return;
+                news = JSON.parse(news)
+                if (!news.series)return;
+                angular.extend(opt,news)
+                console.log('opt.xAxis.title.text',opt)
+                
+
+
+
+                var chart = new Highcharts.Chart(opt);
+            });
+        }
+    }
+
+})
diff --git a/examples/data/line-chart.json b/examples/data/line-chart.json
@@ -0,0 +1,13 @@
+{"xData": ["Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],"yData":[{
+                "name": "Tokyo",
+                "data": [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
+            }, {
+                "name": "New York",
+                "data": [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
+            }, {
+                "name": "Berlin",
+                "data": [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
+            }, {
+                "name": "London",
+                "data": [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
+                }]}
diff --git a/examples/index.html b/examples/index.html
@@ -0,0 +1,21 @@
+<html ng-app="AngularChartExample">
+<head>
+	<title>Charts Directives - AngularJs</title>
+
+	
+</head>
+<body>
+
+	<div ng-view></div>
+
+	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.js"></script>
+	
+	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
+	<script type="text/javascript" src="http://code.highcharts.com/highcharts.src.js"></script>
+
+	<script type="text/javascript" src="../angular-chart.js"></script>
+	<script type="text/javascript" src="js/controller.js"></script>
+	<script type="text/javascript" src="js/app.js"></script>
+
+</body>
+</html>
diff --git a/examples/js/app.js b/examples/js/app.js
@@ -0,0 +1,6 @@
+angular.module('AngularChartExample',['AngularChart'], function( $routeProvider, $locationProvider ){
+	$routeProvider.when('/',{
+		templateUrl: './views/charts.html',
+		controller: MainCtrl
+		})
+	})
diff --git a/examples/js/controller.js b/examples/js/controller.js
@@ -0,0 +1,7 @@
+function MainCtrl($scope, $http){
+	console.log('ciao')
+	$http.get('data/line-chart.json').success(function(result){
+		$scope.lineChartYData=result.yData
+		$scope.lineChartXData=result.xData
+		})
+}
diff --git a/examples/views/charts.html b/examples/views/charts.html
@@ -0,0 +1,3 @@
+<h1>Line chart</h1>
+<chart title="Line chart example" xData="lineChartXData" yData="lineChartYData" xName="Month" yName="Hit"></chart>
+<!-- yInterval, yMin, yMax, subtitle -->

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+<h1>Line chart</h1>`
	`2`	`+<chart title="Line chart example" xData="lineChartXData" yData="lineChartYData" xName="Month" yName="Hit"></chart>`
	`3`	`+<!-- yInterval, yMin, yMax, subtitle -->`