Jump to content

Recommended Posts

Salut,

Ce coup ci, rien à voir avec AutoCAD, juste un peu de géométrie.

J'ai voulu m'essayer un peu plus sérieusement à ASP .NET (de la programmation web "côté serveur") avec une nouvelle page sur gileCAD qui permet de déterminer les différents dimensions d'un arc de cercle en en spécifiant deux.

Côté "vue" (HTML/CSS), placer les composants sur une image depuis le CSS est presque aussi pénible faire une boite de dialogue en DCL. Le wysiwyg de Visual Studio ne fonctionne pas vraiment et j'ai du tout faire par tâtonnements. Je n'ai pu tester que sur Firefox et Edge (IE ne prends pas en charge certaines fonctionnalités  du CSS).

Côté "programme", j'étais bien plus à l'aise, on fait tout en C# .NET.

Gilles Chanteau - gileCAD -
Développements sur mesure pour AutoCAD
ADSK_Expert_Elite_Icon_S_Color_Blk_125.png

Link to post
Share on other sites

Bonjour,

Impressionnant, je ne connaissais pas cette possibilité avec ASP.

Je viens d'essayer sur Chrome, cela fonctionne aussi.

J'utilise l’élément html <canvas> pour dessiner sur une page html.

C'est coté client, et utilise du javascript qu'on peut écrire en Autolisp après extraction de données d'objets (polylignes, lignes, cercles, arcs, texte et hachures). 

Mais la technologie ASP donne envie et offre apparemment bien plus de possibilités.

...plus je sais où je suis, moins je sais où je vais....

Extrait d'une double interview simultanée d'une particule élémentaire.

Link to post
Share on other sites

Merci à vous.

@Fraid Je suis vraiment débutant en programmation Web. Je n'ai jamais fait que ce petit site et quelques services web pour tester. J'ai utilisé très peu de JavaScript (trois fonctions dans la page maitre pour changer de thème et une autre dans cette page pour remettre à zéro les résultats quand une liste déroulante est modifiée).

Le framework ASP .NET permet des trucs intéressants que j'ai essayé d'utiliser comme l'utilisation d'une "page maitre" et de "pages de contenu" mais le véritable intérêt, c'est la programmation côté serveur (il faut que l'hébergeur permette l'utilisation de ASP .NET). Tous les calculs sont faits en C# dans un fichier .cs séparé (code behind) exactement comme on le fait avec une application Windows ou WPF. Ici ça ne représente pas énormément de code (environ 300 lignes avec les commentaires), mais on peut utiliser toute la puissance de .NET sans que le client n'ait à installer .NET (cette page web est utilisable depuis MAC ou Linux -il risque d'y avoir des problèmes de taille d'affichage avec Android).
Et en plus, on fait tout depuis Visual Studio.

  • Upvote 1

Gilles Chanteau - gileCAD -
Développements sur mesure pour AutoCAD
ADSK_Expert_Elite_Icon_S_Color_Blk_125.png

Link to post
Share on other sites

Sinon, après un F12 sur ton site, j'ai regarder ton css.

Je pense qu'il y a moyen de l' alléger.

Déjà la première ligne body{...}  doit suffire puisque c'est descendant, 

On commence par les éléments embrassant, puis on règles le cas par cas.

Les variables déclarées par root sont mieux au début du css (si tu veux appliquée une couleur à un élément déclaré avant ...)

regarde bien les valeurs qui se répètent.

Quote

Je suis vraiment débutant en programmation Web

C'est pire qu'en Autolisp, il y a tellement de technologie différentes qui évoluent sans cesse que débutant nous le resterons.

...plus je sais où je suis, moins je sais où je vais....

Extrait d'une double interview simultanée d'une particule élémentaire.

Link to post
Share on other sites
57 minutes ago, Fraid said:

Je pense qu'il y a moyen de l' alléger.

Très certainement, il doit y avoir une dizaine d'années que j'ai fait ça à partir d'exemples glanés dans des tutoriels et depuis, j'ai ajouté des couches sans chercher vraiment à optimiser... En tous cas, merci pour la remarque.

