SVG روشی استاندارد جهت نمایشهای دو بعدی بر روی اینترنت که قابلیتهای کارتوگرافی ویژه را در این محیط فراهم می کند.
•SVG  زبانی بر پایه XML(eXtensible Markup Language)
•با استفاده از زبانهای اسکریپت سازی ازقبیل Javascript تصاویر می توانند به هر دو روش Interactive  و Dynamic  در  Web Browser نمایش داده شوند.

مهمترین کاربردهای این سیستم عبارتند از :

•قابلیت های متفاوت نمایش مکانهای خاص بر روی نقشه
•توانایی Zoom و Pan  که به دو روش قابل انجام است یا با کلیک دکمه راست موس و یا با انتخاب مقدار Zoom از لیست انتخابی .

 

SVG روشی استاندارد جهت نمایشهای دو بعدی بر روی اینترنت که قابلیتهای کارتوگرافی ویژه را در این محیط فراهم می کند.
•SVG  زبانی بر پایه XML(eXtensible Markup Language)
•با استفاده از زبانهای اسکریپت سازی ازقبیل Javascript تصاویر می توانند به هر دو روش Interactive  و Dynamic  در  Web Browser نمایش داده شوند.

مهمترین کاربردهای این سیستم عبارتند از :

•قابلیت های متفاوت نمایش مکانهای خاص بر روی نقشه
•توانایی Zoom و Pan  که به دو روش قابل انجام است یا با کلیک دکمه راست موس و یا با انتخاب مقدار Zoom از لیست انتخابی .

Pan  نیز به دو روش قابل انجام می باشد یا با نگه داشتن دکمه Alt واستفاده از دکمه راست موس و یا با کشیدن مستطیل سبز رنگ بر روی نقشه Overview

 

•تغییرات متقابل رنگ لایه ها بر روی نقشه
•قابلیت دسترسی به مدارک مختلف از طریق ساختار درختی
•نمایش انتخابی عوارض جغرافیایی با انتخاب یا عدم انتخاب Check Box های نقشه
•نمایش   Scale Bar
•نمایش مختصات نقشه
•فراخوانی داده از منابع مختلف
•SVG می تواند به پروژه های GIS اعمال شود چراکه کاملا“ازابزارهای  Open Source  استفاده می کند که باعث کاهش هزینه های اجرا می گردد.

مزایای SVG نسبت به فرمتهای   JPG,GIF

•این فرمت توسط برنامه های بسیاری قابل خواندن است مثل Notepad
•حجم این فایل ها از فرمتهای پیکسلی کم تر است .
•قابلیت تغییر اندازه بدون تغییر کیفیت
•متون نوشته شده در این عکس ها بصورت TEXT بوده و قابل انتخاب و جستجو می باشد.
•با تکنولوژی جاوا کار می کند و یک استاندارد است.
•فایل های SVG کاملا“ XML هستند.
•با زوم روی گرافیک کیفیت پایین نمی آید.
•پشتیبانی برای سایر دستگاهها شامل GPS و موبایلها
•محتوا و انیمیشن dynamic و قابلیت ارتباط برقرار کردن با کاربر به صورت script نویسی
•کیفیت بالای گرادیانت، سایه و سایر افکتها
•کنترل رنگ و دقت رنگ بهبود یافته
•سایز کوچک برای Download
•درجه های مختلف شفافیت transparency

قابل مقایسه ترین برنامه با SVG را میتوان Flash نامید . با این تفاوت که SVG یک استاندارد بیش از فلش دارد و آن موازی بودن تکنولوژی آن با استاندارد هایی مانند XSL و DOM است . در ضمن فلش یک تکنولوژی اوپن سورس نیست . تنها مشکلی که پیش پای SVG قرار دارد این است که هنوز تمام مرورگر ها بصورت کامل از آن پشتیبانی نمی کنند . گرچه میتوان آینده SVG را روشن توصیف کرد . زیرا بنیاد موزیلا و مایکروسافت هر دو برنامه هایی برای پشتیبانی از SVG در مرورگر هایشان دارند ..

 

