GIS Problems

While selecting your username, make sure it is one you would like to see as your github page url. An example is https://bayoishola20.github.io || https://your-username.github.io

2. Log in to the new account. Pay attention that I logging in with my username.

3. Create a new repository. Navigate to this url to create a github repository. https://github.com/new Ensure you are logged in.

4.  We would go ahead to fill the necessary information from the previous step.

Insert “Repository name” as your-username.github.io .In my case, it is bayoishola20.github.io. Leave it as Public so that everyone can see it. Also do not check “Initialize this repository with a README”. Finally, hit the green “Create repository” button.

5. A redirect should occur after completing the last step. At this point all is set-up and we would need to head to our computer and push the code site we built.

If you navigate to the page (https://your-username.github.io ), you should see the below. This is because we are yet to take our files online.

6. If you do not have git installed on your system, follow the below guidelines. [If you are on Ubuntu Linux OS, skip this as you should already have git installed.]

Download Git bash for Windows/Mac here https://git-scm.com/downloads .

During the installation process, use the default options provided except you are well familiar with the alternatives.

After installation, your screen should look like below (for Windows).

Run the below commands one-after-the-other in the bash window to set-up our configuration. git config --global user.name "your-username" git config --global user.email "[email protected]"

Replace your-username with your github username and [email protected] with the email you used in creating your account.

·         To confirm all you have done, enter the following in your bash window

          git config –list

7. Navigate to the folder where you have the web map app you need to deploy.

For instance, to navigate to the desktop folder, you would do:

      cd ~/Desktop

Be careful to note that a forward slash and not backslash is used.

Recall that in the previous tutorial that you could specify the folder you want your web map to be saved. (See below screenshot)

At the bottom of the list result, should see user.name and user.email and its values somewhere below.

By default, the exported folder has a very long name. Rename it to “qgis2web”.

8.  Now, head back to the repository we created on github and copy url.

Enter the below and the link you copied in your git bash. It should take this format.

  git clone https://github.com/yourusername/your-username.github.io.git

You may now change directory by moving into the new folder you just cloned. The folder should look my screenshot above.

cd your-username.github.io

When done, go back to the repository and you should put all the qgis2web folder map app files there.

If you look into the qgis2web folder, you will see an index.html. This file must always be present in order to get the url working correctly.

In the CSS folder, you would see a file called “qgis2web”. It is a CSS file. Open it with Notepad or any editor of your choice and copy-paste the below to the top of the file.

html, body, #map {

  width: 100%;

  height: 100%;

  padding: 0;

  margin: 0;

}

Once in the your-username.github.io folder that you just cloned, run the below commands one-after-the-other in your git bash window.

git init

git commit -m "first commit"

git remote add origin https://github.com/your-username/your-username.github.io.git

git push -u origin master

When you run the last command, you would need to enter both username and password you created on your github account (Did you forget it? Perform a password reset on the github.com and you should try not to forget it.)

Once done, go back to your github repository and you would see all the files you just pushed.

You may wish to select and download the Sentinel Toolboxes (Sentinel-1,Sentinel-2, Sentinel-3) , or SMOS Toolbox or All Toolboxes, if you wish. You guessed right, as long as you have sufficient memory. I do recommend downloading “All Toolboxes”.

Once installed, you should see the below when launching.

And... this should be your default environment outlook.

In subsequent post(s), we would look at downloading images for a study area.

Feature Highlights

Common architecture for all Toolboxes

Very fast image display and navigation even of giga-pixel images

Graph Processing Framework (GPF): for creating user-defined processing chains

Advanced layer management allows adding and manipulation of new overlays such as images of other bands, images from WMS servers or ESRI shapefiles

Rich region-of-interest definitions for statistics and various plots

Easy bitmask definition and overlay

Flexible band arithmetic using arbitrary mathematical expressions

Accurate reprojection and ortho-rectification to common map projections,

Geo-coding and rectification using ground control points

Automatic SRTM DEM download and tile selection

Product library for scanning and cataloguing large archives efficiently

Multithreading and Multi-core processor support

econ1 (ECONOMY) and

income1 (INCOME GROUP)

STEP I: Launch QGIS

STEP 2: Use “Add Vector Layer” to load ne_10m_admin_0_countries.shp using the first icon on the left menu bar.

STEP 3: Understanding the attribute data.

Right click on the imported vector layer (shapefile) and click properties.

If you scroll to the end of the attribute table, you should see the above columns/fields. econ1 stands for Economy and income1 stands for Income Group.

Using the above ranking, each country is assigned its economy rank as well as its income group rank. Both variables (economy and income group) are then concantenated in a field called “econincome”. So, a country with a rank of 1 as its Economy ranking and 1 as its Income Group, would have 11 in its econincome field. The United States for America for example is 11 which interprets to having being a Developed and High Income Country.

STEP 4: Categorizing data using the “econincome” field.

Right click on the vector file in the “Layers Panel” and select “properties” as seen below.

Ensure you are on the “Style” side tab menu and using the topmost dropdown menu, select “Categorized”. We would be categorizing countries.

Select the “econincome” field for the “Column” option as seen below.

Once that is done, hit “Classify” and you screen should be similar to the below.