Je ne pense pas qu'il soit très judicieux que je publie les codes de cette page web (trop de liens avec le reste du site), mais, pour ceux que ça intéresse, voici ceux d'une application WPF similaire (plus l'exécutable en fichier joint).

Le code XAML qui décrit la fenêtre (pendant du HTML/CSS) :

<Window x:Class="DimensionsArc.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:DimensionsArc"
        mc:Ignorable="d"
        Title="Dimensions dans l'arc de cercle" Height="562" Width="836" ResizeMode="NoResize">
    <Window.CommandBindings>
        <CommandBinding Command="{x:Static local:MainWindow.CalculCmd}"
                        Executed="CalculCmdExecuted"
                        CanExecute="CalculCmdCanExecute" />
    </Window.CommandBindings>
    <Grid Height="533" Width="830">
        <Grid.Background>
            <ImageBrush ImageSource="DimensionsArc.png" Stretch="None" />
        </Grid.Background>
        <Label Content="Précision :" HorizontalAlignment="Left" Margin="50,54,0,0" VerticalAlignment="Top"/>
        <ComboBox HorizontalAlignment="Left" Margin="118,58,0,0" VerticalAlignment="Top" Width="70"
                  ItemsSource="{Binding Precisions}" SelectedValue="{Binding Format}"/>
        <TextBlock Margin="429,30,301,470" VerticalAlignment="Center" HorizontalAlignment="Center" Width="60" 
                   Background="#FDF6E3" Foreground="#268BD2" TextAlignment="Center" Text="{Binding Arc}" />
        <TextBlock Margin="483,128,247,372" VerticalAlignment="Center" HorizontalAlignment="Center" Width="60" 
                   Background="#FDF6E3" Foreground="#268BD2" TextAlignment="Center" Text="{Binding Fleche}"/>
        <TextBlock Margin="425,237,305,263" VerticalAlignment="Center" HorizontalAlignment="Center" Width="60" 
                   Background="#FDF6E3" Foreground="#268BD2" TextAlignment="Center" Text="{Binding Corde}"/>
        <TextBlock Margin="425,312,305,188" VerticalAlignment="Center" HorizontalAlignment="Center" Width="60" 
                   Background="#FDF6E3" Foreground="#268BD2" TextAlignment="Center" Text="{Binding Angle}"/>
        <TextBlock Margin="592,348,138,152" VerticalAlignment="Center" HorizontalAlignment="Center" Width="60" 
                   Background="#FDF6E3" Foreground="#268BD2" TextAlignment="Center" Text="{Binding Rayon}"/>
        <Label Margin="46,309,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="225">
            Entrer deux valeurs pour lancer le calcul
        </Label>
        <ComboBox Margin="50,348,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="110" 
                  ItemsSource="{Binding Dimensions}" SelectedIndex="{Binding TypeDimension1}"/>
        <ComboBox Margin="50,387,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="110" 
                  ItemsSource="{Binding Dimensions}" SelectedIndex="{Binding TypeDimension2}"/>
        <TextBox Margin="176,349,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="60" TextAlignment="Right" 
                 Text="{Binding Dimension1, UpdateSourceTrigger=PropertyChanged}"/>
        <TextBox Margin="176,388,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="60" TextAlignment="Right" 
                 Text="{Binding Dimension2, UpdateSourceTrigger=PropertyChanged}"/>
        <Button Margin="50,445,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="75" 
                Command="{x:Static local:MainWindow.CalculCmd}">Calculer</Button>
    </Grid>
</Window>

Le 'code behind' (C#) avec les calculs :

using System.ComponentModel;
using System.Linq;
using System.Windows;
using System.Windows.Input;

using static System.Math;

namespace DimensionsArc
{
    public enum TypeDimension { Angle, Arc, Corde, Fleche, Rayon }

    /// <summary>
    /// Logique d'interaction pour MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window, INotifyPropertyChanged
    {
        #region INotifyPropertyChanged
        public event PropertyChangedEventHandler PropertyChanged;

        private void NotifyPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
        #endregion;

        public MainWindow()
        {
            InitializeComponent();
            DataContext = this;
        }

        double angle, arc, corde, fleche, rayon, dim1, dim2;
        string dimension1, dimension2, format = "0";
        bool validDimension1, validDimension2;
        TypeDimension typeDimension1 = TypeDimension.Corde;
        TypeDimension typeDimension2 = TypeDimension.Fleche;

        #region Propriétés (Binding)
        public string Angle
        {
            get { return Degres(angle).ToString(format) + "°"; }
            set { angle = Radians(double.Parse(value.TrimEnd('°'))); NotifyPropertyChanged(nameof(Angle)); }
        } 

        public string Arc
        {
            get { return arc.ToString(format); }
            set { arc = double.Parse(value); NotifyPropertyChanged(nameof(Arc)); }
        }

        public string Corde
        {
            get { return corde.ToString(format); }
            set { corde = double.Parse(value); NotifyPropertyChanged(nameof(Corde)); }
        }

        public string Fleche
        {
            get { return fleche.ToString(format); }
            set { fleche = double.Parse(value); NotifyPropertyChanged(nameof(Fleche)); }
        }

        public string Rayon
        {
            get { return rayon.ToString(format); }
            set { rayon = double.Parse(value); NotifyPropertyChanged(nameof(Rayon)); }
        }

        public string[] Precisions =>
            new[] { "0", "0.0", "0.00", "0.000", "0.0000" };

        public string Format
        {
            get { return format; }
            set { format = value; NotifyPropertyChanged(nameof(Format)); Calculer(); }
        }

        public string[] Dimensions =>
            new[] { "Angle (°)", "Longueur d'arc", "Corde", "Flèche", "Rayon" };

        public int TypeDimension1
        {
            get { return (int)typeDimension1; }
            set
            {
                typeDimension1 = (TypeDimension)value;
                Reset();
                NotifyPropertyChanged(nameof(TypeDimension1));
            }
        }

        public int TypeDimension2
        {
            get { return (int)typeDimension2; }
            set
            {
                typeDimension2 = (TypeDimension)value;
                Reset();
                NotifyPropertyChanged(nameof(TypeDimension2));
            }
        }

        public string Dimension1
        {
            get { return dimension1; }
            set
            {
                dimension1 = value;
                validDimension1 = 
                    double.TryParse(dimension1, out dim1) && 
                    0.0 < dim1 && 
                    (typeDimension1 != TypeDimension.Angle || dim1 < 360.0);
                NotifyPropertyChanged(nameof(Dimension1));
            }
        }

        public string Dimension2
        {
            get { return dimension2; }
            set
            {
                dimension2 = value;
                validDimension2 = 
                    double.TryParse(dimension2, out dim2) && 
                    0.0 < dim2 && 
                    (typeDimension2 != TypeDimension.Angle || dim2 < 360.0);
                NotifyPropertyChanged(nameof(Dimension2));
            }
        }

        private void Reset() => Angle = Arc = Corde = Fleche = Rayon = "0";
        #endregion

        #region Command (Binding)
        public static RoutedCommand CalculCmd = new RoutedCommand();

        private void CalculCmdExecuted(object sender, ExecutedRoutedEventArgs e) =>
            Calculer();

        private void CalculCmdCanExecute(object sender, CanExecuteRoutedEventArgs e) =>
            e.CanExecute = typeDimension1 != typeDimension2 && validDimension1 && validDimension2;
        #endregion

        #region Calculs
        private void Calculer()
        {
            switch (typeDimension1)
            {
                case TypeDimension.Angle:
                    angle = Radians(dim1);
                    switch (typeDimension2)
                    {
                        case TypeDimension.Rayon:
                            rayon = dim2;
                            CalculerAngleRayon();
                            break;
                        case TypeDimension.Arc:
                            arc = dim2;
                            CalculerAngleArc();
                            break;
                        case TypeDimension.Corde:
                            corde = dim2;
                            CalculerAngleCorde();
                            break;
                        case TypeDimension.Fleche:
                            fleche = dim2;
                            CalculerAngleFleche();
                            break;
                    }
                    break;
                case TypeDimension.Arc:
                    arc = dim1;
                    switch (typeDimension2)
                    {
                        case TypeDimension.Angle:
                            angle = Radians(dim2);
                            CalculerAngleArc();
                            break;
                        case TypeDimension.Corde:
                            corde = dim2;
                            CalculerArcCorde();
                            break;
                        case TypeDimension.Fleche:
                            fleche = dim2;
                            CalculerArcFleche();
                            break;
                        case TypeDimension.Rayon:
                            rayon = dim2;
                            CalculerArcRayon();
                            break;
                    }
                    break;
                case TypeDimension.Corde:
                    corde = dim1;
                    switch (typeDimension2)
                    {
                        case TypeDimension.Angle:
                            angle = Radians(dim2);
                            CalculerAngleCorde();
                            break;
                        case TypeDimension.Arc:
                            arc = dim2;
                            CalculerArcCorde();
                            break;
                        case TypeDimension.Fleche:
                            fleche = dim2;
                            CalculerCordeFleche();
                            break;
                        case TypeDimension.Rayon:
                            rayon = dim2;
                            CalculerCordeRayon();
                            break;
                    }
                    break;
                case TypeDimension.Fleche:
                    fleche = dim1;
                    switch (typeDimension2)
                    {
                        case TypeDimension.Angle:
                            angle = Radians(dim2);
                            CalculerAngleFleche();
                            break;
                        case TypeDimension.Arc:
                            arc = dim2;
                            CalculerArcFleche();
                            break;
                        case TypeDimension.Corde:
                            corde = dim2;
                            CalculerCordeFleche();
                            break;
                        case TypeDimension.Rayon:
                            rayon = dim2;
                            CalculerFlecheRayon();
                            break;
                    }
                    break;
                case TypeDimension.Rayon:
                    rayon = dim1;
                    switch (typeDimension2)
                    {
                        case TypeDimension.Angle:
                            angle = Radians(dim2);
                            CalculerAngleRayon();
                            break;
                        case TypeDimension.Arc:
                            arc = dim2;
                            CalculerArcRayon();
                            break;
                        case TypeDimension.Corde:
                            corde = dim2;
                            CalculerCordeRayon();
                            break;
                        case TypeDimension.Fleche:
                            fleche = dim2;
                            CalculerFlecheRayon();
                            break;
                    }
                    break;
            }

            // affichage des résultats dans la page.
            var values = new[] { angle, arc, corde, fleche, rayon };
            if (values.Any(v => double.IsNaN(v)))
            {
                Reset();
            }
            else
            {
                Arc = arc.ToString(Format);
                Corde = corde.ToString(Format);
                Fleche = fleche.ToString(Format);
                Rayon = rayon.ToString(Format);
                Angle = Degres(angle).ToString(Format) + "°";
            }
        }

        private double Radians(double degres) => degres * PI / 180.0;

        private double Degres(double radians) => radians * 180.0 / PI;

        private void CalculerAngleRayon()
        {
            arc = angle * rayon;
            double demiCorde = rayon * Sin(angle * 0.5);
            corde = 2.0 * demiCorde;
            fleche = demiCorde * Sin(angle * 0.25);
        }

        private void CalculerAngleFleche()
        {
            double demiCorde = fleche / Tan(angle * 0.25);
            corde = 2.0 * demiCorde;
            rayon = demiCorde / Sin(angle * 0.5);
            arc = angle * rayon;
        }

        private void CalculerAngleCorde()
        {
            double demiCorde = corde * 0.5;
            rayon = demiCorde / Sin(angle * 0.5);
            fleche = demiCorde * Tan(angle * 0.25);
            arc = angle * rayon;
        }

        private void CalculerAngleArc()
        {
            rayon = arc / angle;
            double demiCorde = rayon * Sin(angle * 0.5);
            corde = 2.0 * demiCorde;
            fleche = demiCorde * Tan(angle * 0.25);
        }

       private void CalculerFlecheRayon()
        {
            double apotheme = rayon - fleche;
            corde = 2 * Sqrt(rayon * rayon - apotheme * apotheme);
            angle = 2.0 * Acos(apotheme / rayon);
            arc = angle * rayon;
        }

        private void CalculerCordeRayon()
        {
            double demiCorde = corde * 0.5;
            fleche = rayon - Sqrt(rayon * rayon - demiCorde * demiCorde);
            angle = 2.0 * Asin(demiCorde / rayon);
            arc = angle * rayon;
        }

        private void CalculerCordeFleche()
        {
            double demiCorde = corde * 0.5;
            angle = 4.0 * Atan2(fleche, demiCorde);
            rayon = demiCorde / Sin(angle * 0.5);
            arc = angle * rayon;
        }

        private void CalculerArcRayon()
        {
            if (2.0 * PI * rayon < arc)
            {
                corde = double.NaN;
                fleche = double.NaN;
                angle = double.NaN;
            }
            else
            {
                angle = arc / rayon;
                corde = 2.0 * rayon * Sin(angle * 0.5);
                fleche = rayon - rayon * Cos(angle * 0.5);
            }
        }

        private void CalculerArcFleche()
        {
            if (0.36230568 * arc < fleche) //(1.138216853 * arc < fleche * PI)
            {
                rayon = double.NaN;
                corde = double.NaN;
                angle = double.NaN;
            }
            else
            {
                double k = 2.0 * fleche / arc;
                double a = 2.0 * k;
                for (int i = 0; i < 8; i++)
                {
                    a -= (Cos(a) + k * a - 1.0) / (-Sin(a) + k);
                }
                angle = 2.0 * a;
                rayon = arc / angle;
                corde = 2.0 * rayon * Sin(a);
            }
        }

        private void CalculerArcCorde()
        {
            if (arc <= corde)
            {
                rayon = double.NaN;
                fleche = double.NaN;
                angle = double.NaN;
            }
            else
            {
                double k = corde / arc;
                double a = Sqrt(6.0 - 6.0 * k);
                for (int i = 0; i < 8; i++)
                {
                    a -= (Sin(a) - k * a) / (Cos(a) - k);
                }
                angle = 2.0 * a;
                rayon = arc / angle;
                fleche = rayon - rayon * Cos(a);
            }
        }
        #endregion
    }
}

 

DimensionsArc.zip

Gilles Chanteau - gileCAD -
Développements sur mesure pour AutoCAD
ADSK_Expert_Elite_Icon_S_Color_Blk_125.png

Link to post
Share on other sites

Merci pour ce partage.

du coup j'ai une question.

Tu utilise #region une "C# preprocessor directives"

Cela te permet d'encapsuler les variables à l’intérieur de celle ci, si j'ai bien compris.

est ce pour évité de créer une nouvelle class?

Mon réflexe serais de construire un objet dans une class à part en Java.

Est ce qu'il faut j'oublie cela?

...plus je sais où je suis, moins je sais où je vais....

Extrait d'une double interview simultanée d'une particule élémentaire.

Link to post
Share on other sites
12 hours ago, Fraid said:

Tu utilise #region une "C# preprocessor directives"

J'imagine que tu as vu ça dans le code source de la page web. Ce que tu vois dans ce "code source" n'est pas ce que j'ai écrit dans Visual Studio, c'est ce qu'à généré Visual Studio à la compilation.
En bref, quand tu crées un un nouveau WebForm (avec ou sans page maitre) dans Visual Studio, deux fichiers sont automatiquement créés : un fichier .aspx dans lequel on définit l'apparence de la page avec des balises html et asp (pour les contrôles) et, si besoin des scripts JavaScript ; et un autre fichier .aspx.cs dans lequel une classe est prévue pour écrire le "code behind", autrement dit le fonctionnement des contrôles aspx exécuté côté serveur.

C'est la même chose que pour une application WPF (CF ci-dessus), Visual Studio crée automatiquement un fichier .xaml et un fichier .xaml.cs pour le code behind.

Le code de la page en aspx dans Visual Studio :

<%@ Page Title="" Language="C#" MasterPageFile="~/GileCAD.Master" AutoEventWireup="true" CodeBehind="DimensionsArc.aspx.cs" Inherits="gileCAD.WebForm12" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <script type="text/javascript">
        function resetOutput() {
            ["<%= txtAngle.ClientID %>", "<%= txtArc.ClientID %>", "<%= txtCorde.ClientID %>", "<%= txtFleche.ClientID %>", "<%= txtRayon.ClientID %>"]
            .forEach((id) => { document.getElementById(id).value = "";
            })
        }
    </script>
    <p id="titre">
        Dimensions dans un arc de cercle
    </p>
    <div id="dimArcImage">
        <asp:TextBox runat="server" ID="txtArc" ClientIDMode="Static" CssClass="output txtArc" Enabled="true" />
        <asp:TextBox runat="server" ID="txtCorde" ClientIDMode="Static" CssClass="output txtCorde" Enabled="false" />
        <asp:TextBox runat="server" ID="txtAngle" ClientIDMode="Static" CssClass="output txtAngle" Enabled="false" />
        <asp:TextBox runat="server" ID="txtFleche" ClientIDMode="Static" CssClass="output txtFleche" Enabled="false" />
        <asp:TextBox runat="server" ID="txtRayon" ClientIDMode="Static" CssClass="output txtRayon" Enabled="false" />
        <asp:DropDownList runat="server" ID="cboDimension1" CssClass="ddl ddlDim1" onchange="resetOutput()">
            <asp:ListItem>Angle</asp:ListItem>
            <asp:ListItem>Arc</asp:ListItem>
            <asp:ListItem>Corde</asp:ListItem>
            <asp:ListItem>Flèche</asp:ListItem>
            <asp:ListItem>Rayon</asp:ListItem>
        </asp:DropDownList>
        <asp:DropDownList runat="server" ID="cboDimension2" CssClass="ddl ddlDim2"  onchange="resetOutput()">
            <asp:ListItem>Angle</asp:ListItem>
            <asp:ListItem>Arc</asp:ListItem>
            <asp:ListItem>Corde</asp:ListItem>
            <asp:ListItem>Flèche</asp:ListItem>
            <asp:ListItem>Rayon</asp:ListItem>
        </asp:DropDownList>
        <asp:TextBox runat="server" ID="txtDimension1" CssClass="input txtDim1" />
        <asp:TextBox runat="server" ID="txtDimension2" CssClass="input txtDim2" />
        <asp:Button runat="server" ID="btnCalcul" CssClass="btnCalcul" Text="Calculer" OnClick="btnCalculer_Click" />
        <asp:Label runat="server" ID="lblPrecision" CssClass="lblPrecision" Text="Précision :" />
        <asp:DropDownList runat="server" ID="ddlPrecision" CssClass="ddl ddlPrecision" AutoPostBack="true" OnSelectedIndexChanged="btnCalculer_Click">
            <asp:ListItem Selected="True">0</asp:ListItem>
            <asp:ListItem>0.0</asp:ListItem>
            <asp:ListItem>0.00</asp:ListItem>
            <asp:ListItem>0.000</asp:ListItem>
            <asp:ListItem>0.0000</asp:ListItem>
        </asp:DropDownList>
    </div>
</asp:Content>

 

Gilles Chanteau - gileCAD -
Développements sur mesure pour AutoCAD
ADSK_Expert_Elite_Icon_S_Color_Blk_125.png

Link to post
Share on other sites
Quote

généré Visual Studio à la compilation

d'accord, je n'avais pas compris cela.

 

...plus je sais où je suis, moins je sais où je vais....

Extrait d'une double interview simultanée d'une particule élémentaire.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...