Convert Google Map into Image with Markers and Paths.

In one of my application, there was a google map showing the route of a person traveled in a selected day. I was trying to convert that HTML section into downloadable PDF format, which should have that dynamic map as well. So I tried to convert that HTML section into the canvas, but unfortunately as google maps are loaded in iframes, so I was not able to get an actual map there was only icon and polylines which I marked to show the path.

Continue reading Convert Google Map into Image with Markers and Paths.

Generate Multipage PDF using Single Canvas of HTML Document using jsPDF

jsPDF is a nice library to convert HTML content into PDF. We can put the different type of elements in PDF from HTML like an icon, images, text, CSS styles.
Here we will discuss an example of jsPDF to convert long HTML page into PDF document which will be generated client-side and download.

Continue reading Generate Multipage PDF using Single Canvas of HTML Document using jsPDF

[Resolved] When I faced “#1273 – Unknown collation: ‘utf8mb4_0900_ai_ci'” Error

Dataflows in many forms. Someday I was about to transfer MySQL data from one of my servers to my local PC having PHPMyAdmin. On my server PC, I was having WorkBench. A WorkBench is a free tool to manage MySQL queries acts like a  relational database management tool.

I took a dump of a database with stored procedures using Export data wizard in WorkBench. So I was ready to import all data from the SQL file. I use XAMPP to set up a localhost server and PHPMyAdmin.

Continue reading [Resolved] When I faced “#1273 – Unknown collation: ‘utf8mb4_0900_ai_ci’” Error

Angular 7/6 | Pass Data between Components Example Application

Continuing from my previous post has an example of filter pipe usage in Angular 5 application. Here we will upgrade that simple filter app to level next. I have upgraded this application to Angular v6, worked basically on two important methods using which we can pass data between Angular components.

Continue reading Angular 7/6 | Pass Data between Components Example Application

Angular 7/6 | How to Show Radio Input Listing

Listing of items in data is a simple way to show items. If users have to select only a single Item out of it, we need to use radio input fields. here we will discuss the implementation of radio input list in Angular 6. We will develop a simple Angular application which will have the following tasks:

1) Create a new Angular Application.
2) item.ts having item model definition.
3) mock-data.ts, will have a list of items.
4) use ngModel to have data binding flowing both sides.
5) Change event binding to get Checked item record.

Continue reading Angular 7/6 | How to Show Radio Input Listing

Angular 7/6 | Share Data between Components Using @Input Decorator

Angular’s best feature is component. We can divide different modules into a number of components. Where each component having its own responsibility to perform. But, sometimes these components may need to communicate with each other and share data having each other’s dependencies.

In this post, we will discuss a simple example app which will share data between components using @Input() Decorator. @Input() decorator will allow passing data in the defined template.

Continue reading Angular 7/6 | Share Data between Components Using @Input Decorator

Resolved! Disable Alphabetical Sorting of JSON Attributes in Response from C sharp Service

JSON response received on the client side is generally in alphabetical order. This happens when we don’t add any sort order on our server-side API layers. In one of my project, there was a situation in which I wanted to add columns in Excel file from JSON response, as JSON attributes( In my case colum headers ) arranged in alphabetical, but I wanted them to be in some required order. I tried to do this client side in JS but it costs a lot! in term of page loading performance when data is large. As my services were in ASP.NET using C sharp so after some research, I tried something which worked like charm.

Continue reading Resolved! Disable Alphabetical Sorting of JSON Attributes in Response from C sharp Service

Create and Download XLS Excel From JSON Response Data in Webpage Using Javascript

Viewing formatted data on HTML webpage is a good idea until the user wants to do some quick changes in tabular data like sorting, filtering. So it is better to take it in your own hands instead of making server calls. Today we will convert JSON response data into the Excel file. Excel file will have a header and columns defined which will be downloaded on the client side.

Continue reading Create and Download XLS Excel From JSON Response Data in Webpage Using Javascript

Resolved! FirebaseInstanceIdService is deprecated

So after updating the version of firebase-messaging in the build.gradle file from v17.0.0 to v17.1.0, strange things started happening…

there was a line of horror in service I used to use for messaging in my application. After some research, I landed on this page.

Let’s quickly go to updates which we need to do to get it working like before.

Continue reading Resolved! FirebaseInstanceIdService is deprecated

Lazy / Partial Load Modules and Controllers in AngularJS Example

A complex application built using AngularJS takes a lot of time to load due to a large number of view controllers and other modules. As AngularJS acts as a web application we need to load all resources on page load. But we can adopt a new approach to load only required resources like controllers which we need for that particular view. This is called Lazy Loading where we load what we need.

Continue reading Lazy / Partial Load Modules and Controllers in AngularJS Example