Saturday, March 30

Getting started Emgu with Visual C# 2010 Express

ถ้าหากเรามองว่า OpenCV คือ ไลบรารี่สำเร็จรูปที่ใช้สำหรับจัดการงานด้าน Computer Vision ซึ่งรองรับภาษา C/C++,JAVA,Python แล้วหล่ะก็ Emgu ก็คือฟังก์ชั่นที่ทำขึ้นมาครอบ OpenCV อีกชั้นหนึ่ง แต่ ทำขึ้นมาเพื่อรองรับภาษา Visual C# นั่นเอง  ซึ่งทำให้นักพัฒนาด้วยภาษา Visual C# สามารถก้าวเข้ามาเล่น Computer Vision ได้อย่างง่ายดาย

วันนี้ผมจะพาเพื่อนๆ มาติดตั้ง Emgu กันครับ เริ่มแรก เราต้องเตรียมซอร์ฟแวร์ที่จะติดตั้งกันก่อน โดยอ้างอิงจากที่ผมติดตั้งไว้แล้ว ดังนี้

ระบบปฏิบัติการ Windows7
Visual C# 2010 Express edition หากยังไม่มี ติดตั้งโปรแกรนี้ก่อน ได้จาก ที่นี่
ดาวน์โหลด Emgucv2.4.2 libemgucv-windows-x86-gpu-2.4.2.1777.exe ได้จาก ที่นี่
เมื่อได้ไฟล์ libemgucv-windows-x86-gpu-2.4.2.1777.exe ให้ทำการติดตั้งไว้ที่ Dirve C: เลยครับ

หรือจะไว้ที่ Drive ก็ได้ แล้วแต่สะดวก ในระหว่างการติดตั้ง ถ้ามีปัญหา เช่น

- Uninstall or Repair Microsoft C++ Redistributable ให้ตอบ Cancel
หรือ
- Visual Studio Debugger ถ้าเรายังไม่เคยติดตั้ง Emgu มาก่อน ใหคลิก Yes แต่ถ้าเคยติดตั้งมาแล้วให้คลิก No

Emgucv1Emgucv2Emgucv3Emgucv4Emgucv5

เมื่อเสร็จเรียบร้อยแล้ว เราต้ิองมาทำการ set path ให้ Windows มองหา Emgu ก่อน เพื่อป้องกันปัญหาต่างๆ ในการ Build solution โดยไปตั้งค่าที่

Control Panel->System->Advance system setting ที่แท๊บ Advanced คลิก

Environment Variables ที่ System Variables คลิกที่ Path แล้ว Edit..
ให้เอา path ที่เราติดตั้ง Emgu ไปใส่ต่อท้าย ในที่นี้ผมติดตั้งไว้ที่ C:\Emgu\emgucv-windows-x86-gpu2.4.2.1777\bin ผมก็ก๊อปปี้ไปต่อท้าย โดยคั่นด้วย ; ก่อน และหลัง path ที่ผมใส่เพิ่มเข้าไป จากนั้นกด OK เรื่อยๆ แล้วทำการรีสตาร์ทคอมพิวเตอร์ 1 ครั้ง

image

ต่อไป ให้ทำการ เปิด Visual C# ขึ้นมา แล้วทำการ New Project โดยเราจะสร้างโปรเจค แบบ  ตั้งชื่อโปรเคตามต้องการ จากนั้น สร้างหน้าตา form ดังรูป

image

กำหนดค่า text properties ให้ button1 และ button2 เป็น Image-1, Image-2 ตามลำดับ
กำหนดค่า text properties ให้ form1 เป็น  Hello Emgu
ส่วน PictureBox1 กำหนดให้มี Size เท่ากับ 400,300

Emgu Visual C# 2010 express

เสร็จแล้ว ที่หน้าต่าง Solution Explorer ทางขวามือ ที่ References ให้คลิกขวา แล้วทำการเลือก Add references..

ให้ทำการ add *.dll จากโฟวเดอร์ C:\Emgu\emgucv-windows-x86-gpu 2.4.2.1777\bin โดย

คลิก Ctrl ค้างไว้ แล้วคลิกที่ไฟล์ แต่ละไฟล์  แล้วกด OK

Add Reference_

จากนั้น กลับมาที่หน้า form design ของเรา ให้ดับเบิลคลิกที่ button1 เพื่อทำการเขียนโค๊ด โปรแกรมจะพาเราเข้ามาเขียนโค๊ดที่หน้า Form1.cs ให้เพิ่มโค๊ดเข้าไปดังรูป (เราทำการคลิกที่ button2 แล้วก็เพิ่มโค๊ดเข้าไปเช่นเดียวกัน กับครั้งแรก)

ก่อนที่เราจะรันโปรแกรมของเรา ให้เราทำการเตรียมภาพ ไว้ สองภาพ ในทีนี้ ผมได้เตรียมภาพที่ชื่อ linux.jpg และ windows.jpg เก็บไว้ที่ Drive E: ของผม (สังเกตจากในโค๊ด) โดยผมค้นหาภาพจาก อินเตอร์เนต โดยหาภาพที่มีขนาด 400x300 pixel ให้เท่ากับ size ของ picturebox ทีผมกำหนดไว้ตอนแรก

เมื่อเรียบร้อยแล้ว ให้กด F6 เพื่อ Build Solution หากไม่มีข้อความแสดง Error ใดๆ ให้กด F5 เพื่อ Start Debugging

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

using Emgu.CV;
using Emgu.CV.CvEnum;
using Emgu.CV.Structure;

namespace HelloEmgu
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            Image<Bgr, Byte> img = new Image<Bgr, byte>("E:\\linux.jpg");
            pictureBox1.Image = img.ToBitmap(pictureBox1.Width, pictureBox1.Height);
        }

        private void button2_Click(object sender, EventArgs e)
        {
            Image<Bgr, byte> img = new Image<Bgr, byte>("E:\\windows.jpg");
            pictureBox1.Image = img.ToBitmap(pictureBox1.Width, pictureBox1.Height);
        }
    }
}

HelloEmgu - Microsoft Visual C# 2010 Express

ทดลองกด Image-1 และ Image-2 ดูผลลัพธ์ครับ ถ้าโปรแกรมที่เราเขียนขึ้น แสดงภาพได้ตามต้องการ ก็แสดงความยินดีด้วยครับ และขอให้สนุกกับ Emgu นะครับ

 

----------------------------------------------------------------------------------------------------------------

แก้ปัญหา “The type initializer for 'Emgu.CV.CvInvoke' threw an exception.”

The type initializer for 'Emgu.CV.CvInvoke' threw an exception.

เนื่องจากเกิดปัญหาเครื่องผมถูกอัพเกรดให้เป็น WIndows7 64 บิต อย่างเต็มตัว ซึ่งก่อนหน้าถูกอัพเกรดโค๊ดเหล่านี้ยังทำงานได้เป็นปรกติ แต่พอมาเป็น WIndows7 64 บิต กลับพบว่า ไม่สามารถทำงานได้ ฉะนั้นจึงต้องมาการเปลี่ยนแปลงดังนี้

1. ใ้ห้ทำการติดตั้ง libemgucv-windows-x86-2.4.0.1717.exe ดาวน์โหลดจาก ที่นี่ ติดตั้งเหมือนเดิม แต่อาจไม่จำเป็นต้องเป็น Drive C: แล้ว เพราะเราจะใช้การก๊อปปี้ไฟล์ dll มาใส่ในโปรเจคเลย

2. ติดตั้งเสร็จแล้ว ให้ทำการแก้ไขโค๊ด โดยทำการ Add references ใหม่ (reference เก่าให้ delete ทิ้งไป) โดยให้ browse ไปที่ path ที่เราติดตั้ง Emgu เวอร์ชั่น 2.4.0 แทน ในที่นี้ผม browse ไำปที่ E:\Emgu\emgucv-windows-x86 2.4.0.1717\bin แล้วเลือกไฟล์ Emgu.CV.dll,Emgu.CV.GPU.dll, Emgu.CV.ML.dll, Emgu.CV.UI.dll, Emgu.Util.dll

3. ทำการ add file dll อื่นมาเลย ในที่นี้เราต้องทำการเลือก Add Existing items..  แล้วเลือกเอาไฟล์ dll เข้ามาในโปรเจค 2 ไฟล์ คือไฟล์ opencv_core240.dll, opencv_imgproc240.dll ซึ่งอยู่ใน E:\Emgu\emgucv-windows-x86 2.4.0.1717\bin\x86 ที่หน้าต่าง properties ช่อง Copy to output directory ให้เลือก copy always

