@@ -700,89 +700,52 @@ SocioboardApp.controller('FbpagedetreportController', function ($rootScope, $sco
700
700
$scope . totalfbLikes = function ( days ) {
701
701
702
702
$scope . generateChartforlikes ( days ) ;
703
-
704
-
705
- //var chart = AmCharts.makeChart("rate_activity", {
706
- // "theme": "light",
707
- // "color": "#cccc00",
708
- // "type": "serial",
709
- // "startDuration": 2,
710
- // "legend": {
711
- // "useGraphSettings": true
712
- // },
713
- // "dataProvider": $scope.chartlikes,
714
- // "valueAxes": [{
715
- // "inside": true,
716
- // "axisAlpha": 0,
717
- // "color": "#8533ff"
718
- // }],
719
- // "graphs": [{
720
- // "balloonText": "[[category]]: <b>[[value]]</b>",
721
- // "fillColorsField": "color",
722
- // "fillAlphas": 1,
723
- // "lineAlpha": 0.1,
724
- // "type": "column",
725
- // "valueField": "totalLikes",
726
- // "color": "#FF9E01"
727
- // }],
728
- // "depth3D": 20,
729
- // "angle": 30,
730
- // "chartCursor": {
731
- // "categoryBalloonEnabled": false,
732
- // "cursorAlpha": 0,
733
- // "zoomable": true,
734
- // "color": "#FF9E01"
735
- // },
736
- // "categoryField": "date",
737
- // "categoryAxis": {
738
- // "gridPosition": "start",
739
- // "labelRotation": 90,
740
- // "color": "#ff3377",
741
- // "parseDates": true,
742
- // },
743
- // "export": {
744
- // "enabled": true
745
- // }
746
-
747
- //});
748
- var chart = AmCharts . makeChart ( "rate_activity" , {
749
- "theme" : "light" ,
750
- "type" : "serial" ,
751
- "startDuration" : 2 ,
752
- "legend" : {
753
- "useGraphSettings" : true
754
- } ,
755
- "dataProvider" : $scope . chartlikes ,
756
- "valueAxes" : [ {
757
- "inside" : true ,
758
- "axisAlpha" : 0
759
- } ] ,
760
- "graphs" : [ {
761
- "balloonText" : "[[category]]: <b>[[value]]</b>" ,
762
- "fillColorsField" : "color" ,
763
- "fillAlphas" : 1 ,
764
- "lineAlpha" : 0.1 ,
765
- "type" : "column" ,
766
- "valueField" : "totalLikes"
767
- } ] ,
768
- "depth3D" : 20 ,
769
- "angle" : 30 ,
770
- "chartCursor" : {
771
- "categoryBalloonEnabled" : false ,
772
- "cursorAlpha" : 0 ,
773
- "zoomable" : true
774
- } ,
775
- "categoryField" : "date" ,
776
- "categoryAxis" : {
777
- "gridPosition" : "start" ,
778
- "labelRotation" : 90 ,
779
- "parseDates" : true ,
780
- } ,
781
- "export" : {
782
- "enabled" : true
783
- }
784
-
785
- } ) ;
703
+ am4core . useTheme ( am4themes_animated ) ;
704
+ var chart = am4core . create ( "rate_activity" , am4charts . XYChart ) ;
705
+ chart . data = $scope . chartlikes ;
706
+ chart . exporting . menu = new am4core . ExportMenu ( ) ;
707
+ // Set input format for the dates
708
+ chart . dateFormatter . inputDateFormat = "yyyy-MM-dd" ;
709
+
710
+ // Create axes
711
+ var dateAxis = chart . xAxes . push ( new am4charts . DateAxis ( ) ) ;
712
+ var valueAxis = chart . yAxes . push ( new am4charts . ValueAxis ( ) ) ;
713
+
714
+ // Create series
715
+ var series = chart . series . push ( new am4charts . LineSeries ( ) ) ;
716
+ series . dataFields . valueY = "totalLikes" ;
717
+ series . dataFields . dateX = "date" ;
718
+ series . tooltipText = "{value}"
719
+ series . strokeWidth = 2 ;
720
+ series . minBulletDistance = 15 ;
721
+
722
+ // Drop-shaped tooltips
723
+ series . tooltip . background . cornerRadius = 20 ;
724
+ series . tooltip . background . strokeOpacity = 0 ;
725
+ series . tooltip . pointerOrientation = "vertical" ;
726
+ series . tooltip . label . minWidth = 40 ;
727
+ series . tooltip . label . minHeight = 40 ;
728
+ series . tooltip . label . textAlign = "middle" ;
729
+ series . tooltip . label . textValign = "middle" ;
730
+ series . tooltipText = "{dateX}: [bold]{valueY}" ;
731
+
732
+ var bullet = series . bullets . push ( new am4charts . CircleBullet ( ) ) ;
733
+ bullet . circle . strokeWidth = 2 ;
734
+ bullet . circle . radius = 4 ;
735
+ bullet . circle . fill = am4core . color ( "#fff" ) ;
736
+
737
+ var bullethover = bullet . states . create ( "hover" ) ;
738
+ bullethover . properties . scale = 1.3 ;
739
+ chart . cursor = new am4charts . XYCursor ( ) ;
740
+ chart . cursor . behavior = "panXY" ;
741
+ chart . cursor . xAxis = dateAxis ;
742
+ chart . cursor . snapToSeries = series ;
743
+ chart . scrollbarY = new am4core . Scrollbar ( ) ;
744
+ chart . scrollbarY . parent = chart . leftAxesContainer ;
745
+ chart . scrollbarY . toBack ( ) ;
746
+ chart . scrollbarX = new am4charts . XYChartScrollbar ( ) ;
747
+ chart . scrollbarX . series . push ( series ) ;
748
+ chart . scrollbarX . parent = chart . bottomAxesContainer ;
786
749
}
787
750
788
751
$scope . generateChartforlikes = function ( days ) {
@@ -816,48 +779,35 @@ SocioboardApp.controller('FbpagedetreportController', function ($rootScope, $sco
816
779
817
780
$scope . generateChartTotalFan ( days ) ;
818
781
// 3d graph start
819
- var chart = AmCharts . makeChart ( "FBTotalFans" , {
820
- "theme" : "light" ,
821
- "type" : "serial" ,
822
- "startDuration" : 2 ,
823
- "dataProvider" : $scope . rep ,
824
- "valueAxes" : [ {
825
- "position" : "left" ,
826
- "axisAlpha" : 0 ,
827
- "gridAlpha" : 0
828
- } ] ,
829
- "graphs" : [ {
830
- "balloonText" : "<span style='font-size:13px;'>[[category]]: <b>[[value]]</b></span>" ,
831
- "bulletOffset" : 10 ,
832
- "bulletSize" : 52 ,
833
- "colorField" : "colors" ,
834
- "cornerRadiusTop" : 8 ,
835
- "customBulletField" : "profilepic" ,
836
- "fillAlphas" : 0.8 ,
837
- "lineAlpha" : 0 ,
838
- "type" : "column" ,
839
- "valueField" : "totalfans"
840
- } ] ,
841
- "depth3D" : 40 ,
842
- "angle" : 30 ,
843
- "chartCursor" : {
844
- "categoryBalloonEnabled" : false ,
845
- "cursorAlpha" : 0 ,
846
- "zoomable" : false
847
- } ,
848
- "categoryField" : "facebookPagename" ,
849
- "categoryAxis" : {
850
- "gridPosition" : "start" ,
851
- "axisAlpha" : 0 ,
852
- "gridAlpha" : 0 ,
853
-
854
- } ,
855
- "export" : {
856
- "enabled" : true ,
857
- // "position": "bottom-right"
782
+ am4core . useTheme ( am4themes_animated ) ;
783
+ var chart = am4core . create ( "FBTotalFans" , am4charts . XYChart ) ;
784
+ chart . data = $scope . rep ;
785
+ chart . exporting . menu = new am4core . ExportMenu ( ) ;
786
+ var categoryAxis = chart . xAxes . push ( new am4charts . CategoryAxis ( ) ) ;
787
+ categoryAxis . dataFields . category = "facebookPagename" ;
788
+ categoryAxis . renderer . grid . template . location = 0 ;
789
+ categoryAxis . renderer . minGridDistance = 30 ;
790
+
791
+ categoryAxis . renderer . labels . template . adapter . add ( "dy" , function ( dy , target ) {
792
+ if ( target . dataItem && target . dataItem . index & 2 == 2 ) {
793
+ return dy + 25 ;
858
794
}
795
+ return dy ;
796
+ } ) ;
797
+
798
+ var valueAxis = chart . yAxes . push ( new am4charts . ValueAxis ( ) ) ;
799
+
800
+ // Create series
801
+ var series = chart . series . push ( new am4charts . ColumnSeries ( ) ) ;
802
+ series . dataFields . valueY = "totalfans" ;
803
+ series . dataFields . categoryX = "facebookPagename" ;
804
+ series . name = "Visits" ;
805
+ series . columns . template . tooltipText = "{categoryX}: [bold]{valueY}[/]" ;
806
+ series . columns . template . fillOpacity = .8 ;
859
807
860
- } , 0 ) ;
808
+ var columnTemplate = series . columns . template ;
809
+ columnTemplate . strokeWidth = 2 ;
810
+ columnTemplate . strokeOpacity = 1 ;
861
811
//3d graph end
862
812
}
863
813
0 commit comments