Skip to content

Commit 2f55dc5

Browse files
Socioboard 3.0.57
1 parent cd77090 commit 2f55dc5

File tree

7 files changed

+1302
-1471
lines changed

7 files changed

+1302
-1471
lines changed

.vs/Socioboard/v14/.suo

12.5 KB
Binary file not shown.

src/Socioboard/Themes/Socioboard/Views/Home/Index.cshtml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -166,6 +166,9 @@
166166
<script src="../contents/socioboard/global/plugins/amcharts/amcharts/amcharts.js"></script>
167167
@*<script type="text/javascript" src="~/contents/socioboard/global/plugins/datatables/media/js/jquery.dataTables.min.js"></script>*@
168168
@*<script type="text/javascript" src="~/contents/socioboard/js/admin/plugins/chartist-js/chartist.min.js"></script>*@
169+
<script src="https://www.amcharts.com/lib/4/core.js"></script>
170+
<script src="https://www.amcharts.com/lib/4/charts.js"></script>
171+
<script src="https://www.amcharts.com/lib/4/themes/animated.js"></script>
169172
<script type="text/javascript">
170173
171174

src/Socioboard/wwwroot/contents/socioboard/controllers/facebookreportcontroller.js

Lines changed: 503 additions & 551 deletions
Large diffs are not rendered by default.

src/Socioboard/wwwroot/contents/socioboard/controllers/fbpagedetreportcontroller.js

Lines changed: 73 additions & 123 deletions
Original file line numberDiff line numberDiff line change
@@ -700,89 +700,52 @@ SocioboardApp.controller('FbpagedetreportController', function ($rootScope, $sco
700700
$scope.totalfbLikes = function (days) {
701701

702702
$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;
786749
}
787750

788751
$scope.generateChartforlikes = function (days) {
@@ -816,48 +779,35 @@ SocioboardApp.controller('FbpagedetreportController', function ($rootScope, $sco
816779

817780
$scope.generateChartTotalFan(days);
818781
// 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;
858794
}
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;
859807

860-
}, 0);
808+
var columnTemplate = series.columns.template;
809+
columnTemplate.strokeWidth = 2;
810+
columnTemplate.strokeOpacity = 1;
861811
//3d graph end
862812
}
863813

0 commit comments

Comments
 (0)