แล้วลองกด F5 (Start debugging) อีกครั้ง

-----------------------------------------------------------------------

แก้ไข 18/07/2014

เจอปัญหาเก่าอีกครั้ง ตอนนี้เปลี่ยนเครื่องคอมพ์ กับ windows 7 64bit ไม่แน่ใจว่าเกิดอะไรขึ้นเหมือนกัน ปัญหาเยอะจริงๆ เวลาเปลี่ยนเวอร์ชั่นเนี้ย เท่าๆ ที่อ่านดูคล้ายๆ กับว่าตอนที่ make file มาให้เรา มีปัญหาเรื่อง dirver card vga ไม่รองรับกับเครื่องอื่นๆ ก็รอเขาแก้ปัญหากันต่อไป ตอนนี้ ก็โหลดเวอร์ชั่นเบต้า มาใช้ก่อน เป็นเวอร์ชั่นที่ใช้กับ driver card vga ได้ทุกรุ่น Download libemgucv-windows-universal-cuda-2.9.0.1922-beta.exe (214.0 MB) หลังจากติดตั้งแล้ว ให้ทำการแก้ไข path ใหม่ ใน

Control Panel->System->Advance system setting ที่แท๊บ Advanced คลิก

เพิ่ม path นี้เข้าไป (สำหรับ windows7 64 bit)

C:\Emgu\emgucv-windows-universal-cuda 2.9.0.1922\bin\x64

แล้วทำการ รีสตาร์ทเครื่องคอมพ์ หนึ่งครั้ง จากนั้นก็ทำการสร้างโปรเจคใน Visual C# เหมือนเดิม ทำการ add referrence เอาเฉาพะ EMGU.CV.dll, EMGU.CV.UI.dll, Emgu.Util.dll ซึ่งอยู่ใน

C:\Emgu\emgucv-windows-universal-cuda 2.9.0.1922\bin\

ที่เหลือไม่ต้องทำอะไรเหมือนคราวที่แล้ว เพราะเราได้กำหนด path ไว้แล้ว ทำการเขียนโค๊ดทดสอบ  อ่อ อย่าลืมเลือก solution platforms ให้เป็น x64 ด้วยหล่ะ ให้ตรงกับที่เราอ้าง path

"The type initializer for 'Emgu.CV.CvInvoke' threw an exception."

"The type initializer for 'Emgu.CV.CvInvoke' threw an exception."

เป็นวิธีแก้ปัญหาที่ง่ายดี ก็ได้หวังว่าผู้พัฒนา EMGU จะทำให้ง่ายกว่านี้ และ bug น้อยลงไปเรื่อยๆ นะครับ เอาหล่ะ ขอให้สนุกกับ EMGU กันต่อ

อ่านเพิ่มเติม...

Thursday, March 28

How to implement system variables on Visual C++ Project

วันนี้ จะมาแนะนำการสร้างตัวแปร system variables เพื่อนำตัวแปรนี้ไปอ้างอิงในการกำหนดค่า path ใน Project ของ Visual C++ ครับ จากครั้งที่แล้ว เราได้สร้างโปรเจค HelloOpenCV กันไปแล้ว จะเห็นได้ว่า กว่าจะกำหนดค่าต่างๆ ให้กับโปรเจคนั้น ค่อนข้างมีรายละเอียดยุบยิบ เต็มไปหมด (นี่ยังไม่รวมถึงขั้นตอนเขียนโปรแกรมนะ) ทีนี้ เราจะมาลองใช้ลูกเล่น system variables ใน  Environment variables ใน windows กันดูครับ

เริ่มจากเปิด Environment variables ที่ system variables คลิกที่ New
จะมีหน้าต่าง dialog ขึ้นมา ให้เรากำหนดค่าดังนี้

Variable name : OPENCV_DIR
Variable value : E:\software\opencv

จุดประสงค์ก็คือ เราต้องการให้ตัวแปร OPENCV_DIR ซึ่งต่อไปเราจะเรียกใช้ด้วยการอ้างถึง $(OPENCV_DIR) มีค่าเท่ากับ E:\software\opencv ซึ่งเป็นการอ้างถึง directory path ที่อยู่ของไฟล์ต่างๆ ใน  E:\software\opencv นั่นเอง