•توانایی تبادل اطلاعات با کامپیوترهای مختلف مطابق قوانین XML
•بین المللی کردن یا Unicode support
•تبدیل آسان از طریق XML Stylesheet Language Transformation (XSLT)
•همچنین برنامه 5  Adobe Golive  بطور کامل از ویرایش SVG پشتیبانی میکند و ادیتور های آن درحال گسترش هستند . باید بدانید که فایل های SVG با پسوند .svg ذخیره میشوند .
•برای دیدن فایل های SVG در مرورگر شما باید پلاگین Adobe SVG viewer را در سیستم خود نصب کرده باشید. البته اگر از فایرفاکس ۱.۵ استفاده میکنید نیازی به دانلود این پلاگین نیست .چون مرورگر فایرفاکس شما بصورت کامل ازین تکنولوژی استفاده میکند

XML

 

یک زبان استاندارد جهانی برای مدارک ساختاریافته تحت وب که به وسیله کنسرسیوم W3C به منظور پوشش محدودیتهای HTML و ایجاد چهارچوبی برای فرمتهای دیتا  توسعه داده شده است وبه عنوان پایه و اساسی برای تمامی تخصصات از جمله

SMIL (multimedia)

مخفف Synchronized Multimedia Integration Language که یک زبان نشانه مشتق شدهاز XML بوده و جهت تنظیم ، صفحه آرایى و نمایش چند رسانه ای کاربرد دارد :
 

SVG (vector graphics)

  MathML (special mathematical symbols and formats)

جهت توصیف نماد های ریاضیات مورد استفاده قرار می گیرد

X3D (3D graphics)

 XHTML (successor of HTML)

HTML بسط یافته می باشد و از قوانین XML پیروی می کند   

 

XFORM (form generation)

 

GML (Geography Markup Language)

می باشد.


 

 DOCUMENT OBJECT MODEL:DOM

 

اغلب فرمتهای برداری WWW در Browser ها به وسیله ابزارهایی از Plug in نمایش داده می شوند بدین معنا که با یک برنامه اضافی که اساسا“ قسمتی از Browser  نمی باشد سروکار داریم .همچنین ما اغلب با فرمتهای داده ای ضعیفی که تنها با برنامه های گرافیکی خاصی قابل اجرا می باشند که مخالف اصول اینترنت Open Source می باشد .بیشتر معایب به واسطه استفاده از فرمتهای باینری که خارج از برنامه مربوطه غیر قابل ویرایش و تصحیح می باشد بوجود می آید .تقریبا“همه پروژه های نقشه های اینترنتی نیاز به ویرایش دارند چرا که مکانیزمهای تقابلی و نمایش نیاز به بروزرسانی دستی مانند اضافه نمودن داده های جدیدوآنالیزوانتخاب و تغییر سمبلهای نقشه دارد.

تقابلی بدین معناست که المانهای موجود در یک صفحه وب شامل اشیاء برداری که نمایش داده می شوند در مقابل دستورات صادره عکس العمل نشان دهند.به منظور دسترسی به این اشیاء یک ساختار سلسله مراتبی با نام DOM و مطابق شکل زیر مورد نیاز است :

 

          Example for a simple DOM object hierarchy

 

یک رابط برنامه نویسی برای سندهای XML  و Html است . با استفاده از اینترفیس فوق، نحوه دستیابی و انجام پردازش های لازم در رابطه با سند های XML و Html فراهم می گردد . برنامه نویسان با استفاده از DOM ، قادر به ایجاد یک سند ،حرکت در طول ساختار سند، افزودن ، اصلاح و یا حذف المان های یک سند XML و یا Html می باشند .

معماری دام، نه به زبان برنامه‌نویسی خاصّی وابستگی دارد و نه به سکّوی برنامه‌نویسی ویژه‌ای، بلکه، به منظور اجراء و پیاده‌سازی آن باید از یک زبان برنامه‌نویسی همچون جاوا، سی‌شارپ، جاوااسکریپت یا مشابه آن‌ها سود بجوییم. آنسوی رابط کاربر سند با مدلی شیء‌گرا نمایانده می‌شود.


 

