Overview

This is a wizard style app. that through a series of questions determines which type of Triangle Solver you need.

The solution is given to your chosen number of Decimal Places or Significant Figures, both in the solver form and as an HTML page where step by step solutions are shown, along with a scale diagram and an area calculation.

 

 

 

Depending on the answers to the questions, you are redirected to either the Pythagoras' Theorem side lengths solver, the Trigonometric Ratios solver for sides and angles, the Sine Rule solver for sides and angles, or the Cosine Rule solver which also solves sides and angles.

After entering three valid values (for sides and angles), or two valid lengths (for Pythagoras' Theorem), the Calculate button is enabled and clicking it will solve the Triangle.    

 


The HTML Template

The step by step solution, scale diagram, and area calculation are compiled into an HTML file which is then shown in a WebBrowser control.

This is the HTML Template:

 

<html>
  <body>
    <div class="heading" style="margin: 20px 50px; width:90%; border-bottom: 3px solid;  color:SteelBlue;"><h1 style="font-family:calibri; color:SteelBlue;">[placeholder1]</h1></div>
    <div style="margin: 20px 50px;"><img src="[placeholder2]"/></div>
    <div style="margin: 20px 50px;">(Full precision)</div>
    <div style="margin: 20px 50px;"><p style="display:inline;">[placeholder3]</p></div>
    <div style="margin: 20px 50px;">[placeholder4]</div>
    <div style="margin: 20px 50px;"><img src="[placeholder5]"/></div>
    <div style="margin: 20px 50px;"><img src="[placeholder6]"/></div>
    <div class="heading" style="margin: 20px 50px; width:90%; border-bottom: 3px solid; border-top: 3px solid;  color:SteelBlue;"><h1 style="font-family:calibri; color:SteelBlue; display:inline;">Area </h1><h3 style="font-family:calibri; font-style:italic; color:SteelBlue; display:inline;">(Heron's Formula)</h3></div>
    <div style="margin: 20px 50px;">(Full precision)</div>
    <div style="margin: 20px 50px;"><p>s = (a/2) + (b/2) + (c/2)</p></div>
    <div style="margin: 0px 50px;"><p style="display:inline;">s = [placeholder7]</p></div>
    <br>
    <div style="margin: 20px 50px;"><p>A = Vs(s-a)(s-b)(s-c)</p></div>
    <div style="margin: 0px 50px;"><p style="display:inline;">A = V[placeholder8]</p></div>
    <br>
    <br>   
  </body>
</html>
 



It contains eight [placeholder#] tags which are replaced dynamically in code on each occasion the HTML file is created. Within the HTML files there are certain numbers (results) in the calculations which are shown in a larger bold font. This is achieved with an emphasize Function which wraps these numbers in HTML highlighting code:

Private Function emphasize(ByVal d As Decimal) As String
    Return String.Format("<p style=""font-weight: bold; font-size: 22px;display:inline;"">{0}</p>", d)
End Function

 


The Triangle Class

This is the Triangle Class which scales, centres, and plots the vertex points for the scale Triangle diagrams in the HTML output. (I had some help with the Point plotting Functions, both from other Forum members and extensive web search):

Public Class Triangle
    Public A As PointF
    Public B As PointF
    Public C As PointF
 
    ''' <summary>
    '''
    ''' </summary>
    ''' <param name="sideA">The length of the known side BC</param>
    ''' <param name="sideB">The length of the known side AC</param>
    ''' <param name="sideC">The length of the known side AB</param>
    ''' <param name="angleA">The internal angle in Radians at vertex A</param>
    ''' <param name="angleB">The internal angle in Radians at vertex B</param>
    ''' <param name="angleC">The internal angle in Radians at vertex C</param>
    ''' <remarks></remarks>
    Public Sub New(ByVal sideA As Decimal, ByVal sideB As Decimal, ByVal sideC As Decimal, ByVal angleA As Decimal, ByVal angleB As Decimal, ByVal angleC As Decimal)
 
        Dim bX As Decimal = CDec(Math.Cos(angleA) * sideC)
        Dim bY As Decimal = CDec(Math.Sin(angleA) * sideC)
 
        Me.A = PointF.Empty
        Me.C = PointF.Add(A, New SizeF(sideB, 0))
        Me.B = New PointF(bX, -bY)
 
        If bX < 0 Then
            Me.A = PointF.Add(Me.A, New SizeF(-bX, 0))
            Me.B = PointF.Add(Me.B, New SizeF(-bX, 0))
            Me.C = PointF.Add(Me.C, New SizeF(-bX, 0))
        End If
    End Sub
 
    Public Sub ScaleToFit(ByVal maxWidthOrHeight As Decimal)
        Dim xCoords() As Single = {Me.A.X, Me.B.X, Me.C.X}
        Dim OverallWidth As Decimal = CDec(xCoords.Max - xCoords.Min)
        Dim OverallHeight As Decimal = CDec(Math.Abs(Me.B.Y))   'B.Y is negative owing to GDI+ coordinates
        Dim scaleFactor As Decimal = If(OverallWidth > OverallHeight, _
                                         maxWidthOrHeight / OverallWidth, _
                                          maxWidthOrHeight / OverallHeight)
        Scale(scaleFactor)
        centreTriangle(25, 300)
    End Sub
  
 
    Private Sub Scale(ByVal scaleFactor As Decimal)
        Me.A = ScalePointF(Me.A, scaleFactor)
        Me.B = ScalePointF(Me.B, scaleFactor)
        Me.C = ScalePointF(Me.C, scaleFactor)
    End Sub
 
    Private Function ScalePointF(ByVal pf As PointF, ByVal factor As Decimal) As PointF
        Return New PointF(pf.X * factor, pf.Y * factor)
    End Function
 
    Private Sub centreTriangle(ByVal border As Integer, ByVal displaySize As Integer)
        If B.Y > A.Y Then B.Y -= ((B.Y - A.Y) * 2)
        Dim pts() As PointF = New PointF() {A, B, C}
        Dim offset_X As Integer = pts.Min(Function(p) CInt(p.X)) - border
        Dim offset_Y As Integer = pts.Max(Function(p) CInt(p.Y)) - (displaySize - border)
        A = New PointF(A.X - offset_X, A.Y - offset_Y)
        B = New PointF(B.X - offset_X, B.Y - offset_Y)
        C = New PointF(C.X - offset_X, C.Y - offset_Y)
    End Sub
End Class
 

 


Other Resources


See Also