Pop

44.Aplicaciones web.Objeto Chart. Curso de C# con Visual Studio 2017.

44-.Aplicaciones web.Objeto Chart

   - En este capítulo del curso de programación en c# con visual studio 2017,vamos a ver un control de uso común en muchas de las páginas web que utilizamos habitualmente. Este control es el Chart, que es un componente que se utiliza para mostrar gráficos en pantalla de uan manera fácil.

 - El control de servidor Chart permite crear páginas ASP.NET que incluyan gráficos de análisis estadístico. Algunas de las  características  que admite el control Chart son las siguientes:
  • Series de datos, áreas de gráfico, ejes, leyendas, etiquetas y títulos.
  • Enlace de datos.
  • Manipulación de datos, como copiar, dividir, combinar, alinear, agrupar, ordenar, buscar y filtrar.
  • Fórmulas estadísticas y financieras.
  • Apariencia avanzada de los gráficos, como 3D, suavizado de contorno, iluminación y perspectiva.
- En el siguiente video os muestro como enlazar el control Chart  a un procedimiento almacenado de nuestra base de datos. Permite mostrar en pantalla gráficos enlazados a múltiples origenes de datos, en nuestra caso utilizamos nuestra base de datos de pruebas:


 - Os dejo un enlace a la página de Microsoft con más información este control:

- También os dejo el código de este ejemplo:

  • Procedimineto almacenado SQL con el que cargamos el control:
ALTER PROCEDURE [dbo].[DamePedidos]
   
AS
BEGIN

    SET NOCOUNT ON;
   
    SELECT Usuarios.Nombre, FechaPedido FROM Pedidos
    INNER JOIN Usuarios on Usuarios.IdUsuarios =Pedidos.IdUsuario

END

  •  Código de la página cliente aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="EjemploControlesVarios.aspx.cs" Inherits="GestionVarios.EjemploControlesVarios" %>

<%@ Register Assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI.DataVisualization.Charting" TagPrefix="asp" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">


        <div>
       
        <asp:Chart ID="Chart1" runat="server" DataSourceID="SqlDataSourcePedidos" BackColor="White" CssClass="auto-style1" Palette="Chocolate">
            <Series>
                <asp:Series Name="Series1" XValueMember="Nombre" YValueMembers="FechaPedido">
                </asp:Series>
            </Series>
            <ChartAreas>
                <asp:ChartArea Name="ChartArea1">
                </asp:ChartArea>
            </ChartAreas>
        </asp:Chart>
            <asp:SqlDataSource ID="SqlDataSourcePedidos" runat="server" ConnectionString="<%$ ConnectionStrings:EmpresaConnectionString %>" SelectCommand="DamePedidos" SelectCommandType="StoredProcedure"></asp:SqlDataSource>
          
     </div>

    </form>
</body>
</html>

  •  Código de servidor de la página:
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace GestionVarios
{
    public partial class EjemploControlesVarios : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            int x = Chart1.ChartAreas.Count;
         }
    }
}

No hay comentarios:

Publicar un comentario

Curso .NET Core en C# - 34.Creamos nuestro propio log

34.Creamos nuestro propio log Hola a todos. En este curso, analizaremos todos los conceptos básicos, intermedios y avanzados de  ASP.NET...