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 …
Default Scroll Bar Add the below CSS code to your stylesheet ::-webkit-scrollbar { width: 4px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); } ::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); } This is what you get, a more beautiful Scroll Bar Lets add some round corners and increase the width ::-webkit-scrollbar { width: …
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 …
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 …
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 …
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 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 …
//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 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 //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 …