Показаны буквы вместо лет ⇐ C#

[Anonymous]

Код: Выделить всё

            var cantidadEmpleadosContratadosPorAno = empleados
.GroupBy(empleado => empleado.FechaContratacion.Year)
.OrderBy(grupo => grupo.Key)
.Select(grupo => new {
AnoContratacion = grupo.Key,
CantidadContratados = grupo.Count()
})
.ToList();

Я программирую диаграмму, показывающую количество сотрудников, нанятых на определенную дату (год) из DateTime, например:

Код: Выделить всё

new Empleado { IdEmpleado = 1, Nombre = "John Doe", Departamento = "Ingeniería", Posicion = "Ingeniero de Software", AñosExperiencia = 5, Edad = 30, Salario = 75000, NivelSatisfaccion = 0.8, CalificacionDesempeno  = 4.5, HorasTrabajo = 40, FechaContratacion = DateTime.Parse("2018-05-15") }

но на диаграмме показаны только отделы, а не годы, и я понятия не имею, почему это происходит.
Код для диаграммы:

Код: Выделить всё

        const fechaContratacion = JSON.parse('@Html.Raw(ViewBag.FechaContratacion)'); // Lista de años
const cantidadEmpleados = JSON.parse('@Html.Raw(ViewBag.CantidadEmpleados)');  // Lista de cantidades

const opcionesGraficoCantidadEmpleadosContratadosPorAños = {
series: [{
name: "Cantidad Empleados",
data: cantidadEmpleados
}],
chart: {
height: 350,
type: 'line',
zoom: {
enabled: false
}
},
dataLabels: {
enabled: false
},
stroke: {
curve: 'straight'
},
title: {
text: 'Cantidad de Empleados por Año',
align: 'left'
},
grid: {
row: {
colors: ['#f3f3f3', 'transparent'],
opacity: 0.5
},
},
xaxis: {
categories: fechaContratacion, // Asegurarse de usar los años como categorías en el eje X
title: {
text: 'Años'
}
},
yaxis: {
title: {
text: 'Cantidad de Empleados'
}
}
};

var graficoCantidadEmpleadosContratadosPorAños = new ApexCharts(
document.querySelector("#graficoCantidadEmpleadosContratadosPorAños"),
opcionesGraficoCantidadEmpleadosContratadosPorAños
);

graficoCantidadEmpleadosContratadosPorAños.render();

Идея состоит в том, чтобы показать диаграмму, на которой вы видите количество сотрудников, нанятых за определенный год, по дате и времени, а по оси X вы должны видеть годы, а не отдел, но по какой-то причине я показываю отдел и попросил GPT о помощи, но для этого ИИ все выглядит правильно, и я понятия не имею, что делать.
Это HTML-представление, в котором я' Представляю свою диаграмму:

Код: Выделить всё

@{
ViewData["Title"] = "Dashboard";
}





































.card {
padding: 10px;
margin: 20px;
}



