WELCOME TO BLOGGER VQGĐC

THÂN CHÀO QUÝ BẠN
CLICK HERE TO OPEN

Tất cả hình ảnh, những hoạt động cùng cơ sở Định Chuẩn rồi cũng cùng với thời gian rơi vào khoảng không
Nếu còn gì rớt lại chỉ là những tình cảm của những con người đã một thời làm việc chung dưới một mái nhà
mà nay đả tản mác khắp bốn phương trời
Ninh Vũ / Phòng Thí Nghiệm VQGĐC

Wednesday, December 23, 2015

TỰ TẠO OBJECTS DÙNG ĐỂ VIẾT JAVASCRIPT PROGRAMS.

CREATING YOUR OWN OBJECTS USED FOR WRITING  JAVASCRIPT PROGRAMS
Muốn viết một javascript program có nhiều đề mục riêng biệt và trong mỗi đề mục chúng ta tha hồ̉ muốn viết gì tuỳ ý thì chúng ta phải biết cách tự tạo ra nhiều objects.
Mỗi object là một đề mụ̣c có tên giống nhau nhưng có nội dung khác nhau hoặc mỗi object có tên khác nhau với nội dung khác nhau.
Trong trường hợp nầy, chúng ta phải xử dụng  constructor function.

Constructor function có nhiệm vụ vừa tạo ra những objects vưà thi hành những nhiệm vụ khác cùng một lúc.
Điều kiện để cho một regular function tự động trở thành constructor function là trong function phải có chữ this (keyword this) .
Chữ this sẽ cột buộc( bound to ) với new object mà chúng ta sẽ tạo ra  

Sau khi tạo xong những new objects, chúng ta có thể dùng một javaScript function khác để display những values của new object mà chúng ta muốn xuất hịên sau cùng
Thí du.
Chúng ta muốn viết một javaScript program giới thiệu Blogger VQGĐC gồm có 6 đề mục thì chúng ta phải tự tạo ra 6 objects như sau.
 
* Viết function createobject() để declare object.
* Dùng chữ this cho mỗi object . Nếu muốn có nhiều objects thì dùng chữ this nhiều lần tuỳ ý. Khi viết chữ this trong function thì function createobject() tự động trở thành constructor function. 

Khi đã có constructor function rồi, chúng ta tha hồ tạo ra những new object bằng cách viết như sau.  
            var  myobject = new createobject().
            var  obj = new createobject().
            var  xaoke = new createobject().

 myobject, obj,  xaoke  là  những new objects chúng ta tư tạo ra.
* Phải dùng chữ  new để instantiate object function tức là dành chỗ trong memory cho object function. ( We allocate a memory space for object function with the new operator or new keyword.)
Dùng dấu chấm dot để cho properties hay method tiếp cận với new object đã tạo.
Thí dụ  : myobject.first, myobject.second


