What is a Rectilinear polygon?

A rectilinear polygon, according to Wikipedia, is a polygon all of whose edge intersections are at right angles. Thus the interior angle at each vertex is either 90° or 270°.

Use case for a Rectilinear polygon

The use case is for the user to beautify the shape of a polygon for procedural modelling as designing architecture is much easier using a regular-shaped land parcel. In my previous article, I explored similar outcome by finding the largest rectangle within a convex polygon. If that interests you, you can read the article here.

Rules for the algorithm


Background

To ensure your application secrets remain secret on the sever, you might want to encrypt sections of Web.Config file on desk so that not everyone who has access to the server can open and read the file. Important sections of Web.Config include ConnectionString (which holds the credentials to databases) and AppSettings (which is typically used to store other API keys or secrets). Enabling encryption of Web.Config for ConnectionString is simple. Just set <MSDeployEnableWebConfigEncryptRule>true</MSDeployEnableWebConfigEncryptRule> within your project’s PublishProfiles and it is done. However, if you would like to encrypt the AppSettings component within Web.Config, it would take a lot more effort.


Background

Recently I was exploring on a new personal project and was considering to add this functionality of finding the maximum sized rectangle within a polygon based on GIS. I tried searching for such an algorithm and found a solution from the forums and tested it — https://community.esri.com/t5/spatial-data-science-questions/how-to-find-the-maximum-rectangle-contained-within-a-polygon/td-p/408977

In one of the replies within the post, there is another algorithm method by D3plus — https://d3plus.org/blog/behind-the-scenes/2014/07/08/largest-rect/. The article has 1st class visualization in explanation of the algorithm. Good to take a look.

While I am looking for a solution that works beyond convex polygons, I would just implement a simple algorithm first…


Background

Marker Clustering is used to display large number of markers on the map. It is a visualization technique for the analyst to make sense out of the large data on a map.

Google Map offers marker clustering which is performed on the client-side. The spatial information needs to be sent to the client to perform the clustering, which is also how Deck.gl implement this. This could pose issues if data is sensitive or large to be transferred over via mobile broadband.

An alternative solution is to move the clustering to server-side and send the results to the client for viewing…


Architecture

My design of a simple web map dashboard consist of a backend, web map server and a GIS-enabled database. The web map server is not always necessary as the map could drawn frontend. I will cover more under the Geoserver section below.

System Architecture

NodeJS

Using NodeJS to host the web backend services. Functionalities of the typical non-map/GIS application like sign up, CRUD, etc…A common question would be whether we could replace Geoserver with NodeJS? The answer depends on your use case and expected interaction with the application. There are certain advantages of using existing WMS protocol. You would not need to write…


Webpack 5 was released on Oct 2020. In the official release statement — https://webpack.js.org/blog/2020-10-10-webpack-5-release/, Webpack 5 has improvements in code generation and general tree shaking. Let’s try some basic tests to see if there is any difference between the generated packages.

First, let’s try to setup a single environment with both version of webpack. Although it will be easier to just have 2 separate setup installed with different version of webpack each.

npm i webpack --save-dev

The version I used is v5.12.1 and v4.44.2. I believe there will be differences from using different versions. …


Purpose

Youtube’s algorithm boosts videos that are in view. Therefore you may want to constantly keep your videos in watch to get even more views. Alternatively, automating youtube views is a pretty fun project.

Tech Stack

The technology used is quite simple. I will be using primarily Nodejs and PuppeteerJS as I would like to emulate a human viewer as close as possible. Using PuppeteerJS encapsulates most of the complexity.

Application Flow

const browser = await…


Background

Your security team performed a security scan and found vulnerabilities on cipher suites on your site and requested you resolve them.

What does it mean?

Client browser communicates with your server through HTTPS encruption and SSL/TLS encryption and your server will support a range of encryption methods (cipher suites). Ciphers are algorithms, more specifically they’re a set of steps for performing a cryptographic function. Some cipher suites are more secure than others. You can read here to find out more on cipher suites here — https://www.thesslstore.com/blog/cipher-suites-algorithms-security-settings/

First step is to be able to find out the list of available cipher suites independently . If…


Overview

New web applications support functionalities to store files/images/videos/etc and there are many options in executing this. One could keep it inside the database, store within the local file storage, S3 buckets, and the list goes on. Best practice would be to store it in a separate entity so that scaling is possible for both the web server and file server.

In this article, I will go through the option of storing it in Dropbox. …


Overview

Today’s web application often enable user to upload photos, videos, files to it. The data are large and needs to be handled differently from standard forms.

Setup

Setup the project…

npm init -y

Install both ExpressJS and Multer dependencies…

npm i express multer

Code

I will go through the steps in parts for better understanding.

Step 1: Setup server-side — index.js that return a basic html for uploading.

Running node index.js, you will be able to see the following…

Step 2: Setup Multer

Add Multer and path library

const multer = require(‘multer’);
const path = require(‘path’);

Setup storage destination — Upload…

Louis.Z

A passionate software engineer with strong background in web technology, product development and design architecture.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store