Category: Trainings

Fourth Day- Latex

Typesetting- It’s the arrangement and setting of the type. It’s a designing of formatted text. It’s a concept.

Typography- It’s a technique of arrangement of the type. Basically, it is used to implement typesetting.

File management or documentation is significance part of any project.

There are two types of typesetting software.

  1. Open source software- Examples-> Latex, Scribus, laidout
  2. Commercial Software- Examples-> MS Word, Adobe Indesign, QuarkXPress, istudio publisher.

Why programming is better than GUI?

  1. Automation.
  2. Take less time.
  3. Manipulate the things easily.
  4. Programming give real power whereas GUI has limited scope.

MS Word provides templates to make a good product.

Advantages of Latex

  1. Space optimization.
  2. It do less hyphenation(split words with – character)
  3. TeX combines a number of single/separate characters into a single ligature. Example with fi.

TexLive provides full packages comparable to Miktex.

TexStudio is just IDE. For backend you need Latex distribution like texlive or miktex.

Encoding

Encoding is the process of converting data into a format required for a number of information processing needs, including:

  • Program compiling and execution
  • Data transmission, storage and compression/decompression
  • Application data processing, such as file conversion
  • In computer technology, encoding is the process of applying a specific code, such as letters, symbols and numbers, to data for conversion into an equivalent cipher.

Vector Images and Raster Images

Vector images are the digital images created through a sequence of commands or mathematical statements that place lines and shapes in a given two-dimensional or three-dimensional space. Image extension like pdf, SVG,  eps etc.

Raster images are the digital images created or capture(scanning) as a set of samples of a given space. Raster image files are usually larger than vector image files. Image extension like png, jpg, jpeg etc.

MS Visio and Dia(open-source) are used to design images.

Since all basic are clear, so come to Latex now.

I will discuss here few basic commands.

In Latex, figures and tables are floats. Latex placed itself according to the optimized algorithm. But still if you want to the that position then add [H] with \beginfigure

\beginfigure[H]  where H means to keep figure here

Here, braces are optional. In place of H we can write T(for top), B(Bottom), P(Page)

\usepackage{subcaption}  //To insert 4 -5 images in the in one fig like a b c

Figure~  //Tilt sign will deoptimize space like I want figure-3.6 together then use tilt sign

\usepackage{hyperref} //it will take the pointer of the section in an index to it’s description and vice versa.

 

Advertisements

Third Day- React-native

Hey Guys. It’s third day of our training. It was delivered by my favourite speakers Vigasdeep and Shaina.

React

It is basically a JavaScript library for building user interfaces.

It has three paradigms

  1. Declarative– Design simple views and react will update and render right components.
  2. Component based– Manage complex GUI by encapsulating components for each state.
  3. Learn Once, Write anywhere– Develop new features in react without rewriting existing code.

React-Native

Learn Once, Write anywhere. It builds mobile apps with react. It is developer-friendly as well as user-friendly based on JavaScript and react. A React Native app is a real mobile app. It need not to compile again and again. Predefined components are build in JavaScript and JSX compiled.

PhoneGap

It’s an alternative of react-native but less productive. PhoneGap produces apps for all popular mobile OS platforms such as iOS, Android, BlackBerry, and Windows Mobile OS etc. But it’s not user-friendly. It’s not native(here native means os dependent). Ionic use phonegap.

Screen Shot 2014-06-13 at 5.05.49 PM

Here, Web can be assumed for Phonegap.

Then he told us about Git. Git is basically developed from the command diff. I have already explained Git in my previous blogs.

https://amisha2016.wordpress.com/2016/06/07/git-github/

https://amisha2016.wordpress.com/2017/03/15/git-commands/

There was an overview on Documentation like Doxygen can be used.

 

Second Day- Cloud Computing

Today was the second day of my college training. It was held in the workshop seminar hall.

Mr. Vivek Thapar took our lecture. He taught us on the topic Cloud Computing.

Evolution of Cloud Computing

Clustering