STEP 5: Assigning legend interpretation.

Based on the data classification scheme, go ahead and edit the interpretation in the legend like below. Click “Apply” to effect all the changes.

STEP 6:  Color scheming.

Now, right click on each symbol and go to “change color”. See screenshot below.

We would be using the “HTML notation” to edit the color. This way, we are sure we would be using same color ramp.

For value “11”, that is “Developed and High Income” countries, use #e8e8e8 as the “HTML notation”. Click “ok” and repeat the procedure for each symbol using the color scheme below.

When done, you should have something like the below.

Click “ok” and your workspace should look like the below.

STEP 7: Map finishing.

You may wish to change the background picture by visiting the top menu bar as below. Go to “Project” and then “Project properties”.

Ensure you are on the “General” side menu tab and locate “Background color”. The default should be white. Change it to black or any desired color.

The above should be your current screen outlook showing two variables – economy and income group – of counties at a glance.

Extra tip: To get the nice visualization, do:

 Right click on each symbol like in Step 6 and sharp double-click.

A “Symbol selector” dialog should pop open.

Click the “Simple fill” and you should see more options open below.

Do not change “Fill” but instead, change “Outline” to “white” or #ffffff.

PS: This is a follow-up on a training at YSN 2018 Conference at Command Guest House in Bauchi, Nigeria on June 18, 2018.

STEP 2: Load vector layers

Extra tip: To get the nice visualization, do:

Right click on target vector layer and select “Properties”

If point feature-type, select “Simple marker” under “marker”

Still if point feature-type, consider increasing “Size” to about “5.0000”

To style (point or polygon feature-type), select “fill” as say “green” and “Outline” as “white”.

Do this for as many as you desire.

STEP 3: Getting Plugin

Currently, your QGIS menu bar should look like this.

Now, ensure you are connected to the Internet and do the below:

Go to the main menu bar and look for “Plugins” tab and click on it

Select “Manage and Install Plugins” by clicking on it. [At this point, you should have your Internet connected

A dialog box should pop open as below. Search for “qgis2web”

Once installed, your QGIS menu bar should have this icon added.

This is the qgis2web icon.

STEP 4: Preparing map for publishing

Remember to turn on only vector layers you need for the web map.

For the “Layers and Groups”, on each vector layer (say “schools” like in the screenshot above), change the values for the “Popup fields”.

To do this, use the drop down and change it from “no label” to “inline label”, for example. Repeat this for each vector layer and its attributes as you desire.

For the screenshot below, I have used “inline label” attribute style for AREA, PERIMETER and NAME for the “schools” vector layer.

You could leave other default settings. However, choose “Leaflet” instead of “OpenLayers”. There is no technical reason for this but rather operator’s preference.

STEP 4: Preview and Publish

Hit the “Update preview” button as highlighted below and you should see a preview.

Because school is a point feature and seems to cluster, under “schools” vector layer, check “cluster”. Also click on the “OSM” option in the bottom right pane of the window.

The background image you now see is a result of selecting “OSM”, You could play around with other map tiles available. A school has been clicked and its preview as shown.

Export map using the “Export” button and it should open up in your default browser.

All vector layers successfully exported as shown above.

The above is our map being loaded on our browser.

PS: This is a follow-up on a training at the Department of Surveying and Geoinformatics Engineering, University of Lagos, Akoka-Yaba, Nigeria.

Many thanks to the QGIS team and the qgis2web author and contributors.

http://bayoishola20.github.io @bayoishola20

METHOD

Let’s do this:

Importing of image (xxx.jpg) having set project folder (C:\Users\...) using the ‘Desktop Publishing Format’ as shown in the graphic.

Importation Menu Box for JPGIDRIS: converting JPG to IDRISI. Give output choice name.

Click “Output Reference Information”. See below.

From the above, observe that start (x, y) pixel position is (0, 0) and ends at (661,379). This interprets to 662 pixel along the horizontal and 380 pixels along the vertical. Imagine we had used a larger image right!?

Image output above tells that the radiometric range of the image is 0 – 255 indicating that it’s an 8-bit image gray scale image with a size of 150 Kilobyte on disc.

                                          (2)n-1= (2)8-1=255

Follow these steps: IDRISI Explorer >> (Right Click) >> show structure.

The structure revealed that at (0, 0) --> (Row, Col), the digital number (DN) has a value of 152.

Move your mouse around and using the feature  property tool, a region with zero (0) [e.g at (75, 479)], radiance value indicates no reflection with total absorption. Whereas at(185, 40), the image has radiance value of 246 out of the possible 255 indicating high reflection with little absorption 

A graphical representation of the radiometric variation in the image:

Easily access the histogram function using the search tool at the far right of the menu bar. Type Histo and hit the enter key or use the green arrow button just beside it. Ensure you choose the Graphic radio button and specify class width in the space provided. You could as well toggle values for class width to achieve desired statistical and visual result.

At a class width of 1, for a frequency bar graph plot, the radiance values are plotted as above.

Just a little further, the numeric mode of the graph above can be achieved. From the HISTO dialogue box, rather to select Graphic, choose Numeric. Results could be saved and much more could be done with it.

Above is a truncated output.