กำหนดเสร็จแล้วให้กด OK แล้วก็รีสตาร์ทคอมพิวเตอร์ 1 ครั้ง

system variables

กลับมาที่โปรเจค HelloOpenCV ที่เราได้เคยสร้างไว้แล้ว ให้ทำการเปลี่ยนแปลงค่าต่างๆ ที่เราเคยกำหนดไว้ จากตอนที่แล้ว โดยให้เปลี่ยนแปลงตั้งแต่ E:\software\opencv ให้กลายเป็น $(OPENCV_DIR)

refer to system variables

เช่น ผมเคยกำหนดให้
จากเดิม E:\software\opencv\build\include\opencv
เปลี่ยนเป็น $(OPENCV_DIR)\build\include\opencv

เปลี่ยนให้หมดเลยนะครับ ทุกที่ ที่เราเคยกำหนด path มันไว้ เสร็จแล้วก็ลอง Build Solution ใหม่อีกครั้ง ซึ่้งก็ควรจะ build ผ่าน เหมือนที่มันเคย build ผ่านมาก่อน
หลายคนอาจจะสงสัยว่า ทำแบบนี้ มันดีอย่างไร นอกจากได้การได้การเรียก path ที่สั้นลง

อย่างแรกนะครับ ลองนึกดูเล่นๆ นะครับ หากผมกับเพือน ต้องการแชร์โปรเจคให้กันและกัน แต่บังเอิญว่าเพื่อนผม เค้าติดตั้ง OpenCV2.4 ไว้ที่ C:\Program Files (x86)\OpenCV2.4 แต่ผมติดตั้งไว้ที่  E:\software\opencv จะเกิดอะไรขึ้น หากผมนำโปรเจคของเพื่อนมารันที่เครื่องผม ถึงแม้เราจะใช้ Visual C++ เวอร์ชั่นเดียวกันก็ตาม ก็ต้องมานั่งแก้ค่าคอนฟิคต่างๆ ก่อนจะ build solution อย่างแน่นอน แต่ถ้าใช้วิธีนี้ เราสามารถนำโปรเจคคนอื่นมา build solution ใหม่ได้เลยทันที

อย่างที่สองก็คือ หากวันข้างหน้า  OpenCV ออกเวอร์ชั่นใหม่มา จากเดิมที่เราใช้อยู่ คือ OpenCV2.4 แล้วเปลี่ยนมาเป็นเวอร์ชั่น OpenCV2.5 หรือ OpenCV3.0 บางคนอาจจะเลือกที่จะแตกไฟล์ใหม่ทับของเก่า หรือไม่ก็ rename folder เอา แต่ ถ้าเรากำหนดค่าใน system variables ใน Environment variables ของ Windows แล้วหล่ะก็ เราก็แค่เปลี่ยนแปลงที่นี่ เท่านั้น จากเดิม

Variable name : OPENCV_DIR
Variable value : E:\software\opencv

ก็กำหนดใหม่เป็น

Variable name : OPENCV_DIR
Variable value : E:\software\OpenCV2.5\opencv

ที่เหลือในโปรเจค เราก็แค่ไปเปลี่ยน Linker>Input ให้ไปเรียกไฟล์ใหม่ อย่างน้อยเราก็ไม่ต้องตามไปแก้ไข config ใหม่ทั้งหมด  นี่ก็เป็นอีกเทคนิคหนึ่ง ที่ผมอยากจะนำเสนอครับ  ก็ลองเอาไปปรับๆ กันดูครับ หากใครมีเทคนิคใด น่าสนใจ ก็แชร์กันได้ครับ

อ่านเพิ่มเติม...

Wednesday, March 27

How to config OpenCV2.4 with VC++ 2010 Express

    ก่อนเราจะมาติดตั้ง OpenCV2.4 กับ Visual C++ 2010 Express เรามาทำความเข้าใจกับ OpenCV สักนิดครับ สั้นๆ เลยก็คือ