It is basically group of computers connected to each other. The basic idea between clustering is master-slave. There is one master node and all other nodes are slaves.

cluster.jpg

Practically cloud computing is implemented by installing server software on one computer(maser computer) and client software(slave computers) on other computers. It is reliable because work is distributed.

Grid Computing

It is the interconnection of various clusters through a WAN. It requires internet for its working. Internet speed decrease overall speed of the grid computing.

OurGrid2.JPG

It’s of two types

  1. Homogeneous Grid Computing
  2. Heterogeneous grid Computing

Cloud Computing

Cloud computing is the power of every website. Face-book, Amazon Web Server(AWS) are the examples of it. It is the metaphor of internet computing.

Cloud computing and Big Data are complementary to each other. Here, cloud computing is for computing the data and big data for storing and retrieving the data.

Virtualization of Grid and cluster is called cloud computing. Virtualization means maximum utilization of resources dynamically. Here dynamically means you are provided with the resources when you are in need of it and release when you have completed your task.

Cloud computing is hyper visor.

CloudComputing3.jpg

Big Data

Big data is a term that describes the large volume of data – both structured and unstructured – that inundates a business on a day-to-day basis. Hadoop is the technology to handle big data.

It has three elements

Volume, velocity and variety.

NIST Model

the-role-of-hyperv-in-nist-model-8-728

PaaS examples are amazon, salesforce.com, joyent, rockspace.

IaaS provide access to fundamental resources like physical machine, virtual machine, virtual storage etc. Examples- Go Grid, NTT communications.

Difference between cluster, grid, and cloud computing

gh1

 Multi-tenancy

Multi-tenancy refers to a software architecture which provides access of a single software to various users at a time. Here, tenants refers to group of users having access.

Saas and Iaas uses multi-tenancy by giving access of same software and Hardware among all the users.

PopUp Menu in OSM

What is the benifit of making own OSM tile server if we can’t style are own map. So here I come to tell you how to add the information(“PopUp Menu”) in your own OSM map.

So Let’s Start.

Edit the file “slippymap.html”.

The layer named “My Points”contains the information of the few shops near Gill road.

Enter the new layer just after the defination of the variable “map” in the init() function.

var pois = new OpenLayers.Layer.Text( “My Points”,
{ location:”./textfile.txt”,
projection: map.displayProjection
});
map.addLayer(pois);

 

Here textfile.txt is the file containing information of the shops in it. The below picture shows the format of the data stored in the textfile.

text1

Be sure the name of the image in the textfile and the image existing in the same directory should have same name.

Now refresh your map and you will be able to see the changes.

jh

Challenge To Change Colors of OSM Map

Challenge To Change Colors of OSM Map

Yeah, a small challenge to change the colors of OSM map is solved.

Actually, it’s very easy.

For this change your “palette.mss” file.

Changes I have made are:-

I changed the color of buildings(to red), primary_line(to green), secondary_line(to green), road_halo(to black),standard_fill(to black).

And after that I run the command.

 carto project.mml > OSMBright.xml

And then rerender it. Re-rendereing the tiles means

run commands

sudo -u username renderd -f -c /usr/local/etc/renderd.conf

sudo /etc/init.d/renderd restart

Restart your apache also.