JavaScript

 

جاوااسکریپت زبانی است که توسط NetScape تولید شده است. این زبان، زبان برنامه نویسی اسکریپت مبتی بر اشیاء است که بر اساس استاندارد ECMA-262 Edition 3 نوشته شده است. ساختار این زبان به سی پلاس پلاس(C++) و جاوا شباهت دارد؛ این زبان می‌تواند هم به صورت ساخت یافته و هم به صورت شی گرا مورد استفاده قرار گیرد. در این زبان اشیاء با اضافه شدن متدها و خصوصیات پویا به اشیاء خالی ساخته می‌شوند، بر خلاف جاوا. بعد از ساخته شدن یک شی به روش فوق، این شی می‌تواند به عنوان نمونه‌ای برای ساخته شدن اشیاء مشابه مورد استفاده قرار گیرد.
 کاربرد گسترده این زبان در سایتها و صفحات اینترنی می‌باشد و به کمک این زبان می‌توان به اشیاء داخل صفحات HTML دسترسی پیدا کرد و آنها را تغییر داد. به همین علت برای پویا نمایی در سمت کاربر, از این زبان استفاده می‌شود
 


 

Scalable Vector  Graphics:SVG
این تکنولوژی برای کاربران و توسعه دهندگان GIS  جذاب است امروزه اکثر سیستمهای بر پایه نقشه دو روش را جهت تبادل اطلاعات نقشه ای بر روی وب بکار می گیرند .

روش اول : Java Applet

 به طور کلی واژه اپلت « Applet‌ » به برنامه هایی اطلاق می گردد که در زمینه برنامه های دیگر اجرا می شوند. به عنوان مثال فایلهای فلش که در صفحات وب قرار گرفته و توسط مرورگر اجرا می گردند، نوعی از اپلت ها می باشند.

روش دوم : ایجاد نقشه بر روی Server و انتقال آنها به کاربر در فرمتهای GIF,GPEG

 


 اشکالات استفاده از تصاویر برای گرافیکهای دو بعدی وب

 

•Image Size:اندازه یک تصویر تحت تاثیر عرض و ارتفاع و تعداد بیتهای تشکیل دهنده هر پیکسل می باشد کارایی فشرده سازی بستگی به تکنیکهای فشرده سازی موجود و نوع تصویر دارد.
•Resolution:هنگامی که تصویربا رزولوشن خاص بزرگ نمایی شود جزئیات بیشتری ارائه نمی کند.به منظور کسب جزئیات بیشتر بایستی تصویری با رزولوشن بالاتر استفاده شود.
•Binary Format:فرمت تصاویر معمولا“باینری بوده در نتیجه درج Metadata به تصویر و دیگر فرایندهای تکنولوژی وب مشکل است .
•Minimal Animation : فرمت GIF اجازه استفاده از چندین تصویر را جهت ایجاد یک تصویر را می دهد که Animated GIFs نامیده می شود.اما اشکال آن این است که هر تصویر حکم یک تصویر واحد را دارد جهت رفع این اشکال از فرمتهای ویدیوئی استفاده می شود.
•Hyper linking : نیاز به استفاده از تصاویر به عنوان جزئی از HTML می باشد که با هندسه خاصی به نواحی از تصویر Link  شده اندتنها لینک

 

•به نواحی از تصویر برقرار می گردد ونه از اجزاء خاص تشکیل دهنده تصویر
•Transformation: از آنجایی که فرمت تصاویر بر پایه XML  نمی باشدامکان استفاده از تکنولوژی هایی از قبیل XSLT به منظور نمایش اطلاعات توصیفی در یک سطح بالاتر زبان XML مانند نمایشهای جدولی وجود ندارد.

SVG  تمامی مشکلات ذکر شده را حل کرده است .SVG یک استاندارد HTTP می باشد که امکان کاربردهای نقشه سازی را بدون نیاز به Applet  ها در Server هر زمانی که نقشه به نمایش در می آید را می دهد.

 SVG چیست؟

 

SVG یک زبان XML جدید برای تعریف گرافیکهای دوبعدی برداری که در صفحات وب ودیگر کاربردها استفاده می شود SVG اجازه استفاده از سه نوع گرافیک را میدهد

•اشکال گرافیکی برداری مانند دایره , مستطیل, مسیر شامل خطوط و منحنی ها

دایره 

<Circle id=“staeid_0“ cx=“40“ cy=“40“ r=”20”

Style=”fill:orange;opacity:1;stroke-

width:1.5;stroke:red>

مستطیل

<Circle id=“staeid_0“ cx=“40“ cy=“40“ r=”20”

Style=”fill:orange;opacity:1;stroke-

width:1.5;stroke:red>

 

خطوط و منحنی ها

•<path id=“Krei25” d=“m 20 180 l 30 220 60
•240 40 240 90
•90“Style="fill:#ffffcc;stroke:#ff6633;stroke-
•width:100;opacity:1">
•تصاویر
•نوشته ها

به منظورنمایش تصاویر SVG در Web Browser نیاز به نصب یک نرم افزار Viewer  از قبیل Abobe’s SVG Viewer می باشد.

Client-Side  & Server Side 

  در اصطلاح به کامپیوتر کاربر یا بیننده صفحه , مشتری (  (Client و به کامپیوتری که به کامپیوتر های دیگر جهت مشاهده صفحات وب سرویس می دهد , سرویس دهنده یا میزبان   (Server ) می گوییم

Client-Side Scripting کدهای برنامه نویسی است که در یک فایل HTML بر روی مرورگر اجرا می شود(مثل JavaScript)

اسکریپتClient-Side  هرگز توسط سرویس دهنده وب پردازش نمیشود , بلکه تنها توسط سرویس گیرنده (مرورگر کاربر)پردازش می شود.

اسکریپتهای Server-Side تماما“بر روی سرویس دهنده وب پردازش می شوند.سرویس گیرنده هیچ کدی را از اسکریپتهای Server Side دریافت نمیکند و نمی شناسد بلکه تنها خروجی اسکریپتهای Server Side را می گیرد.اسکریپتهای Server-Side و Client-Side هیچ فعل و انفعالی بر روی یکدیگر ندارند زیرا اسکریپتهای Client-Side بعد از اینکه اسکریپتهای Server Side پردازش خود را به طور کامل انجام دادند بر روی سرویس گیرنده اجرا می شوند.

SVG on Client-Side

 

تغییرات درفایلهای SVG در قسمت Client Side قابل انجام است .این بدان معناست که نیازی به ارسال هیچگونه داده ای از Client به Server نمی باشددر نتیجه زمان پاسخ دهی حداقل ممکن میشود در صورتی که اگر می خواستیم از تصاویر رستری با یک تغییر نقطه دید رفتار متقابلی داشته باشیم نیاز به تغییر کامل نقشه و ارسال نقشه جدید از Server به Client می بود که به معنای از دست دادن زمان و اشغال حافظه سیستم می باشد.

صفحات وب اطلاعات متفاوتی رادر خود نگهداری می نمایند. صفحات فوق بر روی سرویس دهندگان وب و بر اساس یک ساختار مشخص ، سازماندهی و ذخیره خواهند شد. کاربران اینترنت بااستفاده از مرورگر خود، درخواست یک صفحه وب را می نمایند، در خواست موردنظر پس از ارسال از طریق محیط انتقال در اختیار سرویس دهنده وب قرار خواهدگرفت. سرویس دهنده وب پس از دریافت درخواست کاربران، عملیات جستجو ویافتن فایل درخواست شده را آغاز می نمایند. در صورتیکه فایل ( صفحه وب)درخواستی پیدا نگردد، سرویس دهنده برای برنامه مرورگر کاربر کدی رابمنزله عدم یافتن فایل ارسال و مرورگر پیام مناسبی در رابطه با عدم یافتن فایل را در اختیار کاربر قرارخواهد داد.

CGI

 

در صورتیکه سرویس دهنده فایل درخواستی را پیدا نماید، آن را به منظور نمایش برای مرورگر کاربر ارسال خواهد کرد.
فرآیند فوق ، نحوه برخورد سرویس دهنده وب با فایل های ایستا ( صفحات وب ایستا ) را تشریح می نماید. صفحات وب ایستا ، قبل از درخواست کاربران توسط مولفین مربوطه ، طراحی و بر اساس ساختار سازماندهی شده بر روی سرویس دهنده وب مستقر خواهند شد. محتویات این نوع صفحات همواره یکسان بوده و اطلاعات موجود را صرف نظر از زمان، مکان، تمایلات درخواست کننده بصورت یکسان نمایش خواهند داد. اکثر سرویس دهندگان امکان استفاده از فایل های پویا را نیز فراهم می آورند. برای ارائه تکنولوژی فوق از امکانات متعددی استفاده می گردد . (CGI (Common Gateway Interface یکی از امکانات موجود در این زمینه است .

امروزه از اینترفیس CGI در موارد متعددی استفاده می گردد :

یک دفترچه تلفن امکان ارسال اطلاعات کاربران را از طریق یک فرم Html فراهم و پس از ارسال اطلاعات موجود در فرم ، اطلاعات در بانک های اطلاعاتی ذخیره خواهد شد.

 

یک فروشگاه online کتاب ، امکان ارسال اطلاعات مربوط به یک گروه از کتاب را فراهم و در ادامه اطلاعات تکمیلی در رابطه به هر یک از کتاب های موجود در گروه در اختیار کاربران قرار خواهد گرفت .
- در برنامه های موتور جستجو ، امکان درج کلمات مورد نظر برای جستجو در اختیار کاربران گذاشته خواهد شد ، در ادامه برنامه مورد نظر، آدرس صفحات وب شامل اطلاعات مورد نظر ( جستجو) را در اختیار کاربران قرار خواهد داد.

مکانیزم نحوه عملکرد CGI در اکثر سرویس دهندگان وب ، یکسان و استاندارد است . در این راستا فولدری با نام cgi-bin در فهرست ریشه وب سایت مورد نظر ایجاد می گردد. نحوه برخورد سرویس دهنده با فایل هائی که در فولدر فوق قرار می گیرند، متفاوت خواهد بود. سرویس دهنده در رابطه با فایل های فوق صرفا" عملیات ساده خواندن و ارسال را انجام نخواهد داد. این نوع فایل ها می بایست اجراء و خروجی بدست آمده در اثر اجرای برنامه، برای مرورگر متقاضی ارسال خواهد گردید. از زبانهای متعددی برای نوشتن برنامه ها در این زمینه استفاده می گردد. زبان اسکریپتی PERL یکی از متداولترین گزینه ها برای نوشتن اسکریپت های CGI، می باشد.

بمنظور نوشتن فایل های CGI، می توان از زبانهای برنامه نویسی و زبانهای اسکریپت استفاده کرد. زبانهای C و PERL دو گزینه مناسب در این راستا می باشند. مسئولیت برخورد با اسکریپت های CGI برعهده سرویس دهنده وب است.

 چندین راه برای دسترسی یک فرد درون اینترانت  Intranet) )به پایگاه داده یک شرکت وجود دارد که یکی از پر طرفدارترین آنها CGI یا (Common Gateway Interface) می باشد. CGI به هر برنامه اجرایی اجازه میدهد اجرا شده و خروجی خود را به مشتری  Client)  )متقاضی برگرداند. بنابراین به برنامه نویسان اینترانت امکان نوشتن برنامه ها و اسکریپتهایی را می دهد که با استفاده از آنها کاربران درون اینترانت بتوانند به سادگی با پر کردن فرمهایی از مرورگر وب خود برای جستجو در پایگاه داده و دریافت نتایج به فرمت HTML ،که برای مرورگر قابل فهم است، استفاده نمایند .

اساسا CGI یک اینترفیس است که اطلاعات را از سرور به برنامه شما تحویل داده و از برنامه شما به مشتری متقاضی برمی گرداند . CGI یک زبان برنامه نویسی نیست .

 

 

همه پردازشها توسط برنامه انجام می شود و CGI تنها دیتا را از برنامه می گیرد . CGI استانداردی است که به برنامه نویس اجازه می دهدبرنامه هایی بنویسد که قابلیت دسترسی به سرور های اطلاعات و پایگاههای داده را داشته باشند و سپس اطلاعات را به کاربران درون یک اینترانت ارسال نمایند . با استفاده از CGI فن آوریهای اینترانت مبتنی بر وب می توانند با منابع و پایگاههای داده غیر TCP/IP ارتباط برقرار کنند.


 

SVG Structure
 

دو راه برای تعریف SVG در صفحات وب وجود دارد

•SVG  با یک سیستم مستقل از سیستمهای دیگر . به عنوان مثال :

1. <?xml version="1.0" standalone="no"?>

2. <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"

     "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">

3. <svg width="300" height="300" x="0" y="0">

4. <!--Your SVG content goes here -->

5. </svg>

در خط اول SVG به عنوان تابعی از  XML واز کامپایلر XML  استفاده می کند .

در خط دوم DTD مخفف Document Type Declaration و نحوه ی نگارش یک سند است . سندی که شامل تگ ها ، ویژگی های آن ، توضیحات و محتویات می باشد . سندی XML را در صورتی (Valid) معتبر می دانیم که مطابق با DTD تعریف شده برای سند باشد.

 

DOCTYPE چیست ؟
اعلان نوع سند و نسخه ی آن می باشد . جهت مطابقت با نحوه ی نگارش صحیح سند مربوطه (استاندارد بودن) به اعلان آن صفحه رجوع می شود ؛ همچنین مرورگرها با توجه به اعلان سند ، صفحات را مرور کرده و نمایش می دهند .
اعلان یک سند وب معمولا" در اولین خط (بالاترین قسمت سورس) قرار می گیرد .

 

در خط سوم <svg> نشان دهنده آن است که یک سند SVG می باشد که محدوده سند SVG را با دو خصوصیت عرض و ارتفاع و مختصات قرارگیری سند SVG درون پنجره کاری را مشخص می کند در صورت وارد نکردن عرض و ارتفاع , کلیه ابعاد Browser  اشغال می شود.

در خط چهارم تمامی محتوای SVG  بین <svg> و  </svg> قرار می گیرد.

در خط پنجم از آنجایی که SVG یک کاربردی از XML می باشد  همه سندهای SVG بایستی در انتها بسته شوند.

راه دوم تعریف SVG در صفحات وب   
 

قرارگیری اسناد SVG درون HTML یا   XHTMLبا ساختار زیر می باشد:

•1.  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
•2.  <html>
•3.  <head>
•4.  <title>Object and Embed</title>
•5.  </head>
•6.  <body>
•7.<object data="test.svg”width="500" height="500" type="image/svg+xml">
•8.<embed src="test.svg" width="500" height="500"type="image/svg+xml" />
•9.  </object>
•10. </body>
•11. </html>

 

 

دستورات کامپیوتری ObjectوٍEmbed در مثال بالا اهمیت ویژه دارند. استفاده تنها از دستور Object باعث می شود فایل SVG مربوطه در Netscape Browser نشان داده نشود. پس بهتر است که از هر 2 دستور استفاده شود ویا فقط از embed استفاده شود.

خطهای 7 تا 9 شامل دستورات Objectو embed می باشد.توجه شود که دستور Object در خط 7 آدرس URL سند SVG را برای خصوصیت data  نسبت می دهد  در حالیکه در خط 8 دستور embeded خصوصیات آن را به  src نسبت می دهد.

از مهمترین خصوصیات این روش امکان ترکیب مزایای HTML وXHTML وSVG می باشد.

 

برای دریافت متن کامل از لینک دانلود  استفاده نمایید.




برچسب ها : gis ،دانلود ،نقشه ،داده های رقومی
ارسال در تاريخ شنبه ۳ اردیبهشت ،۱۳٩٠ توسط مهدی فرداد
نظرات شما ()