document.addEventListener("DOMContentLoaded", function () {
const departamentos = @Html.Raw(ViewBag.Departamentos);
const promedioDesempeno = @Html.Raw(ViewBag.PromedioDesempeno);
const promedioSatisfaccion = @Html.Raw(ViewBag.PromedioSatisfaccion);
const puntajeDesempeno = @Html.Raw(ViewBag.PuntajeDesempeno);
const puntajeSatisfaccion = @Html.Raw(ViewBag.PuntajeSatisfaccion);
// Extraemos los datos del ViewBag para el gráfico
const data = @Html.Raw(ViewBag.CantidadEmpleados);
//Promedio de salario por departamento
const prromedioSalarioPorDepartamento = @Html.Raw(ViewBag.PromedioSalarioPorDepartamento);

const configuracionGraficoPromedioDesemepenoSatisfaccion = {
chart: {
type: 'radar'
},
series: [
{
name: 'Desempeño Promedio',
data: promedioDesempeno
},
{
name: 'Satisfacción Promedio',
data: promedioSatisfaccion
}
],
labels:  departamentos,
title: {
text: 'Comparación de Desempeño y Satisfacción Promedio por Departamento'
}
}

const graficoPromedioDesemepenoSatisfaccion = new ApexCharts(document.getElementById("graficoPromedioDesemepenoSatisfaccion"), configuracionGraficoPromedioDesemepenoSatisfaccion);
graficoPromedioDesemepenoSatisfaccion.render();

const configuracionGraficoPuntajeDesemepenoSatisfaccion = {
chart: {
type: 'bar'
},
series: [
{
name: 'Desempeño',
data: puntajeDesempeno.map(e => e.toFixed(2))
},
{
name: 'Satisfacción',
data: puntajeSatisfaccion.map(e => e.toFixed(2))
}
],
xaxis: {
categories: departamentos
},
title: {
text: 'Comparación puntaje de Desempeño y Satisfacción por Departamento'
}
}

const graficoPuntajeDesemepenoSatisfaccion = new ApexCharts(
document.getElementById('graficoPuntajeDesemepenoSatisfaccion'),
configuracionGraficoPuntajeDesemepenoSatisfaccion);

graficoPuntajeDesemepenoSatisfaccion.render();

// Configuración para el treemap de cantidad de empleados por departamento
const options = {
chart: {
type: 'treemap',
height: 350
},
title: {
text: 'Cantidad de Empleados por Departamento'
},
series: [{
data: data
}],
legend: {
show: true
}
};

// Renderizar el gráfico
const chart = new ApexCharts(document.getElementById("chart"), options);
chart.render();

//Promedio de salario con por departamento
const configuracionPromedioSalarioPorDepartamento = {

chart: {
type: 'pie'
},
series: prromedioSalarioPorDepartamento,
labels: departamentos,
title: {
text: "Salario Promedio por departamento"
}

};
const graficoPromedioSalarioPorDepartamento = new ApexCharts(document.getElementById("graficoPromedioSalarioPorDepartamento"), configuracionPromedioSalarioPorDepartamento);
graficoPromedioSalarioPorDepartamento.render();

//el promedio de años de experiencia por posición
// Cargamos los datos desde ViewBag
const posiciones = @Html.Raw(ViewBag.Posicion);
const promedioAniosExperiencia = @Html.Raw(ViewBag.PromedioPorPosicion);

// Configuración del gráfico
const opcionesGraficoPromedioAnosExperienciaPorPosicion = {
chart: {
type: 'bar'
},
series: [
{
name: 'Años de experiencia',
data: promedioAniosExperiencia // Usamos los promedios
},
],
xaxis: {
categories: posiciones // Usamos las posiciones en el eje X
},
title: {
text: 'Promedio de años de experiencia por posición'
}
};

// Creación y renderizado del gráfico
const graficoPromedioAnosExperienciaPorPosicion = new ApexCharts(
document.getElementById('GraficoPromedioAnosExperienciaPorPosicion'),
opcionesGraficoPromedioAnosExperienciaPorPosicion
);

graficoPromedioAnosExperienciaPorPosicion.render();

const fechaContratacion = JSON.parse('@Html.Raw(ViewBag.FechaContratacion)'); // Lista de años
const cantidadEmpleados = JSON.parse('@Html.Raw(ViewBag.CantidadEmpleados)');  // Lista de cantidades

const opcionesGraficoCantidadEmpleadosContratadosPorAños = {
series: [{
name: "Cantidad Empleados",
data: cantidadEmpleados
}],
chart: {
height: 350,
type: 'line',
zoom: {
enabled: false
}
},
dataLabels: {
enabled: false
},
stroke: {
curve: 'straight'
},
title: {
text: 'Cantidad de Empleados por Año',
align: 'left'
},
grid: {
row: {
colors: ['#f3f3f3', 'transparent'],
opacity: 0.5
},
},
xaxis: {
categories: fechaContratacion, // Asegurarse de usar los años como categorías en el eje X
title: {
text: 'Años'
}
},
yaxis: {
title: {
text: 'Cantidad de Empleados'
}
}
};

var graficoCantidadEmpleadosContratadosPorAños = new ApexCharts(
document.querySelector("#graficoCantidadEmpleadosContratadosPorAños"),
opcionesGraficoCantidadEmpleadosContratadosPorAños
);

graficoCantidadEmpleadosContratadosPorAños.render();

})

Если я не ошибаюсь, я использую ViewData, содержащую годы потому что я указал «.Year», когда сгруппировал их в контроллере, но по какой-то причине он показывает мне отделы вместо лет, и количество сотрудников правильное (я думаю), но годы не отображаются в виде меток по оси X, Я знаю, что в этом AnoContratacion хранятся годы, потому что я пробовал связывать места, использовать их в качестве данных вместо cantidadEmpleados, и они показывали мне годы вместо отделов компании (не реальной компании), но когда я вернул их в категории по оси X. они показаны как отделы, и я целый день пытался решить эту проблему.

Подробнее здесь: https://stackoverflow.com/questions/791 ... d-of-years