But nothing happen:(

Then after searching a lot I took a risk to delete the folder “default” in /var/lib/mod_tile.

It means I deleted the previous tiles created in the tile directory and again re-render the tiles.

Breaking News.

Problem is solved.

color1

 

 

OSM Error(Virtual) Solved

OSM Error(Virtual) Solved

” Well, if it can be thought, it can be done, a problem can be overcome”.

Ya, exactly after two weeks finally the problem is solved. You will be surprised to know there was not any error actually. It was just a silly mistake.

Now, talking about it less and should come to main point.

When I was retrieving a piece of OpenStreetMap data in PBF format from the site I have to create the bounding box of the desired location and seriously I selected the box containing Berlin 😉 in a hurry and didn’t noticed it. Ya, I know it is a funny moment.

The problem is solved by selecting the correct bounding box.

I have added two three lines in file “renderd.conf” file.

Now, the final “renderd.conf” llook like this.

rend

Finally, to see your own tile server type the URL “http://localhost/osm/slippymap.html”

ooooo

On zooming it more,

ooo

Greatness can be contagious, but first there must be contact.

Stay tuned.

Fundamentals On OSM

As, my mentor suggested me to concentrate more on the fundamentals of the OSM and record the flow of things going on in order to solve your error(i.e. not getting map on browser). So, today I share with you the fruitful things I learned while searching upon this.

Here we will start ->

Rendering

The process of rendering a map generally means taking raw geospatial data and making a visual map from it.

Raster

Geo loosely means ‘the Earth’, as in geography or geochemistry. Spatial refers to ‘in space’, meaning anything that can be represented in terms of position, coordinates etc.

Geographic Information Systems (GIS)

 GIS is a computer system for capturing, storing, checking, and displaying data related to positions on Earth’s surface. GIS can show many different kinds of data on one map. This enables people to more easily see, analyze, and understand patterns and relationships

The Global Positioning System (GPS) is a space-based navigation system that provides location and time information in all weather conditions, anywhere on or near the Earth where there is an unobstructed line of sight to four or more GPS satellites.

There are different layers like Standard, Cycle Map, Transport Map, Humanitarain showing different rendering styles. There are several layers created using Mapnik software including the default ‘Standard’ layer.

psql means  PostgreSQL interactive terminal

Command

create extention postgis;

The core postgis extension installs PostGIS geometry, geography, raster, spatial_ref_sys and all the functions.

Today, I searched a new term QGIS.

QGIS (previously also known as Quantum GIS) is a free (GNU GPL v2) and open source GIS application enabling the user to visualize, manage, edit, analyse data, and compose printable maps. It runs on Linux, Unix, Mac OSX, Windows and Android and can be downloaded free of charge from qgis.org.

 sudo add-apt-repository ppa:ubuntugis/ubuntugis-unstable

sudo apt-get install qgis

I will update in my next blog why and how to use it.

Stay tuned:)

Map On browser

Map On browser

OpenLayer.js

OpenLayers makes it easy to put a dynamic map in any web page. It can display map tiles, vector data and markers loaded from any source. OpenLayers has been developed to further the use of geographic information of all kinds. It is completely free,

OpenLayers has long been the standard choice for embedding a browsable OpenStreetMap view into a webpage. A mature and comprehensive library (over 400k of minimised JavaScript), it has a moderate learning curve but is capable of many applications beyond a simple “slippy map”: its features include full projection support, vector drawing, overview maps, and much more.

Now, to see your map on the browser, you need to add this(OpenLayer.js) javascript file. You may always choose any other alternative like Leaflet (a new and lighter library). I used OpenLayer.js

Steps:

To create folder osm in /var/www/ use the following command

sudo mkdir /var/www/html/osm/

sudo chown $USER /var/www/html/osm/

cd /var/www/html/osm/

And in osm folder download these:

wget http://openlayers.org/api/theme/default/style.css
wget http://www.openlayers.org/api/OpenLayers.js
wget http://www.openstreetmap.org/openlayers/OpenStreetMap.js

and create img folder in osm/

 sudo mkdir img

Now, paste the following files in ‘img’ folder:

wget http://www.openstreetmap.org/openlayers/img/blank.gif
wget http://www.openstreetmap.org/openlayers/img/cloud-popup-relative.png
wget http://www.openstreetmap.org/openlayers/img/drag-rectangle-off.png
wget http://www.openstreetmap.org/openlayers/img/drag-rectangle-on.png
wget http://www.openstreetmap.org/openlayers/img/east-mini.png
wget http://www.openstreetmap.org/openlayers/img/layer-switcher-maximize.png
wget http://www.openstreetmap.org/openlayers/img/layer-switcher-minimize.png
wget http://www.openstreetmap.org/openlayers/img/marker.png
wget http://www.openstreetmap.org/openlayers/img/marker-blue.png
wget http://www.openstreetmap.org/openlayers/img/marker-gold.png
wget http://www.openstreetmap.org/openlayers/img/marker-green.png
wget http://www.openstreetmap.org/openlayers/img/measuring-stick-off.png
wget http://www.openstreetmap.org/openlayers/img/measuring-stick-on.png
wget http://www.openstreetmap.org/openlayers/img/north-mini.png
wget http://www.openstreetmap.org/openlayers/img/panning-hand-off.png
wget http://www.openstreetmap.org/openlayers/img/panning-hand-on.png
wget http://www.openstreetmap.org/openlayers/img/slider.png
wget http://www.openstreetmap.org/openlayers/img/south-mini.png
wget http://www.openstreetmap.org/openlayers/img/west-mini.png
wget http://www.openstreetmap.org/openlayers/img/zoombar.png
wget http://www.openstreetmap.org/openlayers/img/zoom-minus-mini.png
wget http://www.openstreetmap.org/openlayers/img/zoom-plus-mini.png
wget http://www.openstreetmap.org/openlayers/img/zoom-world-mini.png

These files will help you to run your OpenLayer.js file offline. Now, configure these in slippymap.html file which display your local tiles on the browser.

sudo vim slippymap.html

 

You can give any name to this file according to your choice. Now add following text in this file:

<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
    <title>OSM Local Tiles</title>
    <link rel="stylesheet" href="style.css" type="text/css" />
    <!-- bring in the OpenLayers javascript library -->
    <script src="OpenLayers.js"></script>
    <!-- bring in the OpenStreetMap OpenLayers layers. -->
    <script src="OpenStreetMap.js"></script>
 
    <script type="text/javascript">
// Start position for the map (hardcoded here for simplicity)
        var lat=47.7;
        var lon=7.5;
        var zoom=10;
 
        var map; //complex object of type OpenLayers.Map
 
        //Initialise the 'map' object
        function init() {
 
            map = new OpenLayers.Map ("map", {
                controls:[
                    new OpenLayers.Control.Navigation(),
                    new OpenLayers.Control.PanZoomBar(),
                    new OpenLayers.Control.Permalink(),
                    new OpenLayers.Control.ScaleLine({geodesic: true}),
                    new OpenLayers.Control.Permalink('permalink'),
                    new OpenLayers.Control.MousePosition(),                    
                    new OpenLayers.Control.Attribution()],
                maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
                maxResolution: 156543.0339,
                numZoomLevels: 19,
                units: 'm',
                projection: new OpenLayers.Projection("EPSG:900913"),
                displayProjection: new OpenLayers.Projection("EPSG:4326")
            } );
            
            layerMapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik");
            layerMapnik.setOpacity(0.4);
            map.addLayer(layerMapnik); 
            
            layerCycleMap = new OpenLayers.Layer.OSM.CycleMap("CycleMap");
            layerCycleMap.setOpacity(0.4);
            map.addLayer(layerCycleMap);

            // This is the layer that uses the locally stored tiles
            var newLayer = new OpenLayers.Layer.OSM("Local Tiles", "https://localhost/osm_tiles/${z}/${x}/${y}.png", {numZoomLevels: 19, alpha: true, isBaseLayer: false});
            map.addLayer(newLayer);
            // This is the end of the layer
 
                var switcherControl = new OpenLayers.Control.LayerSwitcher();
                map.addControl(switcherControl);
                switcherControl.maximizeControl();
 
            if( ! map.getCenter() ){
                var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
                map.setCenter (lonLat, zoom);
            }
        }
 
    </script>
</head>
 
<!-- body.onload is called once the page is loaded (call the 'init' function) -->
<body onload="init();">
 
    <!-- define a DIV into which the map will appear. Make it take up the whole window -->
    <div style="width:100%; height:100%" id="map"></div>
 
</body>
 
</html>

 

Mapnik option  is working fine but the option “local tiles” is not showing GNE map. Mine is looking like this.

 

