OOP Using Java - GTU Programs: 2022

Friday, March 11, 2022

DV Lab -3-H- Develop Following Program Using HTML5 and JavaScript

GTU DV Lab -3- Develop Following Program Using HTML5 and JavaScript

3-H- Read JSON Data and draw Data Table

File Name-1= DV Lab3h JavaScript Bar Charts json1.html

Program Code:

<!DOCTYPE HTML>

<html>

<head>

window.onload = function () {

var chart = new CanvasJS.Chart("chartContainer", {

title:{

text: "GTU DV LAB-3-H-Fruits sold in First & Second Quarter"

data: [ //array of dataSeries

{ //dataSeries - first quarter

/*** Change type "column" to "bar", "area", "line" or "pie"***/

type: "column",

dataPoints: [

{ label: "banana", y: 58 },

{ label: "orange", y: 29 },

{ label: "apple", y: 80 },

{ label: "mango", y: 74 },

{ label: "grape", y: 64 }

]

{ //dataSeries - second quarter

type: "column",

dataPoints: [

{ label: "banana", y: 63 },

{ label: "orange", y: 73 },

{ label: "apple", y: 88 },

{ label: "mango", y: 77 },

{ label: "grape", y: 60 }

]

}

]

});

chart.render();

}

</script>

</head>

<body>

</div>

</body>

</html>

Output:

DV Lab -3-G- Develop Following Program Using HTML5 and JavaScript

GTU DV Lab -3- Develop Following Program Using HTML5 and JavaScript

3-G- Read the data XML file and draw Simple Chart

File Name-1= DV Lab3-g draw Data Table.html

Program Code:

<!DOCTYPE html>

<html>

<head>

<title>Chart using XML Data</title>

window.onload = function() {

var dataPoints = [];

$.get("https://canvasjs.com/services/data/datapoints.php?xstart=5&ystart=10&length=10&type=xml", function(data) {

$(data).find("point").each(function () {

var $dataPoint = $(this);

var x = $dataPoint.find("x").text();

var y = $dataPoint.find("y").text();

dataPoints.push({x: parseFloat(x), y: parseFloat(y)});

});

var chart = new CanvasJS.Chart("chartContainer", {

title: {

text: "GTU DV LAB-3-G-Chart Using XML Data",

data: [{

type: "column",

dataPoints: dataPoints,

}]

});

chart.render();

});

}

</script>

</head>

<body>

</body>

</html>

Here we have to write 2-files.

Second file is XML file which is shown below.

File Name-2= DV Lab3-g XML file.xml

Program Code:

<?xml version="1.0"?>

<data>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

</data>

Output:

DV Lab -3-F- Develop Following Program Using HTML5 and JavaScript

GTU DV Lab -3- Develop Following Program Using HTML5 and JavaScript

3-F- Read the data XML file and draw Data Table

File Name-1= DV Lab3-f draw Data Table.html

Program Code:

<!DOCTYPE html>

<html>

<head>

<title>Chart using XML Data</title>

window.onload = function() {

var dataPoints = [];

$.get("https://canvasjs.com/services/data/datapoints.php?xstart=5&ystart=10&length=10&type=xml", function(data) {

$(data).find("point").each(function () {

var $dataPoint = $(this);

var x = $dataPoint.find("x").text();

var y = $dataPoint.find("y").text();

dataPoints.push({x: parseFloat(x), y: parseFloat(y)});

});

var chart = new CanvasJS.Chart("chartContainer", {

title: {

text: "GTU DV LAB-3-f-Chart Using XML Data",

data: [{

type: "column",

dataPoints: dataPoints,

}]

});

chart.render();

});

}

</script>

</head>

<body>

</body>

</html>

Here we have to write 2-files.

Second file is XML file which is shown below.

File Name-2= DV Lab3-f XML file.xml

Program Code:

<?xml version="1.0"?>

<data>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

<point>

</point>

</data>

Output:

DV Lab -3-A & C- Develop Following Program Using HTML5 and JavaScript

GTU DV Lab -3- Develop Following Program Using HTML5 and JavaScript

3-A- Develop the simple bar chart usingTML5 CANVAS

File Name= DV Lab3a JavaScript Bar Charts.html

Program Code:

<!DOCTYPE HTML>

<html>

<head>

window.onload = function () {

var chart = new CanvasJS.Chart("chartContainer", {

animationEnabled: true,

title:{

text:"GTU DV Lab-3-a-Fortune 500 Companies by Country"

axisX:{

interval: 1

axisY2:{

interlacedColor: "rgba(1,77,101,.2)",

gridColor: "rgba(1,77,101,.1)",

title: "Number of Companies"

data: [{

type: "bar",

axisYType: "secondary",

color: "#014D65",

dataPoints: [

{ y: 3, label: "Sweden" },

{ y: 7, label: "Taiwan" },

{ y: 5, label: "Russia" },

{ y: 9, label: "Spain" },

{ y: 7, label: "Brazil" },

{ y: 7, label: "India" },

{ y: 9, label: "Italy" },

{ y: 8, label: "Australia" },

{ y: 11, label: "Canada" },

{ y: 15, label: "South Korea" },

{ y: 12, label: "Netherlands" },

{ y: 15, label: "Switzerland" },

{ y: 25, label: "Britain" },

{ y: 28, label: "Germany" },

{ y: 29, label: "France" },

{ y: 52, label: "Japan" },

{ y: 103, label: "China" },

{ y: 134, label: "US" }

]

}]

});

chart.render();

}

</script>

</head>

<body>

</body>

</html>

Output:

3-C- Read the data .txt file and draw Simple Bar Chart

File Name= DV Lab3c JavaScript Bar Charts.html

Program Code:

<!DOCTYPE HTML>

<html>

<head>

window.onload = function () {

var chart = new CanvasJS.Chart("chartContainer", {

title:{

text: "GTU DV LAB-3-c-My First Chart in CanvasJS"

data: [

{

// Change type to "doughnut", "line", "splineArea", etc.

type: "column",

dataPoints: [

{ label: "apple", y: 50 },

{ label: "orange", y: 15 },

{ label: "banana", y: 25 },

{ label: "mango", y: 90 },

{ label: "grape", y: 28 }

]

}

]

});

chart.render();

}

</script>

</head>

<body>

</body>

</html>

Output:

Tuesday, February 8, 2022

PPS (3110003) Assignment of All Chapter

PPS (3110003) Assignment

Programming for Problem Solving(PPS)

Degree Engineering

Branch= ALL ENGINEERING BRANCH OF GTU

Year = 1st Year

Subject Code: 3110003

PPS (3110003) Assignment of All Chapter

Chapter-1: Introduction to Computer and Programming

1. Draw and explain the block diagram of Computer System.

2. What is Software and Hardware? Explain different types of Software.

3. Explain the concept of machine level, assembly level and high-level programming.

4. Recall the definitions of (I) Assembler (II) Compiler (III) Interpreter

5. Define algorithm Explain flowchart with suitable example.

6. Write an algorithm and draw a flowchart to print first N Fibonacci numbers.

Chapter-2: Fundamentals of ‘C’

7. Explain basic structure of C program.

8. List and explain fundamental data types of ‘C’ language.

9. Explain different types of operators used in the C language with their precedence and associativity.

10. Describe different types of constants used in C.

11. What is difference between keywords and identifiers? Explain rules for naming an identifier.

12. What is type conversion and type casting? List and explain type conversion supported by C language with example.

13. Explain formatted input output with example.

14. Write a program to print fibonacci series of given number.

Chapter-3: Control Structures in ‘C’

15. Explain different types of loop statements with flowchart and example

16. Discuss general form of following decision – making statements. (I) BREAK (II) GOTO (III) CONTINUE (IV) SWITCH

17. Write a program to find sum of first N odd numbers. Ex. 1+3+5+7+………..+N.

18. Write a C Program to check whether the given number is prime or not.

19. Write a C Program to find factorial of given number.

20. Write a C Program to check whether the input character is vowel or not vowel.

21. Write a program to print following pattern.

Pattern-1:

0 1

1 0 1

0 1 0 1

Pattern-2:

# #

# # #

# # # #

Pattern-3:

1 2 3 4 5

1 2 3 4

1 2 3

1 2

Chapter-4: Array and String

22. What is array? Discuss declaration and initialization of one-dimensional and two-dimensional arrays with example.

23. What is String? How are they declared and also define the null character? In how many ways can you accept data in a string?

24. Write a program in c for multiplication of the two matrices

25. Write a program to check whether a given string is a palindrome or not.

26. Explain following string manipulation functions. strcmp( ), strlen( ), strcat( ), strstr().

27. Write a program to count total words in text.

28. Write a program to reverse the input string without using string function.

29. Write a program to accept a string and count the number of vowels present in a string.

Chapter-5 to 7: Functions, Recursion, Pointer

30. What is User defined function (UDF)? Explain pass by value and pass by reference in functions with example.

31. Explain different components (elements) of User defined function.

32. Create a function to swap the values of two variables.

33. What is recursion? Explain recursive function with example.

34. What is pointer and pointer to pointer? Write suitable example to demonstrate the concept.

Chapter-8 to 10: Structure, Dynamic memory allocation, File management

35. Explain structure declaration and initialization with proper syntax.

36. Write a difference between Structure and Union.

37. Explain dynamic memory allocation(DMA) and different functions for DMA in detail.

38. What is file and file management? Explain various file management functions used in C

39. Explain command line arguments with suitable example.

Find the study material of given subject.

PPS (3110003) GTU

PPS Assignment of All Chapter

PPS Question Bank GTU

Wednesday, January 19, 2022

DV Lab-2- Develop the Program Using HTML5 SVG TAG

(2) DV Lab-2- Develop the Program Using HTML5 SVG TAG

2-C: Develop the Different basic Graphical Shapes using HTML5 SVG Tag

File Name= DV Lab-2c-1.html

Program Code:

<!DOCTYPE html>

<html>

<head>

<title>HTML5 Canvas example with various methods </title>

window.onload=function() {

var w3rcanvas=document.getElementById("w3rCanvasTag");

var w3rcontext=w3rcanvas.getContext('2d');

w3rcontext.fillStyle='rgb(0,0,255)'; //Sets the color used for filling an area

w3rcontext.fillRect(0,0,400,400); //Fills a rectangle positioned at x and y, with a width and height of w and h.

w3rcontext.fillStyle='rgb(255,0,0)';

w3rcontext.fillRect(50,50,300,300);

w3rcontext.fillStyle='rgb(0,255,0)';

w3rcontext.fillRect(100,100,200,200);

w3rcontext.fillStyle='rgb(100,100,100)';

w3rcontext.fillRect(125,175,150,25);

}

</script>

</head>

<body>

<div>

</div>

</body>

</html>

Output:

2-C: Develop the Different basic Graphical Shapes using HTML5 SVG Tag

File Name= DV Lab-2c-2.html

Program Code:

<!DOCTYPE html>

<html>

<head>

<title>HTML5 Canvas gradient example</title>

window.onload=function() {

var w3rcanvas=document.getElementById("w3rCanvasTag");

var w3rcontext=w3rcanvas.getContext('2d');

var w3rgradient=w3rcontext.createRadialGradient(300,300,0,300,300,300);

w3rgradient.addColorStop("0","magenta");// Adds a color stop to a gradient. A color stop is a position in the gradient where a color change occurs. The offset must be between 0 and 1.

w3rgradient.addColorStop(".25","blue");

w3rgradient.addColorStop(".50","green");

w3rgradient.addColorStop(".75","yellow");

w3rgradient.addColorStop("1.0","red");

w3rcontext.fillStyle=w3rgradient;

w3rcontext.fillRect(0,0,400,400);

}

</script>

</head>

<body>

</body>

</html>

Output:

2-D: Develop the Different Advanced Graphical Shapes using HTML5 SVG

File Name= DV Lab-2D-1.html

Program Code:

<!DOCTYPE html>

<html>

<head>

<title>HTML5 Canvas Demo</title>

<!--[if IE]>

<![endif]-->

window.onload=function() {

var mycontext1=document.getElementById("myCanvasTag1").getContext('2d');

var mycontext2=document.getElementById("myCanvasTag2").getContext('2d');

var mycontext3=document.getElementById("myCanvasTag3").getContext('2d');

var mycontext4=document.getElementById("myCanvasTag4").getContext('2d');

// gradient 1

var mygradient1=mycontext1.createLinearGradient(30,30,90,90);

mygradient1.addColorStop(0,"#FF0000");

mygradient1.addColorStop(1,"#00FF00");

mycontext1.fillStyle=mygradient1;

mycontext1.fillRect(0,0,100,100);

// gradient 2

var mygradient2=mycontext2.createLinearGradient(30,30,90,90);

mygradient2.addColorStop(1,"#FF0000");

mygradient2.addColorStop(0,"#00FF00");

mycontext2.fillStyle=mygradient2;

mycontext2.fillRect(0,0,100,100);

var mygradient3=mycontext3.createLinearGradient(30,30,90,90);

mygradient3.addColorStop(0,"#0000FF");

mygradient3.addColorStop(.5,"#00FFDD");

mycontext3.fillStyle=mygradient3;

mycontext3.fillRect(0,0,100,100);

var mygradient4=mycontext1.createLinearGradient(30,30,90,90);

mygradient4.addColorStop(0,"#DD33CC");

mygradient4.addColorStop(1,"#EEEEEE");

mycontext4.fillStyle=mygradient4;

mycontext4.fillRect(0,0,100,100);

}

</script>

</head>

<body>

</canvas>

</canvas>

<br />

</canvas>

</canvas>

</div>

</body>

</html>

Output:

2-C: Develop the Different basic Graphical Shapes using HTML5 SVG Tag

File Name= DV Lab-2c-3.html

Program Code:

<!DOCTYPE html>

<html>

<body>

<circle cx="50" cy="50" r="40"

stroke="green" stroke-width="4" fill="yellow" />

Sorry, your browser does not support inline SVG.

</svg>

<br>

</svg>

<br>

<rect x="50" y="20" rx="20" ry="20" width="150" height="150"

style="fill:red;stroke:black;stroke-width:5;opacity:0.5" />

</svg>

<br>

<polygon points="100,10 40,198 190,78 10,78 160,198"

style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />

</svg>

<br>

<defs>

</linearGradient>

</defs>

Sorry, your browser does not support inline SVG.

</svg>

<br>

</body>

</html>

Output:

DV Lab-2- Develop the Program Using HTML5 CANVAS TAG

(2) DV Lab-2- Develop the Program Using HTML5 CANVAS and SVG TAG

2-A: Develop the Different basic Graphical Shapes using HTM5 CANVAS

File Name= DV Lab-2a.html

Program Code:

<!DOCTYPE html>

<head>

<title>Canvas Into HTML Pages</title>

<style>

canvas {

border: 3px solid #000;

}

</style>

window.onload = function() {

var canvas = document.getElementById("myCanvas");

var context = canvas.getContext("2d");

// draw stuff here

};

</script>

</head>

<body>

</body>

</html>

Output:

2-B: Develop the Different basic Graphical Shapes using HTM5 CANVAS

File Name= DV Lab-2b.html

Program Code:

<!DOCTYPE html>

<head>

<title>Drawing a Line on the Canvas</title>

<style>

canvas {

border: 1px solid #000;

}

</style>

window.onload = function() {

var canvas = document.getElementById("myCanvas");

var context = canvas.getContext("2d");

context.moveTo(50, 150);

context.lineTo(250, 50);

context.stroke();

};

</script>

</head>

<body>

</body>

</html>

Output:

2-C: Develop the Different Advanced Graphical Shapes using HTM5 CANVAS

File Name= DV Lab-2c.html

Program Code:

<!DOCTYPE html>

<head>

<title>Drawing an Arc on the Canvas</title>

<style>

canvas {

border: 1px solid #000;

}

</style>

window.onload = function() {

var canvas = document.getElementById("myCanvas");

var context = canvas.getContext("2d");

context.arc(150, 150, 80, 1.2 * Math.PI, 1.8 * Math.PI, false);

context.stroke();

};

</script>

</head>

<body>

</body>

</html>

Output:

2-D: Develop the Different Advanced Graphical Shapes using HTM5 CANVAS

File Name= DV Lab-2d.html

Program Code:

<!DOCTYPE html>

<head>

<title>Drawing a Rectangle on the Canvas</title>

<style>

canvas {

border: 1px solid #000;

}

</style>

window.onload = function() {

var canvas = document.getElementById("myCanvas");

var context = canvas.getContext("2d");

context.fillRect(50, 50, 200, 100);

context.stroke();

};

</script>

</head>

<body>

</body>

</html>

Output:

2-E: Develop the Different Advanced Graphical Shapes using HTM5 CANVAS

File Name= DV Lab-2E.html

Program Code:

<!DOCTYPE html>

<head>

<title>Drawing a Circle on the Canvas</title>

<style>

canvas {

border: 1px solid #000;

}

</style>

window.onload = function() {

var canvas = document.getElementById("myCanvas");

var context = canvas.getContext("2d");

context.arc(150, 100, 70, 0, 2 * Math.PI, false);

context.stroke();

};

</script>

</head>

<body>

</body>

</html>

Output: