Showing posts with label Javascript. Show all posts
Showing posts with label Javascript. Show all posts

Tuesday, November 14, 2017

SharePoint Charts with HighCharts

, , No comments

     HighCharts for SharePoint


 Overview

  • HighCharts is an interactive JavaScript based Charts.
  • It is configured with JSON based data
  • HighCharts can be used to populate charts based on SharePoint list data.
  • It can be dynamically updated
  • It can also link multiple lists and provide a drill down chart.

Configuring for SharePoint

  • Refer Jquery and other libraries to read and manipulate SharePoint data.
  • Refer HighCharts.js. Additionally Drilldown.js or Treeview.js or any other related HighCharts libraries may be required based on the type of chart. Details are available in the HighCharts website based on each chart type.
  • Generally HighChart variable as series array. It has data variable which holds chart JSON data.
  • Read and load SharePoint list data.
  • Build the data string in the chart format.
  • Convert the data to JSON object and initialize HighChart.
  • List data can be reloaded with setTimeout function for constant reload.


Reference : https://www.highcharts.com/  
Share:
Read More

Saturday, September 5, 2015

Javascript Basics

No comments

JavaScript
Basics
  • Dynamic
    • Variables have types but can change from one type to other
  • Object Oriented
    • Prototypes based
  • JIT Complied 
  • <script> tags to include script
    • <script type="text/javascript" href="script1.js"></script>
    • Included inside <head> or <body>
      • <head> scripts are loaded before DOM
      • <body> scripts are loaded during DOM
Variables
  • Declaration
    • var myVar1
    • not necessary to be declared
      • myVar2 = "abc";
    • "use strict"  for enforcing declaration
  • Types : typeof(myvariable) to get type
    • boolean
      • true or false
    • number
      • 2
    • string
      • "2"
    • object
      • var person = {
                                 name="abc",
                                 age=25,
                                 address={street,city,pincode},
                                 function printDetails(){statements;}
                                 };
      • objects can be mutated (add new property at any stage)
        • person.height=5.5;
    • function
      • function myFun(var1){
        }
    • undefined
      • var var1;
  • multiple declaration will overwrite any previous declaration
  • Scope
    • can be local only inside a function
    • will be available for that execution of function and if referred in its subfunctions
Arrays
  • var people = [];
  • people.push(person1);
  • people.length
Conditions 

  • if( a == b)

    • == or != Types ignored
    • === or !== types also need to be equal

  • switch(case){case(a) statements;break;case(b) statements;break;}
  • condition?true:false

Loops

  • while(i<10){}
  • for(var i = 0; i < people.length ; i++ ){}

    • break
    • continue

Functions

  • functions are another variable type
  • cannot be overloaded

    • two functions with same name but different parameters will be overwritten as a single function
    • function fun1(var1,var2){}
      • function calls with variable mismatch works
        • fun1(var1) : var2 is undefined

  • Anonymous function

    • will not have name
    • called as and when declared
    • function(){}

  • functions can be passed as function parameter

    • function funMain(var1,callback1){
      statements;
      callback1();
      }
    • function callback1(){}
    • funMain("abc",callback1);

Commom properties and functions

  • alert("Message");
  • console.log("message")

    • logs on debug console window (F12 on browser)

  • document

    • variable which stores all contents of HTML document
    • document.getElementById("idofDOMElement")
      • innerHTML

  • window

    • root of the current window in a browser
    • can have document loaded directly of in side multiple frames
    • stores all global variables

Share:
Read More
  • SharePoint Charts with HighCharts
         HighCharts for SharePoint Overview HighCharts is an interactive JavaScript based Charts. It is configured with JSON based...
  • CSS Basics
    CSS :  Cascading Style Sheet Basics Inline user interface rules <style></style> tags Separate file styling <...
  • HTML Basics
    HTML :  Hyper Text Markup Language Basics Derived from SGML (Standard Generalized Markup Language) Tags <> based languag...
Powered by Blogger.

Comments

Facebook

Ad Home

Business

Random Posts

Recent Posts

Header Ads

Tags

Categories

Follow Us

Recent Posts

Facebook

Random Posts

Most Popular

  • SharePoint Charts with HighCharts
    SharePoint Charts with HighCharts
         HighCharts for SharePoint Overview HighCharts is an interactive JavaScript based Charts. It is configured with JSON based...
  • CSS Basics
    CSS Basics
    CSS :  Cascading Style Sheet Basics Inline user interface rules <style></style> tags Separate file styling <...
  • HTML Basics
    HTML Basics
    HTML :  Hyper Text Markup Language Basics Derived from SGML (Standard Generalized Markup Language) Tags <> based languag...

Labels

Recent Posts

Unordered List

Pages

Theme Support