Building Malaysia Weather Forecast Map Using Mashups and Google Maps
-
Upload
lill-nasharitah -
Category
Documents
-
view
39 -
download
2
description
Transcript of Building Malaysia Weather Forecast Map Using Mashups and Google Maps
BUILDING MALAYSIA WEATHER FORECAST MAP
USING MASHUPS AND GOOGLE MAPS
LILLIAN NASHARITAH BONEY ABDULLAH
UNIVERSITI TEKNOLOGI MALAYSIA
BUILDING MALAYSIA WEATHER FORECAST MAP USING MASHUPS AND GOOGLE MAPS
LILLIAN NASHARITAH BONEY ABDULLAH
A project report submitted in partial fulfillment of the requirements
for the award of the degree of Computer Science (Software Engineering)
Faculty of Computer Science and Information System
Universiti Teknologi Malaysia
APRIL 2011
iii
APPRECIATION
All praise to Allah, the one and only, for giving me the strength to complete this
final year project. Alhamdulillah. This project could not have been accomplished
without the help of many individuals. First and foremost I would like to take this
opportunity to thank my project supervisor, Dr Ismail Mat Amin for his critics, advices,
ideas and persistence encouragement. Without his continual support and guidance, this
project report would not have been the same as presented here.
Besides, I would like to thank all my lecturers in Universiti Teknologi Malaysia
for their sincerity in contributing their best knowledge and stimulating my learning
development. To my entire course mates who were very helpful in giving valuable ideas,
encouragement and criticism.
Finally, thanks to my family for their never ending love and support, and to my
husband for his support, for bearing with my long hours of work and for bringing into
my life happiness, love and perspective.
iv
ABSTRAK
Kebanyakan laman web hari ini menggunakan teknologi Web 2.0 untuk
menghasilkan antaramuka aplikasi laman web yang lebih menarik dan interaktif. Projek
ini mengkaji pelaksanaan salah satu teknologi interaktif Web 2.0 yang dikenali sebagai
Mashup. Generasi pengaturcara aplikasi laman web hari ini menggunakan Mashup untuk
mengabung kandungan atau beberapa perkhidmatan lain bagi mewujudkan satu
perkhidmatan yang baru. Bagi memahami konsep Mashup, satu prototaip web mashup
iaitu MyWeatherMap telah dibangunkan. Ia berfungsi untuk memaparkan maklumat
ramalan cuaca di 27 bandar dan 13 buah pusat pelancongan utama di Malaysia. Terdapat
tiga komponen utama yang menjadi asas pembangunan MyWeatherMap. Pertama,
Application Programming Interface (API) atau sumber maklumat utama cuaca.
Komponen ini akan memaparkan maklumat cuaca dalam bentuk yang interaktif pada
Google Maps. Sementara itu, maklumat cuaca diperolehi daripada laman web rasmi
agensi kerajaan iaitu Jabatan Meteorologi Malaysia dengan menggunakan teknik Web
Scrapping. Komponen kedua adalah mashup site iaitu aplikasi web yang menggunakan
teknologi server-side dynamic content generation seperti Hypertext Preprocessor (PHP).
Komponen ketiga adalah browser yang digunakan untuk melihat paparan aplikasi laman
web MyWeatherMap. Hasil pembangunan projek ini diharap mampu memperbaiki dan
meningkatkan mutu penyampaian maklumat ramalan cuaca menggunakan teknologi
Web 2.0. Kertas kerja ini akan membincangkan analisis, rekabentuk dan implentasi
pembangunan prototaip MyWeatherMap.
v
ABSTRACT
Nowadays, many websites are relying on Web 2.0 technologies to build rich
interfaces and more interactive web applications. This project explores one of the
interactive Web 2.0 technologies called Mashup. Current generation of web developers
used Mashup to combine content or services from multiple origins to create new
services. In order to understand the Mashup concept, a prototype of web Mashup known
as MyWeatherMap is build. This web mashup is utilise to display weather forecast for 27
major towns and 13 main tourist destinations in Malaysia. There are three main
components that construct this web mashup. Firstly is the Application Programming
Interface (API) or content provider. This component visualises weather forecast
information on an interactive Google Maps. Meantime, weather forecast information as
the content is extract from a government official website, Malaysian Meteorological
Department by using Web Scrapping technique. Secondly is MyWeatherMap, a mashup
site where it implemented as a traditional web application using widely use server-side
dynamic content generation technologies such as Hypertext Preprocessor (PHP). The
third component is the client’s web browser. This is the place where MyWeatherMap is
rendered graphically on Google Maps for user to view. The result of this project is
hopefully can improve and facilitate the delivery of weather forecast information in
Malaysia using Web 2.0 technologies. This paper describes the foundations, design and
implementation process involve during the development of MyWeatherMap prototype.
vi
TABLE OF CONTENTS
CHAPTER CONTENTS PAGES
THESIS ACKNOWLEDGEMENT
SUPERVISOR ACKNOWLEDGEMENT
PROJECT TITLE i
DECLARATION ii
APPRECIATION iii
ABSTRAK iv
ABSTRACT v
LIST OF CONTENTS vi-xi
LIST OF TABLES xii
LIST OF FIGURES xiii-xv
LIST OF ABBREVIATIONS xvi-xvii
LIST OF APPENDICES xviii
1 PROJECT INTRODUCTION
1.1 Introduction 1
1.2 Problem Statement 3
1.3 Purpose of Project 7
vii
1.4 Objectives of Project 7
1.5 Scope of Project 8
1.6 Justification of Project 9
2 LITERATURE REVIEW
2.1 Introduction 10
2.2 What is Mashups? 11
2.2.1 Types of Mashups 11
2.2.2 Mashups Genre 14
2.3 Mashups Architecture 19
2.3.1 API/Content Providers 20
2.3.2 Mashups Site 21
2.3.3 Client’s Web Browser 22
2.4 Application Programming Interface (API) 22
2.4.1 Google Maps API Family 23
2.5 Google Maps JavaScript V3 29
2.5.1 Basic Map Types 29
2.5.2 Create Web Application With Google Maps API 30
2.5.3 Google Maps V3 API Justification 33
2.6 Web Protocols 34
2.7 Web Scrapping 34
2.7.1 Scrapping Data Using PHP 35
2.8 Web Programming Languages 36
viii
2.8.1 Regular Expression 36
2.8.2 Client Side Scripting (JavaScript) 37
2.8.3 Server Side Scripting (PHP) 39
2.8.1 Style Sheet Languages (CSS) 41
2.9 Web Server (Apache) 42
2.10 Database (MySQL) 43
2.11 Graphic Editor (GIMP) 44
2.12 Definition of Weather Forecast 44
2.13 Malaysia General Weather Conditions 45
2.13.1 Rain 46
2.13.2 Thunderstorm 47
2.13.3 Cloudy 47
2.13.4 Fine 49
2.13.5 Haze 49
2.13.6 Mist 49
2.14 Weather Map Mashup Research 50
2.14.1 Australian Bureau of Meteorology 52
2.14.2 Brunei Darulssalam Meteorological Services 53
2.14.3 Badan Meteorologi Klimatologi dan Geofisika 54
Indonesia
2.14.4 Comparison of Meteorological Agencies 55
2.14.5 Comparison Conclusion 56
ix
3 DEVELOPMENT TECHNOLOGY
3.1 Introduction 57
3.2 Web Development Life Cycle (WDLC) 58
3.2.1 Initial Consultation 59
3.2.2 Project Specification 59
3.2.3 Web Site Architecture 60
3.2.4 Web Site Design Cycle 60
3.2.5 Content Collation 61
3.2.6 Web Site Project Development 61
3.2.7 Testing and Quality Assurance 61
3.2.8 Web Site Deployment 62
3.3 Chosen Project Methodology 62
3.3.1 Agile Web Engineering (AWE) Process 63
3.3.2 Project Development With AWE 64
3.4 Project Methodology Justification 67
3.5 Supporting Technique 68
3.6 Conclusion 69
4 ANALYSIS RESULT AND DESIGN
4.1 Introduction 70
4.2 Analysis Design 71
x
4.2.1 Login 72
4.2.2 Manage Location 72
4.2.3 View Weather 72
4.2.4 Search Location 72
4.3 Process and Data Flow Design 73
4.3.1 Data Processing Module 74
4.3.2 Data Storage Module 74
4.3.3 Mashing Module 74
4.3.4 Display Module 74
4.3.5 Admin Module 75
4.4 Database Design 75
4.5 System Architecture Design 80
4.6 User Interface Design 81
4.6 Conclusion 86
5 IMPLEMENTATION AND SYSTEM OUTPUT
5.1 Introduction 87
5.2 Development Environment 88
5.2.1 Development Environment 88
5.2.2 Installation MySQL, PHP, Apache Using Yum 88
5.2.3 Database Connection with PHP 90
5.3 Development Implementation 91
5.3.1 Loading The Google Maps V3 API 91
xi
5.3.2 Create and Set Password Login Page 93
5.4 System Evaluation and Result 94
5.4.1 Unit Functional Test 94
5.4.2 Web Scrapping Process Test 96
5.4.3 Push Data Process Test 98
5.4.4 Converter Data Process Test 100
5.4 Conclusion 101
6 DISCUSSION AND CONCLUSION
6.1 Introduction 102
6.2 Results and Achievement 103
6.3 Constraints and Challenges of System 105
6.4 Recommendations and Enhancements 106
6.4 Conclusion 107
REFERENCES 108
APPENDICES 112
CHAPTER 1
PROJECT INTRODUCTION
1.1 Introduction
Weather forecasts information plays a significant role to provide information on
public in tourism expansion as well as to protect life and property. Today, Internet and
website are widely used to publish online weather data because it can be easily access at
any time and can display large amounts of valuable information. Regardless the
abundance of available online weather data, creativity to make use of Web 2.0
technologies to present weather data effectively is necessary. The term Web 2.0 was
invented by O’Reilly Media and refers it as a web application that provides online
participation, collaboration, social networking and interaction (O’Reilly, 2010).
Nowadays, there are ranges of technologies that facilitate Web 2.0. These include blogs,
wikis, syndication feeds (RSS and Atom), lightweight Web services, Ajax and Mashups.
This project development will focus on Mashups where weather data is mash into
Google Maps and produce the resulting mashup into a new service known as
MyWeatherMap.
CHAPTER 2
LITERATURE REVIEW
2.1. Introduction
This chapter presents a study or research that has been done on essential topics
for instance Mashups, Google Maps V3 API and Web Scrapping. The purpose is to
gather some guidelines and understanding on how to development a mashup web with
various technologies and techniques. Apart from that, this chapter reviews other related
elements for this project implementation such as scripting languages, web server, and
database type. Meanwhile, general information on weather forecast is added to
comprehend meteorological terminologies in a way to best describe weather forecast
information on MyWeatherMap. In the last part of this chapter, a comparison result of an
observation research of other meteorological agency website and their approach to
deliver weather forecast information are presented.
CHAPTER 3
DEVELOPMENT METHODOLOGY
3.1 Introduction
In recent years, web applications development turn out to be more complicated
due to rapid growth in web programming languages, tools and other related web
technologies. Without having a suitable planning, structure and application model, the
trend and techniques to develop web application can be further sophisticated. Over the
past years, a lot of methodologies have been presented to guide and deal with problems
associated in web development process. Nevertheless, there is no general accepted
process model for web based application development. During this project, it is found
that a good lifecycle model for web based application development does not merely
follow the traditional software engineering lifecycle. According to Altarawneh research,
these days the main web application development methodology is an expansion of the
standard software engineering methodologies (Altarawneh, 2008). Therefore, this
chapter is presented to review and justify a development methodology for
MyWeatherMap.
CHAPTER 4
ANALYSIS RESULT AND DESIGN
4.1 Introduction
This chapter attempt to give brief descriptions of object-oriented analysis and
design that applied to the simulation of MyWeatherMap. As mentioned earlier in
Chapter 3, this project used the Unified Modelling Language (UML) as a graphical
language for envisaging, identifying, assembling, and documenting the basic concepts
and principles of object orientation within MyWeatherMap. After the statements of
requirements are completed, the process proceeds through analysis, overall design, and
detailed design and implementation. Through this phase, requirements are described in
details using Use Case Modeling and Data Flow Diagram (DFD) which is used to
present the flow of data that through the developed web application. Meanwhile, system
design is implemented to ensure all system requirements are translated to meet the user
requirement and satisfaction. System design is an artistic process to transform problems
into a solution because it includes a complete description of MyWeatherMap functions
and interactions.
CHAPTER 5
IMPLEMENTATION AND TESTING
5.1 Introduction
This chapter presents the general system implementation and testing for
MyWeatherMap web application. It described the system development environment and
translated all designs that have been constructed in the previous analysis and design
phase. In the first section, description on chosen technology use in this project are
presented such as installation of Apache web services, MySQL database and other
required services setup. Further on that, unit testing is executed to ensure the system
functionality and processes are working and complete accordingly the requirements
specification. Details on the system implementation and testing are described in the
following sections.
CHAPTER 6
DISCUSSION AND CONCLUSION
6.1 Introduction
The primary goal of this project is to build a prototype of an alternative web
application using Web 2.0 technologies such as Mashup and Google Map API. The
Mashup web application is expected to serves as a platform to view Malaysia weather
forecast updates conditions in 27 major towns and 13 tourist destinations. This chapter
describes the overall project achievement, obstacles faced during the development and
future enrichment for MyWeatherMap.
103
6.2 Results and Achievement
Figure 6.1: MyWeatherMap Mashup Web
Based on the output in Future 6.1, this project has successfully demonstrated the
integration of Google Maps API and Web Scrapping into a web Mashups application.
The development is delivered on schedule and accordingly within the project scope and
objective. In this project, AWE methodology was chosen as the development
methodology and it has effectively leaded the project development. At first, the project
was started with business analysis where the MyWeatherMap goals and requirements are
treated as project elements. Activities such as feasibility study and risks associated with
the project are evaluated because it is necessary to describe appropriate technical
approaches for the development. The outcome of this task is a broad list of scheduled
activities for the subsequently requirements phase.
104
In requirement phase, the activities continue with web application description
workflow production where the web application functionalities and constraints are
describes. In order to achieve this, actors, and use cases for the web application are
identified to represent the behavior of the system. By using uses cases, the web
application is more likely relevant to the users. In every use case that has been created, it
described in details to show how the web application interacts step by step with the
actors and what the web application actions are.
In the analysis and design phase, the task on how the web application is going to
perform during the implementation phase is realized within a specific implementation
environment. The task and functions are specified in the use case descriptions to ensure
it fulfill the requirements. The result of this activity is design models of the web
application with ranges of diagrams. It is used to best describe the web application
processes and data flow and becomes the reference on how the source codes are
structured and written.
In implementation phase, all codes and components of the web application are
defined. Test implementation on units and integration is implemented to verify the
interaction between objects and to verify all requirements have been correctly
implemented. The final achievement for this project is the deployment of
MyWeatherMap web application. It is distributed as a package of system or web
application after conducted testing activity. Then, it is proceed with the installation of
the web application in the dedicated machine ready for presentation and live of the web
application.
105
6.3 Constraints and Challenges of the System
While this innovative web application provides comprehensible benefits to user,
there are also consequences with arguments which require better understanding and
strategy to tackle the issues. The identified constraints and challenges are as bellow:
i. Limited time to do more in depth research about the main subject matters such as
Mashups and Google Maps API. This project is inspired due to personal interest
so it requires understanding from the subject root. Better result is expected to
achieve if project time period is extend.
ii. The confidentiality issues are to rise when using information from other specific
website and mixing it with other APIs potentially will impact the value of
original information.
iii. Web Scrapping technique is not applicable for cases with authentication
processes and menus selection. The main reason is it involves a series of
exchange process with the server prior to reach the process window. For
example, if the window layouts of the target application are changed or the
displayed content varies, the information may not be able to be extract.
106
6.4 Recommendations and Enhancements
In order to provide better services for users in future, there are some identified
recommendations that can be extended to achieve users’ satisfaction. The identified
recommendations are as follows:
i. Add more locations on Major Towns and Tourist Destinations because more
users are expected to use this web application if more coverage on location is
provided.
ii. Use available tools to implement scrapping process such as IRobotSoft and
GreaseMonkey instead of manual programming to create the scrapper agent.
107
6.5 Conclusion
With present assorted kind of web technology, this project enables users to blend
existing various applications and services to build new applications. This project has a
great potential to inspired and facilitate future map Mashups for private and government
agencies. However, an issue such as data ownership and privacy protection remain
requires further explanation and solution before adopting the implementation. It is clear
that in order to build a web Mashups application, the extent of open APIs provided by
government are also essentials. Through the openness of government in sharing their
services data, more new generation of web mapping services are produce. This great
expansion may imply map Mashups in a number directions to present information
creatively. For instance, the governments are able to improve their e-services for public.
Besides, government agencies are expected to follow the concept and develop more
open APIs to its own data so that others can make use of the developed APIs.
Meanwhile, private agencies may have the opportunities to innovate and extend their
creativity to lead their future plan in producing a new breed of web Mashups. Finally,
serious studies and investigations are require to see how best we can take advantage of
this new compilation of concepts and technologies to develop web Mashup services.
REFERENCES
Eric van der Vlist and colleagues, Professional Web 2.0 Programming, Wrox, 2006.
Ian Sommerville, Software Engineering 8th Edition, Addison-Wesley, 2006.
Keil, M. Cule, P E. Lyytinen, K. And Schmidt, R., A Framework for identifying
Software Project Risks, Communications of the ACM, 1998.
Leffingwell, Dean; Widrig, Don, Managing Software Requirements - A Unified
Approach, The Addison-Wesley Object Technology Series, 2003.
McDonald A. and Welland R., A Survey of Web Engineering in Practice, University of
Glasgow, 2001. Mohamed Haneefa, 2009. Interactive Information Dissemination: Web 2.0 and Beyond,
7th International CALIBER, 2009.
Powell, T.A, Web Site Engineering: Beyound Web Page Design, Prentice Hall, 1998.
Shu-Wai Chow, PHP Web 2.0 Mashup Projects, PACKT Publishing, 2007.
109
Stellman, Andrew; Greene, Jennifer, Applied Software Project Management, O'Reilly
Media, 2005.
Tuchinda, R., Szekely, P., Knoblock, C. A.: Building Mashups by Example. In
Proceedings of UI 2008, ACM Press, 2008.
Agilemanifesto Website, Principles behind the Agile Manifesto, accessed on 20/01/2011
at http://agilemanifesto.org/principles.html
Artic Climatology and Meteorology, Haze, accessed on 25/10/2010 at http://nsidc.orga/arcticmet/glossary/haze.html
Ask Bob Rankin, What is a Mashup?, accessed on 25/10/2010 at http://askbobrankin.com/what_is_a_mashup.html
Build4u Website, What is PHP?, accessed on 27/10/2010 at http://www.buildwebsite4u.com/advanced/php.shtml
Ed Ort, Sean Brydon, and Mark Basler, Mashup Styles, accessed on 27/01/2011 at http://www.mendeley.com/research/mashup-styles-1-serverside-
mashups-4/
110
EzineArticles.com, Internet and Businesses Online: Web Development, accessed on
06/02/2011 at http://ezinearticles.com/?expert=Charles_Kyriakou
O’Reilly, T. What is Web 2.0, accessed on 18/10/2010 at http://oreilly.com/web2 /archive/what-is-web-20.html
PCMAG.com, Application Programming Interface (API), accessed on 25/10/2010 at http://www.pcmag.com/encyclopedia_term/applicationprogramminginte
rface.asp
Programmableweb.com, What is a Mashup?, accessed on 19/10/2010 at http://www.programmableweb.com/faq#Q1
Web Development Lifecycle (WDL), Charles Kyriakou, accessed on 20/01/2011 at http://ezinearticles.com/?Web-Development-Lifecycle-
%28WDL%29&id=4508001
Wikipedia, Web 2.0., accessed on 18/10/2010 at http://en.wikipedia.org/wiki /Web_2.0
Wikipedia, Mashup (web application hybrid), accessed on 18/10/2010 at http://en.wikipedia.org/wiki/Mashup_%28web_application_hybrid%29
111
Wikipedia, Functional Requirement, accessed on 22/10/2010 at http://en.wikipedia.org/wiki/Functional_requirement
Wikipedia, Haze, accessed on 22/10/2010 at http://nsidc.org/arcticmet /glossary/haze.html
Wikipedia, Web 2.0, accessed on 22/10/2010 at http://en.wikipedia.org/wiki /List_of_wiki_software
WMO-No. 1024: Weather, Climate and Water Services for everyone, accessed on
22/10/2010 at ttp://www.wmo.int/pages/publications/showcase/ .../1024_E.pdf