osm 5

During Saturday presentation,  Mandeep helped me to found an error and I am trying to find the solution.o.png

If you know the solution please let me know.

The error character encoding is solved by adding two lines in the file slippymap.html after head tag.

<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">

 

Stay tuned. 🙂

Import Data into Database

Import Data into Database

Loading data into your server

Get the latest OpenStreetMap data

Retrieve a piece of OpenStreetMap data in PBF format from http://planet.openstreetmap.org/.

If you need the entire planet file, you can do it by issuing the following command (again substitute your user for username below):

sudo mkdir /usr/local/share/maps/planet
sudo chown username /usr/local/share/maps/planet
cd /usr/local/share/maps/planet 
wget http://planet.openstreetmap.org/pbf/planet-latest.osm.pbf

It nearly take 7 to 8 hours to download the map of the world. 
So better to extract the small area of the map.

** Here you can download the data from http://extract.bbbike.org/ . By selecting the bound box and do select the format as pbf or any other according to your choice. You will get the email with the link having the data of the region you want and then download it .

Note : 1.Data is only Available for 48 hours to download from link you got in mail .

osm1

Importing data into the database

With the conversion tool compiled and the database prepared, the following command will insert the OpenStreetMap data you downloaded earlier into the database. This step is very disk I/O intensive; the full planet will take anywhere from 10 hours on a fast server with SSDs to several days depending on the speed of the computer performing the import. For smaller extracts the import time is much faster accordingly, and you may need to experiment with different -C values to fit within your machine’s available memory.

osm2pgsql --slim -d gis -C 1500 --number-processes 4 /usr/local/share/maps/planet/planet-latest.osm.pbf

Intially, I was getting an error because I was working in another user. So, first check, if you have made new user as said in my previous blog, then move to that user.

osm 2

The number of nodes, ways and relations processed will obviously differ by the size of the data extract you are using and the date of the data dump. The numbers shown here are not reflective of the full planet import, which is substantially larger.

Congratulations, if everything is working fine.

Testing your tileserver

Now that everything is installed, set-up and loaded, you can start up your tile server and hopefully everything is working. We’ll run it interactively first, just to make sure that everything’s working properly. Remember to substitute your username again:

sudo mkdir /var/run/renderd
sudo chown $USER /var/run/renderd
sudo -u $USER renderd -f -c /usr/local/etc/renderd.conf

and on a different session:

sudo service apache2 reload

If any FATAL errors occur you’ll need to double-check any edits that you made earlier.

 

If not, try and browse to http://yourserveraddress/osm_tiles/0/0/0.png to see if a small picture of the world appears. The actual map tiles are being created as “metatiles” beneath the folder /var/lib/mod_tile.

osm 3

Setting it to run automatically

If it ran successfully, you can stop the interactive renderd process and configure it to run automatically at machine startup as a daemon.

sudo cp  ~/src/mod_tile/debian/renderd.init /etc/init.d/renderd
sudo chmod u+x /etc/init.d/renderd

Edit the /etc/init.d/renderd file as root – you’ll need to make a couple of changes to the DAEMON and DAEMON_ARGS lines so that they read:

DAEMON=/usr/local/bin/$NAME
DAEMON_ARGS="-c /usr/local/etc/renderd.conf"

Also, you’ll need to change references to www-data so that they match your username – change “www-data” to what you changed “username” to in other files.

You should now be able to start mapnik by doing the following:

sudo /etc/init.d/renderd start

and stop it:

sudo /etc/init.d/renderd stop

Logging information is now written to /var/log/syslog instead of to the terminal.

Next, add a link to the interactive startup directory so that it starts automatically:

sudo ln -s /etc/init.d/renderd /etc/rc2.d/S20renderd

and then restart your server, browse to http://yourserveraddress/osm_tiles/0/0/0.png and everything should be working! Zoom level of tiles is up to 20.

osm 3

You can also go to the page http://yourserveraddress/mod_tile which should give you some stats about your tile server.

osm 4