Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

277 lines (277 sloc) 7.903 kb
{
"metadata": {
"name": "d3jsBarChart"
},
"nbformat": 2,
"worksheets": [
{
"cells": [
{
"cell_type": "code",
"collapsed": true,
"input": [
"front1 = '''",
"",
"<html>",
"\t<head>",
"\t\t<title>Attack Report - Bar Chart</title>",
"\t\t<script type=\"text/javascript\" src=\"d3js/d3.v2.js\"></script>",
"\t\t<style type=\"text/css\">",
"\t\t\t/* No style rules here yet */\t\t",
"\t\t</style>",
"\t</head>",
"\t<body>",
"\t\t<h3>Login attempts for '''",
"\t\t",
"\t\t",
"front2 = '''</h3>",
"\t\t<script type=\"text/javascript\">",
"\t\t\tvar w = 500;",
"\t\t\tvar h = 100;",
"\t\t\tvar barPadding = 1;",
"\t\t\t",
"\t\t\tvar dataset = ",
"\t\t\t'''",
"\t\t\t",
"",
"end1 = '''",
"\t\tvar svg = d3.select(\"body\")",
"\t\t\t\t\t\t.append(\"svg\")",
"\t\t\t\t\t\t.attr(\"width\", w)",
"\t\t\t\t\t\t.attr(\"height\", h);",
"",
"\t\t\tsvg.selectAll(\"rect\")",
"\t\t\t .data(dataset)",
"\t\t\t .enter()",
"\t\t\t .append(\"rect\")",
"\t\t\t .attr(\"x\", function(d, i) {",
"\t\t\t \t\treturn i * (w / dataset.length);",
"\t\t\t })",
"\t\t\t .attr(\"y\", function(d) {",
"\t\t\t \t\treturn h - (d * 4);",
"\t\t\t })",
"\t\t\t .attr(\"width\", w / dataset.length - barPadding)",
"\t\t\t .attr(\"height\", function(d) {",
"\t\t\t \t\treturn d * 4;",
"\t\t\t })",
"\t\t\t .attr(\"fill\", function(d) {",
"\t\t\t\t\treturn \"rgb(0, 0, \" + (d * 10) + \")\";",
"\t\t\t });",
"",
"\t\t\tsvg.selectAll(\"text\")",
"\t\t\t .data(dataset)",
"\t\t\t .enter()",
"\t\t\t .append(\"text\")",
"\t\t\t .text(function(d) {",
"\t\t\t \t\treturn d;",
"\t\t\t })",
"\t\t\t .attr(\"text-anchor\", \"middle\")",
"\t\t\t .attr(\"x\", function(d, i) {",
"\t\t\t \t\treturn i * (w / dataset.length) + (w / dataset.length - barPadding) / 2;",
"\t\t\t })",
"\t\t\t .attr(\"y\", function(d) {",
"\t\t\t \t\treturn h - (d * 4) + 14;",
"\t\t\t })",
"\t\t\t .attr(\"font-family\", \"sans-serif\")",
"\t\t\t .attr(\"font-size\", \"11px\")",
"\t\t\t .attr(\"fill\", \"white\");",
"",
"",
"\t\t\t",
"\t\t</script>",
"\t</body>",
"</html>",
"'''",
"hostname = 'www.example.com'",
"data = str([10,20,30,40,50,40,30,20,10])",
"",
"def populateBarChart(hostname, data):",
"\t'''",
"\tThis function takes 2 parameters - hostname and data and populates into D3.js Bar Chart.",
"\t'''",
"\treturn front1+hostname+front2+data+end1"
],
"language": "python",
"outputs": [],
"prompt_number": 18
},
{
"cell_type": "code",
"collapsed": true,
"input": [
"fh = open('index.html', 'w')",
"fh.write (populateBarChart(hostname,data))",
"fh.close()"
],
"language": "python",
"outputs": [],
"prompt_number": 19
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"from IPython.core.display import HTML",
"HTML('<iframe src=http://localhost:7777/index.html width=1000 height=400>')"
],
"language": "python",
"outputs": [
{
"html": [
"<iframe src=http://localhost:7777/index.html width=1000 height=400>"
],
"output_type": "pyout",
"prompt_number": 29,
"text": [
"&lt;IPython.core.display.HTML at 0xabbc4cc&gt;"
]
}
],
"prompt_number": 29
},
{
"cell_type": "code",
"collapsed": true,
"input": [
"begin1 = '''",
"<!DOCTYPE html>",
"<meta charset=\"utf-8\">",
"<style>",
"",
"rect.bar {",
" fill: steelblue;",
"}",
"",
".axis text {",
" font: 10px sans-serif;",
"}",
"",
".axis path, .axis line {",
" fill: none;",
" stroke: #000;",
" shape-rendering: crispEdges;",
"}",
"",
"</style>",
"<body>",
"<script src=\"d3js/d3.v2.js\"></script>",
"<script>",
"",
"var data = ",
"'''",
"",
"end1 = ''' ",
";",
"",
"var margin = {top: 40, right: 40, bottom: 40, left: 40},",
" width = 960,",
" height = 500;",
"",
"var x = d3.scale.linear()",
" .domain([0, d3.max(data)])",
" .range([0, width - margin.left - margin.right]);",
"",
"var y = d3.scale.ordinal()",
" .domain(d3.range(data.length))",
" .rangeRoundBands([height - margin.top - margin.bottom, 0], .2);",
"",
"var xAxis = d3.svg.axis()",
" .scale(x)",
" .orient(\"bottom\")",
" .tickPadding(8);",
"",
"var yAxis = d3.svg.axis()",
" .scale(y)",
" .orient(\"left\")",
" .tickSize(0)",
" .tickPadding(8);",
"",
"var svg = d3.select(\"body\").append(\"svg\")",
" .attr(\"width\", width)",
" .attr(\"height\", height)",
" .attr(\"class\", \"bar chart\")",
" .append(\"g\")",
" .attr(\"transform\", \"translate(\" + margin.left + \",\" + margin.top + \")\");",
"",
"svg.selectAll(\".bar\")",
" .data(data)",
" .enter().append(\"rect\")",
" .attr(\"class\", \"bar\")",
" .attr(\"y\", function(d, i) { return y(i); })",
" .attr(\"width\", x)",
" .attr(\"height\", y.rangeBand());",
"",
"svg.append(\"g\")",
" .attr(\"class\", \"x axis\")",
" .attr(\"transform\", \"translate(0,\" + y.rangeExtent()[1] + \")\")",
" .call(xAxis);",
"",
"svg.append(\"g\")",
" .attr(\"class\", \"y axis\")",
" .call(yAxis)",
" .selectAll(\"text\")",
" .text(function(d) { return String.fromCharCode(d + 65); });",
"",
"</script>",
"'''",
"",
"hostname = 'www.example.com'",
"data = str([7,10,11,37,53,0,10,20,10])",
"",
"def populateBarChartHorizontal(hostname, data):",
"\t'''",
" Horizontal Bar Chart",
"\tThis function takes 2 parameters - hostname and data and populates into D3.js Bar Chart.",
"\t'''",
"\treturn begin1+data+end1"
],
"language": "python",
"outputs": [],
"prompt_number": 30
},
{
"cell_type": "code",
"collapsed": true,
"input": [
"fh = open('indexHorizontal.html', 'w')",
"fh.write (populateBarChartHorizontal(hostname,data))",
"fh.close()"
],
"language": "python",
"outputs": [],
"prompt_number": 31
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"from IPython.core.display import HTML",
"HTML('<iframe src=http://localhost:7777/indexHorizontal.html width=1000 height=1000>')"
],
"language": "python",
"outputs": [
{
"html": [
"<iframe src=http://localhost:7777/indexHorizontal.html width=1000 height=1000>"
],
"output_type": "pyout",
"prompt_number": 32,
"text": [
"&lt;IPython.core.display.HTML at 0xabca2ec&gt;"
]
}
],
"prompt_number": 32
},
{
"cell_type": "code",
"collapsed": true,
"input": [],
"language": "python",
"outputs": [],
"prompt_number": "&nbsp;"
}
]
}
]
}
Jump to Line
Something went wrong with that request. Please try again.