Google Calendar Orderby при использовании двух запросов linq - PullRequest
Новая
       11

Google Calendar Orderby при использовании двух запросов linq

1 голос
/ 27 марта 2019

Я использую диаграммы Google для отображения столбчатой ​​диаграммы с накоплением. Я использую Entity Framework и LINQ запросы для сбора моих данных из БД.

Проблемы, с которыми я сталкиваюсь:

  1. что он не упорядочит график. Я заказал диаграмму, но ось X остается неупорядоченной. Это можно сделать с помощью запроса linq или я могу сделать это в скрипте?

  2. В настоящее время отображаются только значения оси X для данных, которые у меня есть. Например, на оси X у меня есть номер месяца, но он отображает отметки только для данных, которые я имею, например 1,4,5,6. Можно ли включить цифры от 1 до 12, хотя для этого конкретного номера месяца нет данных?

Код: 

   #region Total Hours Per Month sick

        var querythpshols = (from r in db.HolidayRequestForms
                             where (r.StartDate) >= dateAndTime
                             group r by r.MonthOfHoliday into g                              
                             select new { Value = g.Key, Count = g.Sum(h => h.HoursTaken)});


        var resultthpshols = querythpshols.ToList();



        var datachartthpshols = new object[resultthpshols.Count];
        int G = 0;
        foreach (var i in resultthpshols)
        {
            datachartthpshols[G] = new object[] { i.Value.ToString(), i.Count };
            G++;
        }
        string datathpshols = JsonConvert.SerializeObject(datachartthpshols, Formatting.None);
        ViewBag.datajthpshols = new HtmlString(datathpshols);

        #endregion

        #region Total Hours Per Month
        var querythpshols1 = (from r in db.HolidayRequestForms
                              where (r.StartDate) <= dateAndTime
                              group r by r.MonthOfHoliday into g                 
                              select new { Value = g.Key, Count1 = g.Sum(r => r.HoursTaken) })
                               ;

        var resultthpshols1 = querythpshols1.ToList();

        var datachartthpshols1 = new object[resultthpshols1.Count];
        int P = 0;
        foreach (var i in resultthpshols1)
        {
            datachartthpshols1[P] = new object[] { i.Value.ToString(), i.Count1 };
            P++;
        }
        string datathpshols1 = JsonConvert.SerializeObject(datachartthpshols1, Formatting.None);
        ViewBag.datajthpshols1 = new HtmlString(datathpshols1);

        #endregion

Сценарий: 

    @*TOTAL HOURS PER MONTH CHART*@
<scipt>
    <script>
        var datathpshols = '@ViewBag.datajthpshols';
        var datassthpshols = JSON.parse(datathpshols);

        var datathpshols1 = '@ViewBag.datajthpshols1';
        var datassthpshols1 = JSON.parse(datathpshols1);

    </script>



    <script type="text/javascript">

        // Load the Visualization API and the corechart package.
        google.charts.load('current', { 'packages': ['corechart'] });

        // Set a callback to run when the Google Visualization API is loaded.
        google.charts.setOnLoadCallback(drawChartA);

        // Callback that creates and populates a data table,
        // instantiates the pie chart, passes in the data and
        // draws it.
        function drawChartA() {

            // Create the data table.

            var data1 = new google.visualization.DataTable();
            data1.addColumn('string', 'Value');
            data1.addColumn('number', 'Holiday Hours Booked');
            data1.addRows(datassthpshols);

            var data2 = new google.visualization.DataTable();
            data2.addColumn('string', 'Value');
            data2.addColumn('number', 'Holiday Hours Taken');
            data2.addRows(datassthpshols1);

            var joinedData = google.visualization.data.join(data1, data2, 'full', [[0, 0]], [1], [1]);


            // Set chart options
            var options = {
                'title': 'Holiday Hours Taken Per Month',
                'width': 600,
                'height': 350,
                'hAxis': { title: 'Month Number' },
                'vAxis': { title: 'Holiday Hours Taken' },
                'is3D': true,
                'isStacked': true,
                'legend': 'right'
            };

            // Instantiate and draw our chart, passing in some options.
            var chart = new google.visualization.ColumnChart(document.getElementById('chartTHPShols_div'));
            chart.draw(joinedData, options);
        }
    </script>

1 Ответ

1 голос
/ 27 марта 2019

1) Используйте метод таблицы данных -> sort - для упорядочения оси X. 

joinedData.sort([{column: 0}]);

2) строк создает дискретную ось и отображает только доступные данные. числа создают непрерывную ось и обеспечивают большую гибкость для отметок оси. Вероятно, наиболее простым решением было бы использование представления данных для преобразования оси X в числа. (используйте представление данных, чтобы нарисовать диаграмму) 

var joinedData = google.visualization.data.join(data1, data2, 'full', [[0, 0]], [1], [1]);
var dataView = new google.visualization.DataView(joinedData);
dataView.setColumns([{
  calc: function (dt, row) {
    return parseFloat(dt.getValue(row, 0));
  },
  label: joinedData.getColumnLabel(0),
  type: 'number'
}, 1, 2]);
chart.draw(dataView, options);
...