This is in continuation of my previous post about creating Bar chart, we will try to add some more features to our chart to make it look more appealing with minimal changes. List of things we will add in this version of chart. x-axis and y-axis labels. y-axis line Animate the bars We will work on the same […]
Category: Javascript
Creating a Bar chart using HTML, CSS and Javascript – Part 1
Third party libraries like d3js, highcharts, flotcharts, morris, raphael are all amazing no doubt but sometimes you just need something dead simple and minimal without too much fanciness. And if all you want is just a bar chart to show some data without having to include a library with a dozen charts then you better figure […]
Client side caching of API responses
Talk about caching and we talk about how we are going to put everything into redis or memcache on our servers and send back cached responses to our clients and make our applications respond faster by taking the load off the databases. Below is a flow of how a typical caching mechanism looks like. While server caching is a phenomenal […]
Difference between localStorage, sessionStorage and cookies
localStorage, sessionStorage and cookies are all client storage solutions which store data as key/value pairs in the browser. localStorage and sessionStorage both extend Storage. There is no difference between them except for the intended “non-persistence” of sessionStorage. sessionStorage maintains a separate storage area for each given origin that’s available for the duration of the page […]
contenteditable DIV tag directive
Are you looking for a super simple WYSWYG editor and you don’t want to include any heavy library into your application. Then why not make your own using just a div. Take a look at the below directive. myApp.directive(“contenteditable”, function() { return { restrict: “A”, require: “ngModel”, link: function(scope, element, attrs, ngModel) { function read() […]
Inheritance in Javascript
Inheritance is a concept which says you can create a class from another class if you would like to use its properties. A parent cantalk and caneat, so can the child because child “is a” subclass of Parent. While most programming languages have the concept of classes, in javascript its all about objects inheriting from other […]
Different ways of creating an object in Javascript
//1. using curly braces var myVar = {}; //2. using new operator var myVar = new Object(); //3. using the Object.create method var myVar = Object.create(Object.prototype);
for…in statement to loop through the javascript object properties
for..in is used to iterate through the properties in our javascript objects. The syntax for (variable in object) { //do something with the variable } Example “use strict” var obj = {a:1, b:2, c:3}; for (var prop in obj) { console.log(“obj.” + prop + ” = ” + obj[prop]); } // Output: // “obj.a = 1” […]
Different ways of setting a value to a Javascript object
Different ways of setting a value to a Javascript object //create an object var myVar = {}; //1. set value using dot myVar.key = “myvalue”; //2. set value using square brackets myVar[“key2”] = “myValue2″ //3. set value using defineProperty Object.defineProperty(myVar,”key3”,{ value : “myValue3” }); Setting values using the dot syntax or square brackets is pretty easy […]
Important Javascript Code snippets
To Generate UUID function generateUUID() { var d = new Date().getTime(); var uuid = ‘xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx’.replace(/[xy]/g, function(c) { var r = (d + Math.random() * 16) % 16 | 0; d = Math.floor(d / 16); return (c == ‘x’ ? r : (r & 0x3 | 0x8)).toString(16); }); return uuid; } Sample output : 48808c28-24e0-4081-be13-2c27948bfa27 Extract […]