My first Geo Location program using Leaflet JS

Hi folks,

Today I am going to explain writing an geo location HTML page with Leaflet JS.

You can find my program in my GIST GitHub List

https://gist.github.com/psrdotcom/85c56bc2ffaadb254e63bde2b3b162d5

Procedure

• Make the empty HTML page with HTML, HEAD, BODY tags
• Place the CSS link first in HEAD tag
• "https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"
• After CSS, paste the Leaflet JS file reference
• "https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"
• In BODY, create a DIV tag specifying the ID attribute and height and width style attributes
• id="mapid" style="width: 600px; height: 400px;"
• Get lat (Latitude) and long (Longitude) of your own choice of location.
• Take latlong reference from https://www.mapcoordinates.net/en
• Use map setView to set the location with latlong and zoom level
• var mymap = L.map('mapid').setView([17.496380,78.393175], 15);
• Make a marker with popup using marker and bindPopup functions
• var marker = L.marker([17.496380,78.393175]).addTo(mymap);
• marker.bindPopup("Hello !! This is JNTU, Hyderabad, India campus.").openPopup();
• Open your HTML page in any compatible browser
• You should be able to view your map with specified location and control the map with zoom out and zoom in capabilities.

Please send your feedback and comments to psrdotcom@gmail.com

My first WebAssembly program

Hi folks,

Today, I am going to explain how to setup and write a sample program.

WebAssembly enables high performance applications on web pages. WebAssembly natively runs on browser along with HTML, CSS, JavaScript and approved by W3C (World Wide Web Consortium).

To know more about WebAssembly, go through the official webiste https://webassembly.org/

Pre-requisites

1. Git
2. CMake
3. Host system compiler
• Windows - Visual Studio 2017 +
• Linux - GCC
• Mac - XCode
4. Python 2.7.x

After downloading and installing the pre-requisites, make sure git, cmake and python are accessible in path.

Install

1. Open Terminal/PowerShell with Admin rights
2. Get the emsdk files

• git clone https://github.com/emscripten-core/emsdk.git

3. Navigate to the downloaded folder emsdk

• cd emsdk

4. Install (Note: On PowerShell execute this command, Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope LocalMachine)

• ./emsdk install latest

5. Activate

• ./emsdk activate latest

Create Sample HTML file

• Create folder
• mkdir hello
• Navigate to the folder
• cd hello
• Create a file hello.c and place the following code

#include
int main(int argc, char ** argv) { printf("Hello PSR!\n");}

Convert C file to HTML

emcc hello.c -o hello.html

Run WebServer (Optional)

Run emrun webserver to serve the html pages.

emrun --no_browser --port 8080 .

Hope, the tutorial is useful. Happy coding.

Please send your comments and feedback to psrdotcom@gmail.com