OpenCv คือ ไลบรารีที่เปิดให้ใช้เสรี สำหรับงาน Computer Vision ซึ่งได้รับการพัฒนามาอย่างต่อเนื่อง ทำให้มีอัลกอริธึมสำหรับแก้ไขปัญหา Computer Vision มากกว่า 2500 อัลกอริธึม และตัวอย่างโค๊ดสำหรับ computer vision แบบงานเรียลไทม์ ทำงานได้ทั้ง Windows ,Linux, Mac OS X, Android และ iOS

ณ ปัจจุบัน เท่าที่ผมทราบตอนนี้ รองรับทั้งภาษา C++ และ Python ครับ หากใครสาวกไพธอน สามารถติดตั้งได้ตามตัวอย่างนี้ครับ (ติดตั้งสำหรับ Python)


วันนี้เราจะมาติดตั้ง OpenCV2.4 กับ Visual C++ 2010 Express ซึ่งก่อนหน้านี้ ผมเคยติดตั้งไปแล้ว บน Windows XP ครับ แต่ไม่ได้เขียนเอาไว้ ตอนนี้ พออัพเกรดเครื่องมาเป็น Windows7 กลับพบว่า Visual C++ 2010 Express กลับมีความแตกต่างไปจากเดิม คือไม่มีการตั้งค่า VC++ Directories ครับ  ถ้าเราเลือกเมนู Tool->Options ที่ Projects and Solutions และรายการย่อย VC++ Directories จะปรากฏข้อความ VC++ Directories edition in Tools>Options has been deprecated ไปเรียบร้อยแล้ว ดังรูป

OpenCV and VC++ Directories issue

หากต้องการกำหนดค่าต่างๆ ให้โปรเจค VC++ ของเราให้เรียกไลบรารี่ของ OpenCV ให้มาทำงานแล้วหล่ะก็ ให้ทำดังต่อไปนี้ครับ

ซอร์ฟแวร์ที่จะทดสอบ OpenCV2.4 ก็มีดังต่อไปนี้ครับ
- ระบบปฏิบัติการ Windows7
- ไลบรารี่ OpenCV2.4.2 บน windows
- โปรแกรม Visual C++ 2010 Express edition

ทำการดาวน์โหลด OpenCV2.4 และแตกไฟล์ OpenCV ไปไว้ที่ใดๆ ก็ได้บนฮาร์ดดิสก์ของเรา ในที่นี้ผมไว้ที่ Drive E:\software\opencv

ติดตั้ง Visual C++ 2010 Express edition หากคุณยังไม่มี 

เมื่อติดตั้งเรียบร้อยแล้ว ให้ทำการกำหนด Path สำหรับ windows ให้มองเห็น OpenCV ก่อน โดยกำหนด Path ใน  Environment Variables โดยให้เราไปก๊อปปี้ path ของ OpenCV ดังนี้

E:\software\opencv\build\x86\vc10\bin
E:\software\opencv\build\common\tbb\ia32\vc10
 
ไปใส่ต่อจาก path เดิมที่มีอยู่ หากตัวสุดท้ายไม่มีเครื่องหมาย ; ให้เราทำการเติมเครื่องหมาย ; ก่อน แล้วจึงนำ path ทั้งสองไปต่อ จะได้ว่า

......พาธเก่า\bin;E:\software\opencv\build\x86\vc10\bin;E:\software\opencv\build\common\tbb\ia32\vc10;

เสร็จแล้ว กด OK ด้วยนะอย่าลืม แล้วทำการรีสตาร์ทคอมพิวเตอร์ 1 ครั้้ง

Environment Variables OpenCV path

กลับมาตั้งค่ากันต่อ ให้เปิดโปรแกรม Visual C++ 2010 Express แล้วทำการสร้างโปรเจค HelloOpenCV ขึ้นมาครับ ตามรูปเลย

Starting Project OpenCV

 

Starting Project OpenCV

 

OpenCV Project Properties

ที่เมนู C/C++ ให้คลิก Edit ที่  Additional Include Directories แล้วทำการ  Browse ไปหาพาธตามนี้ครับ

E:\software\opencv\build\include\opencv
E:\software\opencv\build\include

กด OK

OpenCV Include path config

และที่ Linker>General ให้คลิก Edit ที่    Additional Library Directories แล้วทำการ  Browse ไปหาพาธตามนี้ครับ

