Deep Zoom บน hosting space


 

0Deep Zoom Composer
Prepare images for use with the Deep Zoom feature in Silverlight 2 Beta 1

SilverlightStreaming Silverlight Streaming

Download Source: <Deep Zoom Composer Project>

การแนะนำคร่าวๆ
Deep Zoom เป็นเครื่องมือที่ใช้ในการเตรียมรูปภาพสำหรับใช้ การซูมลึก (Deep Zoom) ซึ่งเป็นความสามารถที่แสดงอยู่ใน Silverlight 2 เบต้า 1
ในเวลานี้ การลึกซูมเป็นเทคโนโลยีใน Silverlight ยอมให้ผู้ใช้งานสามารถที่จะดูรูปภาพบนเวบได้อย่างราบรื่น อย่างไม่เคยมีมาก่อน
รูปภาพที่ใช้ควรเป็นรูปภาพคุณภาพสูง เพื่อตระเตรียมสำหรับใช้กับการซูมลึก และเครื่องมือนี้ยอมให้ผู้ใช้งานสร้างแฟ้มการซูมลึก, ควบคุมการจัดภาพส่วนต่างๆ การวางตำแหน่งภาพ ทั้งหมดหและสามารถส่งออกแฟ้มจำเป็นสำหรับจัดให้เหมาะสมกับ Silverlight 2 ซึ่งสามารถนำไปเปิดใน VS2008 หรือ Microsoft Expression Blend ได้

Demo:

http://silverlight.services.live.com/invoke/68535/TestDeepSoom/iframe.html

1. เปิดโปรแกรม Deep Zoom Composer

7 

2. New Project

8 9

3. Add Image…

10  11 12

4. Compose Workspace

 13 14

5. ลาก Image จาก Layer View มาวางบน Workspace

 15 16

6. จัดตำแหน่งตามใจชอบ แล้วทำการ Export

17  1819

7. Export complete สามารถทดสอบดูผลได้ โดยคลิก Preview in Browser

 20

8. ผลการ Preview in Browser

212223

9. สามารถเปิด Project บน Export บน VS2008

 24 2526

10. View in Browser จาก VS2008 ได้เช่นกัน

 27 28

11. โค้ดที่ Deep Zoom Composer gen ให้

29 30

public application

public application to hosting space: http://silverlight.live.com/

hostingSpace

12. Zip Project DeepZoomOutput_Web

31

13. สร้าง Account บน  Silverlight Streaming

1 1_1

14. Login ด้วย Windows Live ID

2 3

15. Create Silverlight Streaming Account ,Generate Account Key

4 5 6

16. Manage Applications

32 33 

17. Upload Application ที่เรา Zip ไว้ในข้อ 12

343536

18. Configuration this Application

37  38

 

19. ทดสอบแอพพลิเคชัน (Launch Application)

3940

20. Application Test Page

41 42

เอาไปใช้งานบน Internet

21. Copy โค้ดเหล่านี้ไปวาง ณ จุดที่เราต้องการให้มันแสดง ในหน้าเว็บของเรา

43

22. เช่น: <iframe src=http://silverlight.services.live.com/invoke/Account ID/thailand/iframe.html scrolling="no" frameborder="0" style="width:800px; height:600px"></iframe>

44 45 46

 

เอาไปใช้งานบน WebServer ของเรา

23. จากข้อ 12 ถ้าเราต้องการ เอาแอพพลิเคชัน (Silverlight) ที่ได้จากการเจนเนอเรตของ DeepZoom ไปรันบน WebServer ของบริษัท หรือของเราเอง ไม่ว่าจะเป็นบน อินเทอร์เน็ต (Internet) หรือ อินทราเน็ต (Intranet) มีสองวิธีดังนี้

1. โดยการ Copy ให้ทำการ Copy folder DeepZoomOutput_Web จากข้อ 12 ไปที่ => C:Inetpubwwwroot (หรือ root ของ WebServer)

2. สร้าง Virtual Directory… โดยการคลิกขวาบน folder DeepZoomOutput_Web เลือก Propertice=>WebSharing=>Share thie folder =>Alias:ตั้งชื่อตามต้องการ =>OK

โดยการ Copy สร้าง Virtual Directory

24.ทดสอบ (Test) run จาก Root ของ WebServer

 3 run จาก Root ของ WebServer

25.ทดสอบ (Test) run จาก Virtual Directory… ต้องเปิด Permission ให้ Anonymous Access ดังรูป

set permission Anonymous Access

ได้ผลเหมือนกัน ต่างกันตรง url ที่ใช้เรียก

run จาก Virtual Directory

ขอบคุณภาพตัวอย่างจาก: http://www.bigfoto.com/asia/bangkok/index.htm

 

 

Advertisements
เกี่ยวกับ

Nuchit Atjanawat is a Microsoft MVP, GreatFriends Community Leader, WindowsITPro Columnist(Mr.Nano), Silverlight Business Application Instructor, Speaker in various Microsoft events, Author, passionate Blogger and a Software Engineer by profession. He has a very good skill over Silverlight, LightSwitch, C#, XAML & Blend. He shares his technical findings, tutorials in his technical blog. Follow his Blog and Facebook page to be updated on latest articles. - Technical Blog: https://janawat.wordpress.com - WindowsITPro Columnist(Mr.Nano): http://windowsitpro.net - The GreatFriends.Biz Community Discussion Board (nano): http://greatfriends.biz - witter: https://twitter.com/janawat - Facebook Page: https://www.facebook.com/nuchit - Instructor: http://bit.ly/GF250-01, http://bit.ly/GF150-02

เขียนใน Silverlight
2 comments on “Deep Zoom บน hosting space
  1. Jacky พูดว่า:

    หากเราจะทำให้ Zoom ตามตำแหน่งที่กำหนดเป็นรายการใว้ได้หรือเปล่าครับ เช่น มีรูป 10 รูป เราอาจทำปุ่มให้คลิกใว้สามารถเลือก Zoom ทีละภาพได้คล้าย ๆ การบันทักรายการโปรแกรมใน Google Map นะครับ ขอบคุณครับ

  2. puzzle พูดว่า:

    หากเราจะใช้deep zoom กับblend เราจะนำมาใช้เ้วยกันได้อย่างไรคะิblend ไฟล์สกุลsln เราจำนำ deep zoom มาใช้ได้อย่างไรอ่ะคะ ช่วยแนะนำหน่อยนะคะ ขอบคุณค่ะ

ใส่ความเห็น

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / เปลี่ยนแปลง )

Twitter picture

You are commenting using your Twitter account. Log Out / เปลี่ยนแปลง )

Facebook photo

You are commenting using your Facebook account. Log Out / เปลี่ยนแปลง )

Google+ photo

You are commenting using your Google+ account. Log Out / เปลี่ยนแปลง )

Connecting to %s

In Archive