Home Solution(ถาม-ตอบ) สร้าง Realtime Trend บน VB 2008 Express

EDA International ตัวแทนจำหน่ายเป็นทางการ ICONICS, PRElectronics, M-System, Graphon, ABB

ซอร์ฟแวร์ตรวจสอบ/บริหารงานอุตสาหกรรม วิศวกรรม SCADA/HMI (ICONICS GENESIS32/64), Report Solution, Cloud, อุปกรณ์วัดคุม แสดงผล เทอร์มินัล อุปกรณ์ป้องกันทางอิเล็คทรอนิกส์ 

สร้าง Realtime Trend บน VB 2008 Express

บทความนี้จะแสดงวิธีสร้าง Realtime trend อย่างง่ายบน VB 2008 Express (จะใช้ VB 2010 หรือ 2012 Express ก็ได้)

 

หลักการ

 

- ใช้ Microsoft Chart Control เพื่อแสดง Realtime trend

- แสดงสัญญาณเช่นจาก OPC Server ด้วย COPC32 หรือจากฐานข้อมูล ฯลฯ ในตัวอย่างนี้ใช้สัญญาณจำลองจากฟังกชั่น Rnd() ของ VB.Net

ขั้นตอน

เปิด VB 2008 Express หรือ 2010/2012 Express ขึ้นมา สร้างโปรเจ็คใหม่ แล้ววาง Chart Control ลงไปใน Form

 

image

 

เข้าดูโค้ด แล้ว Import ไลบรารี่ของ Chart เข้ามา

 

image

 

ประกาศตัวแปรอาเรย์ขนาด 20 item คือ pnt และ tm สำหรับเก็บค่าสัญญาณและเวลาตามลำดับ เนื่องจากในตัวอย่างนี้เราจะพล็อตแค่ 20 sample (20 ช่วงเวลา)

 

image

 

กลับไปที่Design View แล้วดับเบิ้ลคลิ้กที่ Form เพื่อสร้างEvent “Form_Load” แล้วเขียนโค้ดกำหนดค่าเริ่มต้นของอาเรย์ดังนี้

 

    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

        For i = 0 To 19

            pnt(i) = 0
            tm(i) = ""


        Next

    End Sub

 

 

โค้ดด้านบนเป็นการใส่ค่าเปล่า ๆ ให้ pnt และ tm ก่อนเอาไปพล็อต เพื่อป้องกันปัญหาค่า Null ซึ่งเอาไปพล็อตไม่ได้

 

ให้เอา Timer มาวางลงใน Form เพื่อให้ Timer สร้างการพล็อต

 

image

 

ตั้งเวลาทำงานเป็น 1 วินาที และให้ Enable เป็น True เพื่อเริ่มทำงาน

 

image

 

พักเรื่อง Timer ไว้ก่อน

เข้าไปคอนฟิก Chart เพื่อสร้างกลุ่มSeriesของสัญญาณ โดยเลือก Chart1 บน Form จากนั้นคลิ้กเปิด Collection ของ Chart1 (คลิ้กปุ่ม …) ดังรูป

 

image

 

กำหนด ChartType เป็น Line และ XValueType เป็น String คลิ้ก OK

 

image

 

สร้าง Sub ชื่อ plot เพื่อใช้ในการพล็อต Trend (Sub นี้จะถูกเรียกใช้ใน Timer ภายหลัง)

 

    Private Sub plot()
        Dim i As Integer

        For i = 0 To 18

            pnt(i) = pnt(i + 1)
            tm(i) = tm(i + 1)


        Next

        Randomize()
        pnt(19) = Rnd(0) * 1000
        tm(19) = Now.ToString()

        Chart1.Series("Series1").Points.Clear()

        For i = 0 To 19
            Chart1.Series("Series1").Points.AddXY(tm(i), pnt(i))
        Next

    End Sub

 

 

โค้ดด้านบนเป็นการวนลูปเติมค่าให้ pnt และ tm ตัวที่ 0 ถึง 18 ให้รับค่าจากตัวถัดไป ก่อนที่จะรับค่าสัญญาณ Random และเวลาปัจจุบันใส่ให้ตัวที่ 19

แต่ถ้ารับค่าจาก COPC32 ก็จะเป็น

pnt(19) = copc1.getvl(0)

สังเกตุว่าเราทำการ Clear Sampleใน Chart ก่อนที่จะพล็อตSampleทั้ง20ตัวลงไป

ดับเบิ้ลคลิ้กที่ Timer บนFormเพื่อเข้าสู่โค้ดของ Timer

ให้เรียกใช้ Sub plot ใน Timer

 

image

 

โค้ดทั้งหมดจะเป็นดังนี้

 

Imports System.Windows.Forms.DataVisualization.Charting

Public Class Form1

    Public pnt(0 To 19) As Double, tm(0 To 19) As String


    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

        For i = 0 To 19

            pnt(i) = 0
            tm(i) = ""


        Next

    End Sub


    Private Sub plot()
        Dim i As Integer

        For i = 0 To 18

            pnt(i) = pnt(i + 1)
            tm(i) = tm(i + 1)


        Next

        Randomize()
        pnt(19) = Rnd(0) * 1000
        tm(19) = Now.ToString()

        Chart1.Series("Series1").Points.Clear()

        For i = 0 To 19
            Chart1.Series("Series1").Points.AddXY(tm(i), pnt(i))
        Next

    End Sub


    Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick
        plot()
    End Sub

End Class

 

ทดสอบรันโปรเจ็คจะได้สัญญาณ Trend ถูกพล็อตขึ้นมามีคาบกว้าง 20 sample

 

image