E:\software\opencv\build\x86\vc10\lib

กด OK

OpenCV Linker path setting

และที่ Linker>Input ให้คลิก Edit ที่  Additional Dependencies แล้วเพิ่มไฟล์เหล่านี้ลงไป หรือจะก๊อปปี้ไปก็ได้ครับ แต่ต้องแน่ใจนะว่า เวอร์ชั่นที่เรากำลังกำหนดอยู่นี้ ชื่อไฟล์ตรงกัน หากไม่ตรงกัน ให้แก้ไขก่อน

แต่ไฟล์ lib ที่เราจะเพิ่มเข้าไป นั้นมี 2 ชุดนะครับ ซึ่งไฟล์ที่ลงท้ายด้วยตัว ‘d’ นั้นสำหรับ Configuration แบบ Debug และ ที่ไม่มี 'd’ ต่อท้าย สำหรับ Configuration แบบ Release เราต้องทำแยกกันนะครับ

Cofiguration mode

OpenCV lib file input setting

สำหรับ Debug

opencv_core242d.lib
opencv_imgproc242d.lib
opencv_highgui242d.lib
opencv_ml242d.lib
opencv_video242d.lib
opencv_features2d242d.lib
opencv_calib3d242d.lib
opencv_objdetect242d.lib
opencv_contrib242d.lib
opencv_legacy242d.lib
opencv_flann242d.lib

สำหรับ Release

opencv_core242.lib
opencv_imgproc242.lib
opencv_highgui242.lib
opencv_ml242.lib
opencv_video242.lib
opencv_features2d242.lib
opencv_calib3d242.lib
opencv_objdetect242.lib
opencv_contrib242.lib
opencv_legacy242.lib
opencv_flann242.lib

กด OK แล้วก็ Apply แล้วก็ OK อีกครั้งครับ

จากนั้น ให้ทำการแก้ไขโค๊ดที่ไฟล์ HelloOpenCV.cpp ดังนี้

#include "stdafx.h"
#include <cv.h>
#include <cxcore.h>
#include <highgui.h>


int _tmain(int argc, _TCHAR* argv[])

    const char *windowName = "my cats";
    IplImage *img = cvLoadImage("E:\\cat.png"); // อย่าลืมเอารูปไปวางไว้ที่นี่ด้วย
    cvNamedWindow(windowName,1);
    cvShowImage(windowName,img);

    cvWaitKey(0);
    cvDestroyWindow(windowName);
    cvReleaseImage(&img);
    return 0;

}

หากสังเกตให้ดี ตอนที่เรา #include <cv.h> จะมีตัวช่วยขึ้นมา นั่นบ่งบอกว่าโปรแกรม VC++ มองเห็นพาธที่เรากำหนดไว้แล้ว ทำการ
build Solution หรือกด F7 เมื่อเขียนโปรแกรมตัวอย่างเสร็จ  หากไม่มีอะไรผิดพลาด ควรจะได้ข้อความ

"========== Build: 1 succeeded, 0 failed, 0 up-to-date, 0 skipped =========="

แล้วกด F5 หรือ Start Debugging จากเมนู Debug รูป cat.png ก็จะปรากฏบนหน้าต่าง my cats ของเราครับ

HelloOpenCV

ศึกษาเอกสารเพิ่มเติมจาก http://opencv.org/

ขอบคุณที่มา Jebson’s blog สำหรับการติดตั้งบน VC++ 2010

ขอให้สนุกกับ OpenCV นะครับ

อ่านเพิ่มเติม...
 

แจกฟรี พื้นที่ฝากไฟล์ 2 GB

ads

ติดตามข่าวสารผ่าน Twitter

ติดตาม Blog นี้

About Me

My photo

สวัสดีครับ ชื่อเปิ้ลนะครับ ถ้ามีอะไรให้ช่วยเหลือได้ ก็จะช่วยครับ
ผมได้สร้างบล๊อกไว้ เพื่อเก็บรวบรวมความรู้ และประสบการณ์ในการทำงานครับ แวะไปเยี่ยมชมกันได้ครับ http://mechacity.blogspot.com และบล๊อก http://faker-programmer.blogspot.com ครับ

Blog อื่นๆของฉัน

จำนวนการเยี่ยมชมบล๊อก