Skip to content

Instantly share code, notes, and snippets.

@pg1647
Last active June 1, 2020 03:52
Show Gist options
  • Save pg1647/3be7d1cd097e85f2e5175e17be2d7941 to your computer and use it in GitHub Desktop.
Save pg1647/3be7d1cd097e85f2e5175e17be2d7941 to your computer and use it in GitHub Desktop.
Data Vis. Summer 2020 || Lab 1- Task 1-3 // source https://jsbin.com/divekus
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Lab 1</title>
<style id="jsbin-css">
.header {
color: green; /*red*/
}
#courseTitle {
color: black;
font-weight: bold;
font-size: 16px;
font-style: italic;
}
#LabTitle {
color: red;
font-weight: 14px;
}
line {
fill: none;
stroke: Blue;
stroke-width: 10px;
}
rect {
fill: salmon;
stroke:yellow;
stroke-width: 8px;
}
</style>
</head>
<body>
<h2 class="header">Prachi Gupta</h2>
<h3 class="header">pg1647</h3>
<hr>
<p id="courseTitle">Data Visualization</p>
<p id="LabTitle">Lab 1</p>
<hr />
<p>This is my first HTML page.</p>
<svg width="300" height="200">
<rect x="0" h="0" width="220" height="160"></rect>
<g transform="rotate(20)translate(30,-25)">
<line x1="20" y1="20" x2="20" y2="130">
</line>
<line x1="80" y1="20" x2="80" y2="75">
</line>
<line x1="20" y1="20" x2="80" y2="20">
</line>
<line x1="20" y1="75" x2="80" y2="75">
</line>
</g>
<g transform="rotate(8)translate(-2,-8)">
<line x1="130" y1="20" x2="200" y2="20">
</line>
<line x1="130" y1="20" x2="130" y2="130">
</line>
<line x1="130" y1="130" x2="200" y2="130">
</line>
<line x1="200" y1="75" x2="200" y2="130">
</line>
<line x1="160" y1="75" x2="200" y2="75">
</line>
</g>
</svg>
<script id="jsbin-source-css" type="text/css">.header {
color: green; /*red*/
}
#courseTitle {
color: black;
font-weight: bold;
font-size: 16px;
font-style: italic;
}
#LabTitle {
color: red;
font-weight: 14px;
}
line {
fill: none;
stroke: Blue;
stroke-width: 10px;
}
rect {
fill: salmon;
stroke:yellow;
stroke-width: 8px;
}</script>
</body>
</html>
.header {
color: green; /*red*/
}
#courseTitle {
color: black;
font-weight: bold;
font-size: 16px;
font-style: italic;
}
#LabTitle {
color: red;
font-weight: 14px;
}
line {
fill: none;
stroke: Blue;
stroke-width: 10px;
}
rect {
fill: salmon;
stroke:yellow;
stroke-width: 8px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment