Giter VIP home page Giter VIP logo

webdemo's Introduction

weather-app

This is a web portal developed using GeoExt, ExtJS and OpenLayers to manage data from different weather stations in the country. This is a sample application to show the aspects in which one can implement a web-mapping application using ExtJS and GeoExt and having the OpenLayers API.

#Installation on local machine

Clone or download this repo on your local machine

Download the ExtJS library files from the Sencha Website, Version 4.2.1, http://cdn.sencha.com/ext/gpl/ext-4.2.1-gpl.zip .
Uncompress and Rename the folder to extjs and move it to the weather-app directory. Get the GeoExt library files from https://github.com/geoext/geoext2/releases/tag/v2.1.0 and unzip it. Rename to Geoext and move directory to weather-app directory.
Download the OpenLayers library from http://openlayers.org/two/ , uncompress it and rename to OpenLayers. Move the directory to weather-app.
Download the Silk Icons from http://famfamfam.com/lab/icons/silk/ and unzip to icons folder in the apps directory.
Run the index.html file on browser

#Using Online Sources for libraries To use online resources for the different libraries, ensure the index files has links just like in this file

<!DOCTYPE html>
<html>
    <head>
        <title>Weather Map</title>
        <!-- Load the ExtJS stylesheet -->
        <link rel="stylesheet" type="text/css"href="http://cdn.sencha.com/ext/gpl/4.2.1/resources/css/ext-all.css">
        <!-- Load ExtJS from their CDN, local versions work also -->
        <script type="text/javascript"src="http://cdn.sencha.com/ext/gpl/4.2.1/ext-debug.js"></script>
        <!-- Load OpenLayers, custom builds may even be better -->
        <script src="http://openlayers.org/api/2.13.1/OpenLayers.js"></script>
    </head>
    <body></body>
</html>

Change the respective lines of code.

Also, edit the loaders.js file to feature the following:

<script type="text/javascript">
Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false,
    paths: {
        GeoExt: "path/to/src/GeoExt",
        Ext: "http://cdn.sencha.com/ext/gpl/5.1.0/src"
    }
});

</script>

Run the index.html on browser

#Working Demo The demo can be accessed through this url http://apps.lifeingis.com/weather-app

webdemo's People

Contributors

tranphucdang avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.