Tóm tắt thêm như sau.
Khi trong function  có chữ this, thì function đó tự động trở thành constructor function.
Muốn call hay invoke constructor function thì viết chữ new trước tên của function .
Chữ new tạo ra một blank object.Object nầy invokes the function để function  chuyển (passing) blank object tới chữ this.
Chữ new nói với chữ this hướng về object đã được dành chỗ trong memory(The keyword new tells this to point to the object that's being instantiated).
Khi constructor function executes thì có new object.

Chữ new còn có thêm nhiệm vụ là dành chỗ trong memory cho new object




Đây là sự xuất hiện của một JavaScript Program giới thiệu VQGĐC/VNCH.
                              Xem JavaScript Program code phía trên.

WELCOME TO : VIỆN QUỐC GIA ĐỊNH CHUẨN/VNCH
THÂN CHÀO QUY BẠN
BLOGGER NẦY TÀN TRỬ TÀI LIỆU LỊCH SỮ CỦA VQGĐC, KINH NGHIỆM NGHỀ CHUYÊN MÔN KHOA HỌC KỸ THUẬT, GHI CHÉP KINH NGHIỆM TU HỌC PHẬT VÀ THIÊN CHÚA
CẦU CHÚC QUÝ BẠN LUÔN LUÔN THĂNG TIẾN



CLICK HERE TO OPEN BLOGGER

TÌM HIỂU SÂU VỀ CHỮ THIS (Keyword this)
* Chữ this viết trong function A hay trong một method luôn luôn ám chỉ (refers to) cho một object và nắm giử value của object đó mặc dầu chúng ta chưa biết tên của object.Object nầy sẽ  kích động hay call ( will invoke or call) function A.
* Nếu chữ this viết ngoài function A thì  chữ this nắm giử undefined value, không ám chỉ tới object nào hết.
*Chúng ta xử dụng chữ this để tiếp cận (access to) với properties và methods của object.Nghĩa la chữ this làm đại diện cho invoking object của function A và chỉ có value nếu đứng trước tên của function A có chữ new gọi  là new operator. Nếu thiếu chữ new thì chữ this không hướng về object nữa nên object không invoke function A.

* Khi function A kićh động ( executes) thì  function A  sẽ lấy value của chữ this.Value của chữ this là value của object kich động function A có chứa chữ this.

* Khi dùng chữ this  trong function thì chúng ta nên biết ngay chữ this đại diên cho object.Thí dụ. Bé TUẤN CHAY QUÁ MAU VÌ NÓ SƠ TRỂ XE BUS. Tuấn là object, NÓ là chữ this .Vì không muốn lặp lại chữ TUẤN một lần nữa nên thay thế bằng chữ this.

Sunday, December 13, 2015

JAVASCRIPT PROGRAMS TỒN TRỬ DATA TRONG XÍ NGHIỆP NHỎ.

JAVASCRIPT PROGRAMS TỒN TRỬ  DATA TRONG XÍ NGHIỆP NHỎ
               DÙNG  PROMPT( ) ,SWITCH( ), BREAK 

 Copy and paste vào script tags                 


// TỒN TRỬ DATA CỦA CÔNG NHÂN
                       
var name = prompt("Write the name you look for.");
    switch (name){
    case "jeff": alert("JEFF, 25$, Designer");// Phải có chữ case
        break;
    case "paul" :alert("PAUL , 20$, Electrician");
        break;
    case "bob" :alert("BOB , 21$, Photographer");
        break;
    case "charle" :alert("CHARLE , 18$,Controller");
        break;
    case "quan" :alert("QUAN , 19$,Clerk");
        break;
    case "jose" :alert("JOSE , 18$,Telephonist");
        break;
    default : alert ("Another file");
 }


// TỒN TRỬ T-SHIRTS
var size = prompt("VIẾT THEO UPPER CASE VÀO ĐÂY SIZE MUỐN TÌM ");
    switch (size){
    case "SMALL": alert("KÊ SỐ 10");// Phải có chữ case
        break;
    case "MEDIUM" :alert("KỆ SỐ 12");
        break;
    case "LARGE" :alert("KỆ SỐ 14");
        break;
    case "X-LARGE" :alert("KỆ SỐ 16");
        break;
    case "XX-LARGE" :alert("KỆ SỐ 18");
    default : alert ("Another file");
 }

// TỒN TRỬ MÀU MỰC IN  VẢI SỢI.

var color = prompt("Write the color name you want.");
    switch (color){
    case "red": alert("248,1,A");// Phải có chữ case
        break;
    case "blue" :alert("293,2,A");
        break;
    case "brown" :alert("695,11,C");
        break;
    case "yellow" :alert("393,13,F");
        break;
    case "purple" :alert("2395,10,G");
        break;
    case "green" :alert("3245,12,A");
        break;
    default : alert ("Another file");

 }

Friday, November 27, 2015

TÓM TẮT LỊCH SỮ LỄ THANKSGIVING CỦA HOA KỲ

TÓM TẮT LỊCH SỮ LỄ THANKSGIVING CỦA HOA KỲ

Replica of the original Mayflower Ship
was built in Devon,England during 1955-1956.
The ship is 32m long by 7.6m wide, 4 masts and 6 sails.

102 người nước Anh trong đó có 41 người Pilgrims theo đạo Tin Lành Puritan bị cấm đạo lên chiếc tàu gổ Mayflower do công ty London Virginia Company tài trợ, cho vay trả nợ sau và được chấp thuân của vua nước Anh, rời cảng Plymouth vào ngày 6 September1620 để tìm đến miền đất mới được tự do thờ phượng Thiên Chúa.

Một phần ba trong 102 người là trẻ mồ côi.
Sau 66 ngày vượt 3000 miles chịu sóng gió đầy nguy hiểm trên biển Đại Tây Dương, họ thả neo gần Cape Cod vào ngày 9 November 1620.Sau đó họ thành lập làng Plymouth tại tiểu bang Massachusetts

Năm 1621 họ trúng mùa trồng bắp đầu tiên tại miền đất mới lạ nhờ lao động cần cù,những ngườì còn sống sót chọn ngày 13 December 1621 để cử hành lễ Cảm Tạ Đức Thượng Đế goị THANK GOD lần đầu tiên kéo dài trong 3 ngày với 91 người bạn mới là thổ dân Indian đã tận tình giúp đở họ sống còn.
Họ được người Indian hướng dẫn cách trồng bắp,cách bắt cá trong sông,cách lấy sáp từ cây maple để chế ra mật ngọt syrup, nhận diện tên những giống cây độc hại v.v…

Mãi đến năm 1789, USA mới cử hành lần đầu tiên ngày goị  là  THANKSGIVING TO GOD.
Sau đó đến năm 1863 President Lincoln quyết định chọn ngày thứ Năm lần thứ tư của tháng November để cử hành lễ Thanksgiving Holiday cho toàn quốc USA.

Trung tuần tháng mười năm1970, người viết bài nầy và một người bạn là Kỹ Sư Vũ Duy Đề ( hiện ở Canada ) trong thời gian đi tu nghiệp tại US Army Natick Laboratories,Mass đã được ông bà Walter,Earline Brown đưa đi Cape Cod thăm làng Plymouth rồi lên tàu Mayflower REPLICA quan sát bên trong. Mayflower lúc đó là tàu đóng lại nhái theo mô hình cũ đã mục nát từ lâu.


TÀI LIỆU HÀNH TRÌNH CỦA TÀU MAYFLOWER

Tàu gổ Mayflower được thuê tại London để tới Southampson chở thực phẫm và tiếp liệu mua tại đây.
Những người Pilgrims đang sinh sống tại thầnh phố Leiden, xứ Hòa Lan đã thuê một chiếc tàu tên là Speedwell chở họ từ cảng Dartmouth , Hoà Lan tới Southampton, Anh Quốc để gặp tàu Mayflower như đã hẹn trước rồi cùng nhau ra khơi để đi qua VIRGINIA Châu Mỹ.
Trên đường từ Hòa Lan tới Southampson ,tàu Speedwell bị có lổ thủng nên nước biển lọt vào . Cuộc hành trình bị hoản lại một tuần đế vá lổ thủng.

Ngày 5 tháng Tám 1920 cả hai chiếc tàu Mayflower và Speedwell cùng nhau ra khơi đi Mỹ Châu.Nhưng tàu Speedwell bì nước lọt vào một lần nữa nên cả hai  tàu phải cùng quay trở lại cảng Dartmouth , Hoà Lan để vá lổ thủng.

Ngày 21 tháng Tám năm 1620 , sau khi vá lổ thủng cả hai tàu cùng ra khơi đi Mỹ Châu.
 Ra khơi được 300miles thi tàu Speewell bị nước biển bắt đầu lọt vào nữa cho nên cả hai  tàu phải quay trở lại cảng Plymouth, England để bỏ tàu Speedwell ở lại rồi chuyển hết hàng hóa và người lên tàu Mayflower.
Một số hành khách trở nên quá mệt mỏi và chán nản vì sự ra đi bị trì hỏan nên đã huỷ bỏ việc đi Mỹ Châu và trở về nhà.

Số người còn lại bị dồn xuống tàu Mayflower nên bị quá chật chội.
Cuối cùng vào ngày 6 tháng chín năm 1620  tàu  gổ Mayflower rời hải cảng Plymouth, England ra khơi theo hướng đi Châu Mỹ nhưng đã phải dừng lại tại Newlyn in Cornwal để lấy nước vì nước ở Plymouth city đã gây bịnh tiêu chảy và nóng sốt.
Tàu đến Cape Cod ngày 9 tháng November 1620.

KỂ CHUYỆN HÀNH TRÌNH CỦA TÀU MAYFLOWER.

Nữa cuộc hành trình Mayflower đi rất êm ả,chỉ có vấn đề chính là say sóng sea sickness mà thôi.
Nhưng đến tháng mười thì bắt đầu có bảo tố ở Đại Tây Dương làm cho Mayflower ở trong tình trạng rất nguy hiểm.Có nhiều lần gió mạnh đến nổi keó tàu trôi theo gío cho nên phải hạ cột buờm.

Người Pilgrims trước khi ra đi đã dự tính sẽ cặp bến tại Northern Virginia nơi đất trồng trọt bỏ hoang đang dành cho họ tới khai thác sinh sống tự do không cần mua.
Khi Mayflower tới Cape Cod  vào lúc mặt trời mọc ngày 9 tháng November 1620 thì họ quyết định tiếp tục xuống hứơng nam để tới khu đồn đền trồng trọt.
 Khi vừa khởi hành ra khơi theo hướng nam thì gặp sóng rất lớn ,tàu sắp chìm xuống biển nên họ phải quay trở lại rồi cặp bến tại Provincetown Harbor.
Tháng kế tiếp họ xuống tàu đi thám hiểm tìm chỗ trồng trọt và dựng nhà trú ẩn.
Ngaỳ December 25, 1620, họ quyết định chọn Plymouth làm chỗ ở rồi xây dựng nhà cữa.

TRANG BỊ VÀ ĐỜI SỐNG CỦA DI DÂN TRÊN TÀU MAYFLOWER.

Nơi chốn và năm ngườ ta đã đóng tàu Mayflower không có ai biết chính xác.Nhưng chỗ tàu được hạ thuỷ là hải cảng HARWICH trong quận ESSEX, nước Anh .
Mười một năm trước khi tàu Mayflower được cho thuê để chở người Pilgrims, người làm chủ tàu là thuyền trưởng Captain Christopher Jones (1570- ) sinh ra tại HARWICH.
Thomas Weston thuê tàu Mayflower của Jones để chở Pilgrims đi Châu Mỹ.

Tàu gổ Mayflower dài 32 mét, rộng 7,6 mét, có 4 trụ buồm masts và có 6 vải buồm sails.
Mayflower có mang theo 2 tàu nhỏ dùng cấp cứu, mỗi chiếc dài 21 foot có cột buồm và mái chèo.
Mayflower mang theo 6 khẩu súng đại bác để phòng chống tàu của Pháp và tàu của Tây Ban Nha có thể tấn công trên biển.Họ cũng lo sợ cướp biển và người Native Indians bản xứ tấn công nữa.
Dụng cụ để định hướng đi gồm có đia bàn, dụng cụ đo tốc độ của tàu tính theo nautical miles hay knots và đồng hồ kiếng cổ điển gọi là hour glass.

Thực phẫm,dung cụ và đồ tiếp liệu được để dưới hầm tàu.Nước ,rượu bia,thịt khô,rau khô,bột mì và bánh biscuits được chứa trong các hòm barrels Tàu ra đi chậm trể hơn một tháng nên số lượng thực phẫm bị xuống thấp dưới mức đã dự trử vì phải nuôi ăn uống khách hàng trên tàu .

Th ú vật gồm có dê,chó,mèo,gà vịt,chim  được cho mang theo nhốt dưới hầm tàu.Không đem theo ngựa.

HÀNH KHÁCH VÀ NHÂN VIÊN CỦA TÀU.

Mayflower có 102 hành khách gồm có : 41 người Separatists, aka Puritans và Pilgrims, 11 bé gái,19 bé trai.Nhân viên làm việc trên tàu  là 25-30 người. Tổng cộng người trên Mayflower là 130.

Nhân viên làm việc cho Mayflower gồm có : the pilot, a carpenter, a cooper (barrel maker), a bosun, a gunner, a cook, quartermasters, and the ship’s merchant (purser). Họ có chỗ ngủ riêng và thay phiên nhau đi ngủ.

Còn hành khách, mỗi gia đình được cấp một khoảng không gian rất nhỏ để chứa đựng hành lý mang theo.

Chỗ ngủ của hành khách  có trần rất thấp,những người cao quá 5 feet không thể đứng dậy được.Trong suốt thời gian của hành trình vượt biển, hành khách phải chấp nhận ở dưới hầm tàu ẩm thấp,không có ánh sáng và lạnh.Khi nào trời tốt, họ lên nóc tàu ngắm biển.Khi biển động họ không dám lên sẽ bị quật xuống biển( thrown overboard) .

Không có chỗ đi cầu, họ phải dùng thùng gỗ khi cần đi đại và tiểu tiện.

Thực phẫm được nấu chung cùng một lúc trong bếp lò bằng sắt chứa cát và cấp phát mỗi ngaỳ. Nhân viên của Mayflower nấu ăn riêng trong cái bếp ở trên tàu.

Nước uống của mọi người trên Mayflower là rượu bia hay rượu nho thay cho nước vì sợ nước gây bịnh tiêu chảy.Món ăn hằng ngaỳ là Salt fish, hard tack, salt beef, and cheese.

Trong thời gian của hành trình vượt biển không ai được tắm, giặt quần áo vì không có nước cho nên quần áo rất dơ bẩn và bị rách nát khi cặp bến Cape Cod.

Đời sống của hành khách trên Mayflower rất buồn chán,thường ngày họ bàn tán với nhau chương trình xây dựng tương lại tại vùng kinh tế mới ở Virginia Mỹ Châu.

Họ chơi cờ tướng kiểu Âu Châu gọi là Chess,tập thể dục, ca hát và cầu nguyện mỗi ngaỳ. Lễ theo tôn giao kéo dài suốt cả ngày Chúa Nhật.(Sunday services lasted all day ).

Trong thời gian hành trình họ đã cùng nhau cam kết hợp tác sống chết có nhau bằng cách thảo ra một Mayflower Compact.

 SUNSET PLAZA MOTEL(ROUTE 9/ MA / USA)

Đây là hình chụp Sunset Plaza Motel cách xa Boston 23.6 miles.
Hai Sĩ Quan Quân Nhu QL/VNCH đã tạm trú trong một phòng trên lâu sơn màu trắng
 của Motel trong 3 tháng cuối năm 1970 rồi  sau đó di chuyển xuống
tu nghiệp tại Textiles Laboratory, City Philadelphia.

Người viết bài nầy là Sĩ Quan Kỹ Sư Trưởng Phòng Trắc Nghiệm Vải Sợi Quân Nhu QL/VNCH đã tạm trú tại motel nầy cùng với bạn là Kỹ Sư Vũ Duy Đề (Trưởng Phòng Trắc Nghiệm Thực Phẫm Quân Nhu QL/VNCH) trong suốt thời gian đi tu nghiệp tại US Army Natick Laboratories.

Cố vấn Mỹ của Cục Quân Nhu năm 1970 là Kỹ Sư Thiếu Tá SULLIVAN, quê ở Little Rock, Bang Arkansas,USA đã soan thảo chương trình gửi đi tu nghiệp.

Friday, November 20, 2015

DRAWING A FISH MOVING AROUND AN ELLIPSE PATH


HỌC VẼ CON CÁ DI CHUYỂN TRÊN PATH ELLIPSE.
SVG (Scalable Vector Graphics) là ngôn ngữ ( language ) dùng để vẽ hình hai chiều trong Browser bằng cách viết code, chữ và số trong XML đã thành tiêu chuẩn quốc tế W3 từ năm 1999. Do đó nếu Browser nào không hổ trợ SVG thì không thể vẽ gì được.
Với SVG,chúng ta có thể vẽ được 3 loại hình là : Vector Graphics Shapes, Images, Text
SVG có những tiện lợi là dễ thực hành, đơn giản, dễ nhớ và hình vẽ làm di động rất dể dàng với SMIL ( Synchronized Multimedia Integration Language ) nếu cần.
Chúng ta có thể làm hình vẽ SVG thu nhỏ hay phình lớn tuỳ theo kích thước của màn hình monitor nhưng hình không bị nhòa như hình bitmap vẽ bằng html 5 Canvas.
 
1-HỌC VIẾT CODES VẼ HÌNH ELLIPSE.
Đây là codes làm xuất hiên một hình ellipse .
 
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%">
<g > 
 <ellipse cx ="300" cy="260" rx = "140" ry = "80"
 stroke="red" stroke-width="4" fill="none"/>
</g>
</svg>
Ghi chú hướng dẫn.
Toạ độ tâm của ellipse là cx ="300" cy="260"
Trục ngang và trục đứng của ellipse là rx = "140" ry = "80"
 
2-HỌC VIẾT CODES VẼ PATH ELLIPSE.
Vẽ  path ellipse rất phức tạp. Con cá chỉ có thể di chuyển trên path ellipse  chứ không thể di chuyển trên hình ellipse.
Đây là codes vẽ  path ellipse khép kín.
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%">
<g> // Vẽ ellipse
<path id = "ellipse" 
       d = " M 225,275
                a 100,50  0  1,1  0,0.0009 " Z
           stroke = "red"  stroke-width = "4"  fill = "none" />
</g>
</svg>
 
GHI CHÚ HƯỚNG DẪN .
Tọa độ khởi hành là d = " M 225,275, chính là tâm của đường goị la ellipse path .
Phân tách những con số trong :  a 100,50  0  1,1  0,0.0009
a là command of elliptical arc.
100,50 là trục ngang và trục đứng của ellipse.
0 là góc quay bắt buộc phải có của ellipse.Nếu thiếu thì hình không hiện ra.
1,1 : số 1 đầu tiên  của large arc- flag  cho biết ellipse sẽ lớn hơn 180 độ và số 1 tiếp theo là của sweep-flag cho biết ellipse sẽ quay theo chiều dương cùng với chiều kim đồng hồ.Hai con số nầy bắt buộc phải có.
Tại sao ? Lý do như sau để chỉ cho chúng ta biết góc quay của trục ellipse path.
* 1,0 ellipse sẽ lớn hơn 180 độ và quay theo chiều ngược kim đồng hồ.
* 1,1 ellipse sẽ lớn hơn 180 độ và quay theo chiều kim đồng hồ.
* 0,1 ellipse sẽ nhỏ hơn 180 độ và quay theo chiều kim đồng hồ
* 0,0 ellipse sẽ nhỏ hơn 180 độ và quay theo chiều ngược kim đồng hồ.
0,0.0009 : con số nầy cho biết ellipse sẽ khép kin.
0,0.009 : con số nầy cho biết ellipse bị hở chút xíu.
0,1 : con số nầy cho biết ellipse sẽ hở rất lớn.
 
KHI CHÚNG TA HIỂU TỚI ĐÂY RỒI THÌ THA HỒ VẼ PATH ELLIPSE TUỲ Ý MUỐN
Điều kiện muốn vẽ ellipse path phải có 7 parameters nhưng người viết chỉ nêu ra phần thực hành mà thôi để giúp quý bạn không bị lẫn lộn khi muốn vẽ được ngay.

SVG có một đặc điểm rất hay gọi là transform attribute. Dùng đặc điểm nầy chúng ta có thể thay đổi vị trí của tọa độ, thay đổi hình dạ̣ng và thay đổi độ lớn hay độ nhỏ của hình vẽ mà không cần phải vẽ lại hình khác.
Transform attribute của SVG gồm có.
* transform=” translate(x,y)” để chuyển đổi vị trí toạ độ nếu hình vẽ bị che khuất.
  Thí dụ transform=” translate(175, 150)”.Nếu không xác định y thì default sẽ cho 0
* transform=” scale (x,y)” để thay đổi hình vẽ lớn hơn hay nhỏ hơn tùy ý.
  Thí dụ transform="scale(0.5)”.Nếu chỉ chọn một con số cho scale mà thôi thì tòan bộ thành phần của hình sẽ theo scale của con số đó.
* transform=”rotate(angle,cx,cy)” để xoay chuyển hình vẽ theo góc độ và thay đổi tâm (center ) của hình.
   Thí dụ transform=” rotate(45,100,100)”.Nếu không xác định cx và cy thì default sẽ rotate chung  quanh vị trí đã có ( rotates around the origin)
* transform=”skewX(angle)” làm hình nghiên vào trục X.
  Thí dụ transform=”skewX(5)”.Khỏang cách giữa hình và trục là tan của góc ( the distance of skew is the tan of the angle)
* transform=”skewY(angle)” làm hình nghiên vào trục Y
  Thí dụ transform=” skewY(5)"
 
 
3- RÁP CODES VẼ ELLIPSE PATH VÀO CHUNG VỚI CODES VẼ CÁ
 
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%">
<g> //  Viết codes vẽ  path ellipse
<path id = "ellipse" 
           d = " M 225,275
                   a 180,100  0  1,1  0,0.0009 " Z
           stroke = "green"  stroke-width = "4"  fill = "none" />
</g>
 
<g transform="translate(-160,-160)">
// Viết codes vẽ con cá
<path d="M 200 160,C250 200,350 120,200 160,
          L 200 160,180 170,
          L 200 160,175 150,
          C 175 150,185 160,180 170 z"
          stroke="red" stroke-width="2" fill="green"/>
<circle cx="260" cy="155" r="3" stroke="black" fill="blue"/>
<animateMotion dur="10" rotate="auto" repeatCount="indefinite">
<mpath xlink:href="#ellipse"/>
</animateMotion>
</g>
</svg>
HƯỚNG DẪN VIẾT CODES VẼ CON CÁ.
Muốn cho con cá nằm trên hình ellipse path thì phải viết
<g transform=" translate(-160,-160)"> có chứa tọa độ  x = - 160, y= - 160
Nếu thiếu chữ translate thì tọa độ sẽ tự động theo default  là  ZERO.
Vì vậy khi vẽ hình theo SVG phải luôn nhớ viết chữ transform = " translate(x,y) “

Khi vẽ con cá  thì cần phải dùng đường cong có ký hiệu C nghĩa là curve, đường thẳng có ký hiệu L và vòng tròn ( trong bài nầy vẽ con mắt tròn của cá có bán kinh  r=3 px ở tọa độ cx=260  cy=155 )
 
Đây là tọa độ của con cá chưa có con mắt tròn. Và chưa có cái đuôi đầy đủ.
path d="M 200 160,C250 200,350 120,200 160,
          L 200 160,180 170,
          L 200 160,175 150 z"
Path khởi hành từ tọa độ M 200 160.,theo đường cong tới 3 tọa độ C 250 200,350 120,200 160,
Rồi theo đường thẳng tới 4 tọa độ  L 200 160,180 170, L 200 160,175 150
và tới 3 toạ độ C 175 150,185 160,180 170
Đây những tọa độ của cái đuôi cá. :  C 175 150,185 160,180 170
Muốn có đuôi đầy đủ thì viết tọa độ nầy vào như trên.

4-LÀM CHO CON CÁ DI CHUYỂN TỰ ĐỘNG VÀ KHÔNG DỪNG LẠI.
  THÌ VIẾT CODES NHƯ SAU CHO MỘT VÒNG DI CHUYỂN MẤT 10 seconds.

<animateMotion dur="10" rotate="auto" repeatCount="indefinite">
<mpath xlink:href="#uphill"/>


CON CÁ DI CHUYỂN CHUNG QUANH VÒNG ELLIPSE PATH


TẠO NÚT START VÀ STOP
 
<svg xmlns="http://www.w3.org/2000/svg"
         xmlns:xlink="http://www.w3.org/1999/xlink"
             width="100%" height="100%">

<g> //  Viết codes vẽ path ellipse
<path id = "ellipse"
           d = " M 225,275
                   a 180,100  0  1,1  0,0.0009 " Z
           stroke = "green"  stroke-width = "4"  fill = "none" />
</g>

<g transform="translate(-160,-160)">

// Viết codes vẽ con cá
<path d="M 200 160,C250 200,350 120,200 160,
          L 200 160,180 170,
          L 200 160,175 150,
          C 175 150,185 160,180 170 z"
          stroke="red" stroke-width="2" fill="green"/>
<circle cx="260" cy="155" r="3" stroke="black" fill="blue"/>

// Viết codes làm cá chuyển động có nút START Và STOP
<animateMotion dur="10" rotate="auto" repeatCount="indefinite"
 begin ="B.click" end="S.click">

<mpath xlink:href="#ellipse"/>
</animateMotion>

//Viết codes cuả nút START và STOP
</g>
<g id ="B">
<text x = "250" y = "150" font-size ="15"  font-family = "arial" fill="blue" >START</g>
<g id = "S">
<text x = "80" y = "50" font-size ="15"  font-family = "arial" fill="red" >STOP</g>
</g>


</svg>

 CẦU CHÚC QUÝ BẠN THỰC HÀNH THÀNH CÔNG.
Henry Dương (aka He H Dương)