Skip to content

Instantly share code, notes, and snippets.

@michaelmalak
Forked from z-m-k/LICENSE
Last active December 19, 2015 23:28
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save michaelmalak/6034757 to your computer and use it in GitHub Desktop.
Save michaelmalak/6034757 to your computer and use it in GitHub Desktop.
Modifications for Mac compatibility. There is a small chance it still works on Windows -- have not tested.
from __future__ import division
import numpy
import shlex
from uuid import uuid1
class d3object:
def __init__(self,
height=100,
width=100,
topHtml='',
bottomHtml='',
style=None,
publish=False,
test=False,
precision=4,
d3=None,
**kw):
self.id='id-{0}'.format(uuid1())
self.html='<div id="{0}" class="d3Output"></div>'.format(self.id)
self.css=''
self.varsToPass={'width':width,
'height':height,
'd3ObjId':self.id,
}
self.precision=precision
self.js=['''
var None=null;
var inf='Inf.';
function utfDecode(x){
try{
var r = /[\\\\]{1,2}u([0-9a-fA-F]{4})/gi;
var xnew = x.replace(r, function (match, grp) {
return String.fromCharCode(parseInt(grp, 16));
});
xnew = unescape(xnew);
return xnew;
}
catch(err){
return x
}
}
''','']
if style in (None, ''):
self.html='{0}\n{1}\n{2}'.format(topHtml, self.html, bottomHtml)
elif style=='JFFigure':
self.html='\n'.join((self.html,
'''<div class="d3Output description figure" style="width: {0}px">
<b>Figure{1}.{2}</b>{3}</div>
'''
.format(width,
' '+str(kw['number']) if 'number' in kw else '',
' '+str(kw['title'])+'.' if 'title' in kw else '',
' '+str(kw['desc']) if 'desc' in kw else '',
),
))
self.addCss(self.getStandardCss('jfCss'))
elif style=='JFTable':
self.html='\n'.join(('<div class="d3Output header" style="width: {0}px;">Table{1}</div>'
.format(width, ' '+str(kw['number']) if 'number' in kw else ''),
'<div class="d3Output title" style="width: {0}px;">{1}</div>'
.format(width, ' '+str(kw['title']) if 'title' in kw else ''),
'<div class="d3Output description" style="width: {0}px">{1}</div>'
.format(width, ' '+str(kw['desc']) if 'desc' in kw else ''),
self.html,
))
self.addCss(self.getStandardCss('jfCss'))
if d3!=None:
if d3.__class__.__name__=='d3object':
if d3.css!='\n'+self.getStandardCss('jfCss'):
self.addCss(d3.css)
d3.addPageBreak()
self.html='\n'.join((d3.render(mode=('only','html')),self.html))
else:
raise TypeError
self.publish=publish
if publish:
from IPython.core.display import publish_html
if test:
from IPython.core.display import publish_javascript
publish_javascript('''$('#d3TestOutput').remove();''')
html=u'''
<div id="d3TestOutput"
style="
position: absolute;
z-index:100;
right:-2px;
top:100px;
background: rgba(255, 255, 255, 1);
display:block
">
{0}
</div>'''.format(self.html)
publish_javascript('''$('#toolbar').append('{0}');'''.format(html.replace('\n','')))
html='</script><style>\n{0}\n</style>'.format(self.css)
else:
html='<style>\n{0}\n</style>\n{1}'.format(self.css, self.html)
publish_html(html)
self.html=''
def removeTestObject(self):
from IPython.core.display import publish_javascript
publish_javascript('''$('#d3TestOutput').remove();''')
def convertVar(self, var):
typeVar=type(var)
if typeVar==numpy.ndarray:
return self.convertVar(var.tolist())
elif typeVar == float:
return round(var, self.precision)
elif typeVar == list:
return [self.convertVar(i) for i in var]
elif typeVar == dict:
outTemp={}
for k in var:
outTemp[k]=self.convertVar(var[k])
return outTemp
elif typeVar in (str, int) or var==None:
return var
else:
print typeVar
raise TypeError
def addVar(self, **kw):
for k in kw:
self.varsToPass[k]=self.convertVar(kw[k])
def getJsInputs(self):
jsInputs=[]
inputs=self.varsToPass
for i in inputs:
outTemp=i+'='
typeOut=type(inputs[i])
if typeOut == str:
outTemp+='"%s"' % inputs[i]
elif typeOut in (list, dict, int, float) or inputs[i]==None:
outTemp+=str(inputs[i])
else:
print typeOut
raise TypeError
jsInputs.append(outTemp)
jsInputs='\n'.join(['var '+i+';' for i in jsInputs]).replace("u'", "'")
self.jsInputs=jsInputs
def addJs(self, jsStr):
if type(jsStr)!=str:
raise TypeError
self.js.append(jsStr)
def addCss(self, css):
if type(css)!=str:
raise TypeError
self.css+='\n{0}'.format(css)
def pValsStar(self, dataAdd, index=0):
if len(dataAdd)==0:
return
for i in xrange(len(dataAdd[index])):
for j in xrange(len(dataAdd[index][0])):
if type(dataAdd[index][i][j])==str: continue
x=dataAdd[index][i][j]
if x<0: dataAdd[index][i][j]='Error'
elif x<=0.01: dataAdd[index][i][j]='&#x2605;&#x2605;&#x2605;'
elif x<=0.05: dataAdd[index][i][j]='&#x2605;&#x2605;'
elif x<=0.1: dataAdd[index][i][j]='&#x2605;'
elif x<=1: dataAdd[index][i][j]=''
else: dataAdd[index][i][j]='Error'
def addTable(self,
data=[],
dataAdd=[],
pVals=False,
fontSizeCells=[12,8],
fontSizeCellsLabels=[16,10],
sRows=None,
sColumns=None,
sRowsMargins=[5],
sColsMargins=[5],
varLabels=['Value', 'p-value'],
fontSizeHeaders=12,
shrinkHeadersBorders=1.5,
heatmapIgnoreText=1,
heatmap={
'draw':1,
'spacing':2,
'fillProportion':5,
'addText':1,
'addTextRows':1,
'addBorders':1,
'addOutsideBorders':-1,
'rectWidth':45,
'rectHeight':45,
},
smallHeatmap={
'draw':1,
'spacing':0,
'fillProportion':4,
'addText':0,
'addTextRows':0,
'addBorders':0,
'addOutsideBorders':-1,
'rectWidth':4,
'rectHeight':4,
},
heatmapLegendVert=0,
legend= {
'draw':1,
'width':100,
'height':15,
'rectWidth':60,
'rectHeight':60
},
rightPaneOffset=100,
colorDomainMin=False,
colorDomainMax=False,
colorDomainSymmetric=False,
colorDomainAuto=1,
colorDomainAutoIgnoreColumns=[],
colorDomainAutoIgnoreRows=[],
colorRange=['#B9FB8A', '#9BF293', '#7EE79D', '#65DCA6', '#51CFAD', '#43C3B1', '#3FB5B3',
'#43A7B2', '#4C99AD', '#568BA6', '#5F7D9C', '#656F8F', '#696181', '#6A5471',
'#684861', '#633D51', '#5B3341', '#522A33', '#472226', '#3B1B1A', '#2E1510']
):
figTag='-tag-{0}'.format(uuid1())
if type(pVals)!=bool:
self.pValsStar(dataAdd, pVals)
if sRows==None:
sRows = ['' for _ in data[0]]
if sColumns==None:
sColumns = ['' for _ in data]
colorDomain=[0,1]
if colorDomainAuto>0:
colorRangeData=data
if len(colorDomainAutoIgnoreColumns)+len(colorDomainAutoIgnoreRows)>0:
colorRangeData=[]
for i in xrange(len(data)):
if i in colorDomainAutoIgnoreRows: continue
for j in xrange(len(data[0])):
if j in colorDomainAutoIgnoreColumns: continue
colorRangeData.append(data[i][j])
if colorDomainAuto==2:
avgRes=numpy.average(colorRangeData)
stdRes=numpy.std(colorRangeData, dtype=numpy.float64, ddof=1)
nObs=len(colorRangeData)
colorDomain=[max(numpy.min(colorRangeData),avgRes-stdRes/nObs*1.96),
min(numpy.max(colorRangeData),avgRes+stdRes/nObs*1.96)]
if colorDomainAuto==1:
colorDomain=[numpy.min(colorRangeData),numpy.max(colorRangeData)]
if colorDomainSymmetric:
colorDomain=max(numpy.fabs(colorDomain))
colorDomain=[-colorDomain, colorDomain]
colorRange=list(reversed(colorRange))+colorRange[1:]
if colorDomainMin:
colorDomain=[colorDomainMin, colorDomain[1]]
if colorDomainMax:
colorDomain=[colorDomain[0], colorDomainMax]
colorRangeLen=len(colorRange)
colorDomain=(numpy.array([i/colorRangeLen for i in xrange(colorRangeLen+1)])*(colorDomain[1]-colorDomain[0])+colorDomain[0]).tolist()
self.addVar( figTag=figTag,
colorDomain=colorDomain,
colorRange=colorRange,
data=data,
dataAdd=dataAdd,
fontSizeCellsLabels=fontSizeCellsLabels,
fontSizeCells=fontSizeCells,
varLabels=varLabels,
sRows=sRows,
sColumns=sColumns,
heatmapLegendVert=heatmapLegendVert,
heatmap=heatmap,
smallHeatmap=smallHeatmap,
legend=legend,
fontSizeHeaders=fontSizeHeaders,
heatmapIgnoreText=heatmapIgnoreText,
sRowsMargins=sRowsMargins,
sColsMargins=sColsMargins,
shrinkHeadersBorders=shrinkHeadersBorders,
rightPaneOffset=rightPaneOffset
)
self.addCss('''
.heatmapCell path, .heatmapCell line, .heatmapCell polyline, .d3Output polyline {
fill: none;
stroke-width: 1px;
stroke: black;
shape-rendering: crispEdges !important;
}
.heatmapCell text, .heatmapCell rect, .d3Output rect {
font-size: 1em;
shape-rendering: crispEdges !important;
}
''')
self.addCss('#'+figTag+'{shape-rendering: crispEdges !important;}')
self.addJs('''
Array.prototype.sum = function() {
return this.reduce(function(a,b){return a+b;});
}
var svg = d3.select("#"+d3ObjId)
.append("svg")
.attr("width", width)
.attr("height", height)
.style("border-bottom", "1px solid black")
var color = d3.scale.linear()
.domain(colorDomain)
.range(colorRange);
//_________________________________________________________________________________
//
//Heatmap drawing function
//_________________________________________________________________________________
function drawHeatmap(data,
x,
y,
spacing,
fillProportion,
addText,
addTextRows,
addBorders,
addOutsideBorders,
rectWidth,
rectHeight,
svg,
objId){
var heatmap=svg.append("svg")
.attr("class", "heatmap")
.attr("y", y)
.attr("x", x)
.attr("id", objId)
var addLength = dataAdd.length;
if(heatmapIgnoreText==1)
var cumulHeight=rectHeight-fontSizeCells.sum()-(addLength+1)*2;
else
var cumulHeight=rectHeight-fillProportion-fontSizeCells.sum()-(addLength+1)*2;
var borderOffset=[0,0];
if(addOutsideBorders>=0&&objId=='smallHeatmap')
borderOffset=[addOutsideBorders+1,addOutsideBorders+1];
for(var i=0; i<data[0].length; i++){
for(var j=0; j<data.length; j++){
if(addLength>0){
if(dataAdd[0][j][i]=='Error'){ continue; }
if(addLength>1){
if(dataAdd[1][j][i]=='Error'){ continue; }
}
}
var g=heatmap.append("g")
.attr("class", "heatmapCell")
.attr("transform", "translate("+ (borderOffset[0]+(i)*(rectWidth+spacing)+addTextRows*(sRowsMargins.sum()+5)) +","+ (borderOffset[1]+(j)*(rectHeight+spacing)+addTextRows*(sColsMargins.sum()+5)) + ")")
g.append("rect")
.attr("y", rectHeight-fillProportion)
.attr("fill", color(data[j][i]))
.attr("id", "heatCell")
.attr("width", rectWidth)
.attr("height", fillProportion)
if(addText||addText==1){
g.append("text")
.attr("x", rectWidth-5)
.attr("y",cumulHeight)
.attr("id", "heatText")
.attr("dy", fontSizeCells[0]+"px")
.style("font-size", fontSizeCells[0]+"px")
.attr("text-anchor", "end")
.text(data[j][i]);
for(var k=0; k<addLength; k++){
g.append("text")
.attr("x", rectWidth-5)
.attr("y", cumulHeight+fontSizeCells.slice(0,k+1).sum()+(k+1)*2)
.attr("dy", fontSizeCells[k+1]+"px")
.attr("id", "heatTextAdd")
.style("font-size", fontSizeCells[k+1]+"px")
.attr("text-anchor", "end")
.text(dataAdd[k][j][i]);
}
}
if(addBorders||addBorders==1){
g.append("polyline")
.attr("points", "0,0 "+rectWidth+",0 "+rectWidth+","+rectHeight+" 0,"+rectHeight+" 0,0")
}
}
}
if(addOutsideBorders>=0){
var box = heatmap.append("rect")
.attr("fill", "none")
.attr("stroke", "#000")
.attr("stroke-widtx", "1px");
if(objId=='heatmap')
box.attr("x", sRowsMargins.sum()+5-addOutsideBorders)
.attr("y", sColsMargins.sum()+5-addOutsideBorders)
.attr("width", data[0].length*(spacing+rectWidth)-spacing+2*addOutsideBorders)
.attr("height", data.length*(spacing+rectHeight)-spacing+2*addOutsideBorders);
else{
box.attr("x", 1)
.attr("y", 1)
.attr("width", data[0].length*(spacing+rectWidth)-spacing+2*addOutsideBorders-1)
.attr("height", data.length*(spacing+rectHeight)-spacing+2*addOutsideBorders-1);
}
}
if(addTextRows||addTextRows==1){
//Columns
for(var k=0; k<sColumns.length; k++){
var z=0;
for(var i=0; i<data[0].length; i++){
if(sColumns[k][i]==null){
z++;
}
else if(sColumns[k][i]==''){
z=0;
}
else{
var g=heatmap.append("g")
.attr("class", "heatmapCell")
.attr("transform", "translate("+ ((i-z)*(rectWidth+spacing)+(sRowsMargins.sum()+5)) +",0)");
g.append("text")
.attr("x", (rectWidth/2)*(z+1)+z*spacing/2)
.attr("y", sColsMargins.sum()-sColsMargins.slice(0,k+1).sum())
.style("font-size", fontSizeHeaders+"px")
.attr("text-anchor", "middle")
.text(sColumns[k][i]);
g.append("polyline")
.attr("points", ""+ (0+shrinkHeadersBorders) +","+ (sColsMargins.sum()-sColsMargins.slice(0,k+1).sum()+5) +" "+ (rectWidth*(z+1)+z*spacing-shrinkHeadersBorders) +","\
+(sColsMargins.sum()-sColsMargins.slice(0,k+1).sum()+5)+"");
z=0;
}
}
}
//Rows
for(var k=0; k<sRows.length; k++){
var z=0;
for(var j=0; j<data.length; j++){
if(sRows[k][j]==null){
z++;
}
else if(sRows[k][j]==''){
z=0;
}
else{
var g=heatmap.append("g")
.attr("class", "heatmapCell")
.attr("transform", "translate(0,"+ ((j-z)*(rectHeight+spacing)+(sColsMargins.sum()+5))+ ")");
g.append("text")
.attr("x", sRowsMargins.sum()-sRowsMargins.slice(0,k+1).sum())
.attr("y", 0.5*(rectHeight*(z+1)+(z)*spacing+fontSizeHeaders))
.style("font-size", fontSizeHeaders+"px")
.attr("text-anchor", "end")
.text(sRows[k][j]);
g.append("polyline")
.attr("points", ""+ (sRowsMargins.sum()-sRowsMargins.slice(0,k+1).sum()+5) +","+ (0+shrinkHeadersBorders) + " "\
+ (sRowsMargins.sum()-sRowsMargins.slice(0,k+1).sum()+5) +","+ ((z+1)*rectHeight+z*spacing-shrinkHeadersBorders) +"");
z=0;
}
}
}
}
}
//_________________________________________________________________________________
//
//Legend for a heatmap
//_________________________________________________________________________________
function drawLegend(legendSize, x, y, tickValues, colorDomain, color, svg){
var legendcolorRangecale=d3.scale.linear()
.domain([0,legendSize[0]])
.range([colorDomain[0], colorDomain[colorDomain.length-1]]),
legendObj=svg.append("svg")
//.attr("width", legendSize[0]+legendSize[2])
//.attr("height", legendSize[1]+12)
.attr("y", y)
.attr("x", x)
for(var i=0; i<=legendSize[0]; i=i+legendSize[2]){
legendObj.append("rect")
.attr("x", i-1)
.attr("fill", color(legendcolorRangecale(i)))
.attr("width", legendSize[2])
.attr("height", legendSize[1])
.attr("transform", "translate(5,0)")
}
var legendScale = d3.scale.linear()
.domain([colorDomain[0], colorDomain[colorDomain.length-1]])
.range([0,legendSize[0]]);
var legendXAxis = d3.svg.axis()
.scale(legendScale)
.orient("bottom")
.tickSize(0,0,0)
.tickValues(tickValues)
legendObj.append("g")
.attr('class', 'axis')
.attr("transform", "translate(5," + legendSize[1] + ")")
.call(legendXAxis);
}
function drawLegendVert(legendSize, x, y, tickValues, colorDomain, color, svg){
var legendcolorRangecale=d3.scale.linear()
.domain([0,legendSize[0]])
.range([colorDomain[0], colorDomain[colorDomain.length-1]]),
legendObj=svg.append("svg")
//.attr("width", legendSize[0]+legendSize[2])
//.attr("height", legendSize[1]+12)
.attr("y", y)
.attr("x", x)
.attr("id", "vertLegend")
if(heatmapLegendVert==1)
legendObj.style("opacity", 0.01)
for(var i=0; i<=legendSize[0]; i=i+legendSize[2]){
legendObj.append("rect")
.attr("y", i-1)
.attr("fill", color(legendcolorRangecale(i)))
.attr("width", legendSize[1])
.attr("height", legendSize[2])
.attr("transform", "translate(5,0)")
}
var legendScale = d3.scale.linear()
.domain([colorDomain[0], colorDomain[colorDomain.length-1]])
.range([5,legendSize[0]-5]);
var legendXAxis = d3.svg.axis()
.scale(legendScale)
.orient("right")
.tickSize(0,0,0)
.ticks(5)
legendObj.append("g")
.attr('class', 'axis')
.attr("transform", "translate("+(legendSize[1]*1.5)+"," + (0*legendSize[1]) + ")")
.call(legendXAxis);
}
function drawLegendBox(x, y, rectWidth, rectHeight, svg){
var legendObj=svg.append("svg")
//.attr("width", legendSize[0]+legendSize[2])
//.attr("height", legendSize[1]+12)
.attr("y", y-rectHeight)
.attr("x", x)
var addLength = dataAdd.length;
var cumulHeight=fontSizeCellsLabels.sum()+addLength*2;
var g=legendObj.append("g")
.attr("class", "heatmapCell")
g.append("rect")
.attr("x", 1)
.attr("y", rectHeight-heatmap.fillProportion/heatmap.rectHeight*rectHeight)
.attr("fill", colorRange[0])
.attr("width", rectWidth-1)
.attr("height", heatmap.fillProportion/heatmap.rectHeight*rectHeight)
g.append("text")
.attr("x", rectWidth-5)
.attr("y", rectHeight-cumulHeight-5-heatmap.fillProportion)
.attr("dy", fontSizeCellsLabels[0]+"px")
.style("font-size", fontSizeCellsLabels[0]+"px")
.attr("text-anchor", "end")
.text(varLabels[0]);
for(var k=0; k<addLength; k++){
g.append("text")
.attr("x", rectWidth-5)
.attr("y", rectHeight-5-heatmap.fillProportion-cumulHeight+fontSizeCellsLabels.slice(0,k+1).sum()+(k+1)*2)
.attr("dy", fontSizeCellsLabels[k+1]+"px")
.style("font-size", fontSizeCellsLabels[k+1]+"px")
.attr("text-anchor", "end")
.text(varLabels[k+1]);
}
g.append("polyline")
.attr("points", "1,1 "+ (rectWidth-1) +",1 "+ (rectWidth-1) +","+rectHeight+" 1,"+rectHeight+" 1,1")
}
var regressionResults=svg.append("g").attr('id', 'svgElement'+d3ObjId+figTag)
if(heatmap.draw==1){
drawHeatmap(data/*data*/,
0/*x*/,
0/*y*/,
heatmap.spacing/*spacing*/,
heatmap.fillProportion/*fillProportion*/,
heatmap.addText/*addText*/,
heatmap.addTextRows/*addTextRows*/,
heatmap.addBorders/*addBorders*/,
heatmap.addOutsideBorders/*addOutsideBorders*/,
heatmap.rectWidth/*rectWidth*/,
heatmap.rectHeight/*rectHeight*/,
regressionResults,/*svg parent*/
'heatmap'/*id*/)
}
var legendX=Math.round(sRowsMargins.slice(0,sRowsMargins.length-1).sum()/2+data[0].length*(heatmap.rectWidth+heatmap.spacing)+5+rightPaneOffset);
if(smallHeatmap.draw==1){
drawHeatmap(data/*data*/,
legendX/*x*/,
Math.round(heatmap.addTextRows*(sColsMargins.sum()))/*y*/,
smallHeatmap.spacing/*spacing*/,
smallHeatmap.fillProportion/*fillProportion*/,
smallHeatmap.addText/*addText*/,
smallHeatmap.addTextRows/*addTextRows*/,
smallHeatmap.addBorders/*addBorders*/,
smallHeatmap.addOutsideBorders/*addOutsideBorders*/,
smallHeatmap.rectWidth/*rectWidth*/,
smallHeatmap.rectHeight/*rectHeight*/,
regressionResults,/*svg parent*/
'smallHeatmap'/*id*/)
}
if(legend.draw==1){
if(smallHeatmap.draw==1){
drawLegend( [data[0].length*(smallHeatmap.rectWidth+smallHeatmap.spacing)-smallHeatmap.spacing-smallHeatmap.rectWidth,legend.height,1] /*legendSize*/,
Math.round(smallHeatmap.rectWidth/2+legendX-5+ Math.max(0,smallHeatmap.addOutsideBorders ))/*x*/,
Math.round((data.length)*(smallHeatmap.rectHeight+smallHeatmap.spacing)+sColsMargins.sum()+legend.height+5+2*Math.max(0,smallHeatmap.addOutsideBorders))/*y*/,
[colorDomain[1], colorDomain[colorDomain.length-2]]/*tickValues*/,
colorDomain/*colorDomain*/,
color/*color*/,
regressionResults/*svg*/);
}
drawLegendBox(legendX,
Math.round((data.length)*(heatmap.rectHeight+heatmap.spacing)+heatmap.spacing+1+sColsMargins.sum()),
Math.max(legend.rectWidth, data[0].length*(smallHeatmap.rectWidth+smallHeatmap.spacing)-smallHeatmap.spacing+Math.max(0,2*smallHeatmap.addOutsideBorders)),
legend.rectHeight,
regressionResults)
}
if(heatmapLegendVert==1||heatmapLegendVert==2)
drawLegendVert( [data.length*(heatmap.rectHeight+heatmap.spacing),legend.height,1] /*legendSize*/,
sRowsMargins.slice(0,sRowsMargins.length ).sum()+data[0].length*(heatmap.rectWidth+heatmap.spacing)+25/*x*/,
sColsMargins.sum()+5/*y*/,
[colorDomain[1], colorDomain[colorDomain.length-2]]/*tickValues*/,
colorDomain/*colorDomain*/,
color/*color*/,
regressionResults/*svg*/);
var objWidth=document.getElementById('svgElement'+d3ObjId+figTag).getBoundingClientRect()['width']
var objHeight=document.getElementById('svgElement'+d3ObjId+figTag).getBoundingClientRect()['height']
regressionResults.attr("transform", "translate("+ ((width-objWidth)/2) +","+ ((height-objHeight)/2) + ")")
''')
def getPhantomJsScript(self, mode):
if 'html' in mode:
phantomJs='''
var page = require('webpage').create(),
system = require('system'),
address, elementHtml;
address = system.args[1];
page.viewportSize = { width: 600, height: 600 };
page.open(address, function (status) {
if (status !== 'success') {
console.log('Unable to load the address!');
} else {
window.setTimeout(function () {
elementHtml=page.evaluate(function() {
document.body.bgColor = 'white';
return document.getElementById("d3OutputOutterContainer").innerHTML;
});
console.log(elementHtml);
phantom.exit(1);
}, 200);
}
});
'''
elif 'png' in mode:
phantomJs='''
var page = require('webpage').create(),
system = require('system'),
address, elementHtml;
address = system.args[1];
page.viewportSize = { width: 600, height: 600 };
page.open(address, function (status) {
if (status !== 'success') {
console.log('Unable to load the address!');
} else {
window.setTimeout(function () {
console.log(page.renderBase64('PNG'));
phantom.exit(1);
}, 1000);
}
});
'''
return phantomJs
def render(self, mode=['html'], fileName=None):
if type(mode) not in (list, tuple):
mode=(mode,)
self.getJsInputs()
html=['<style>',
self.css,
'</style>',
'</head>',
'<body>',
'<div id="d3OutputOutterContainer">',
self.html,
'</div>',
'<script>',
self.js[0],
self.jsInputs,] + self.js[1:] + ['</script>'
]
if self.publish:
html='\n'.join(html)
from IPython.core.display import publish_html
publish_html(html)
return True
import tempfile
from os import unlink
import subprocess
from time import sleep
html=['<html>',
'<head>',
'<title></title>',
'<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>',
'<script src="http://d3js.org/d3.v3.min.js"></script>',] +\
html +\
['</body>',
'</html>',]
html='\n'.join(html)
tempJs=tempfile.NamedTemporaryFile(mode="w+b", delete=False, suffix='.js')
tempJs.write(self.getPhantomJsScript(mode))
tempJs.flush()
tempJs.close()
temp=tempfile.NamedTemporaryFile(mode="w+b", delete=False, suffix='.htm')
temp.write(html)
temp.flush()
temp.close()
phantomJs=r'''phantomjs {0} {1}'''.format(tempJs.name, temp.name)
phantomJsProc = subprocess.Popen( shlex.split(phantomJs), stdout = subprocess.PIPE, stderr = subprocess.PIPE)
html = ''
err = ''
while phantomJsProc.poll() is None:
sleep( 0.1 )
html, err = phantomJsProc.communicate()
unlink(temp.name)
unlink(tempJs.name)
if 'html' in mode:
if 'only' in mode:
return html
html=html.replace("&amp;", "&")
if 'file'in mode and fileName!=None:
html=['<html>',
'<head>',
'</head>',
'<style>',
self.css,
'</style>',
html,
'</body>',
'</html>',]
fileOpen=open(fileName,'wb')
fileOpen.write('\n'.join(html))
fileOpen.close()
return True
html='\n'.join(['<style>',self.css,'</style>'])+html
if 'show'in mode:
from IPython.core.display import publish_html
publish_html(html)
return True
return html
elif 'png' in mode:
if 'only' in mode:
return html
if 'file'in mode and fileName!=None:
fileOpen=open(fileName,'wb')
fileOpen.write(html)
fileOpen.close()
return True
if 'show'in mode:
from IPython.core.display import publish_png
publish_png(html)
return True
return html
def addSimpleTable(self,
data,
dataAdd=[],
pVals=False,
fontSizeCells=[],
sRows=[],
sColumns=[],
sRowsMargins=[5,100],
sColsMargins=[5,20],
fontSizeHeaders=9,
shrinkHeadersBorders=1.5,
spacing=0,
addBorders=1,
addOutsideBorders=-1,
rectWidth=45,
rectHeight=0,
):
if len(fontSizeCells)==0:
fontSizeCells=[12]*(1+len(dataAdd))
self.addTable(data=data,
dataAdd=dataAdd,
pVals=pVals,
fontSizeCells=fontSizeCells+[5],
fontSizeCellsLabels=fontSizeCells+[5],
sRows=sRows,
sColumns=sColumns,
sRowsMargins=sRowsMargins,
sColsMargins=sColsMargins,
varLabels=[],
fontSizeHeaders=fontSizeHeaders,
shrinkHeadersBorders=shrinkHeadersBorders,
heatmapIgnoreText=1,
heatmap={
'draw':1,
'spacing':spacing,
'fillProportion':0,
'addText':1,
'addTextRows':1,
'addBorders':addBorders,
'addOutsideBorders':addOutsideBorders,
'rectWidth':rectWidth,
'rectHeight':rectHeight if rectHeight>0 else sum(fontSizeCells)+10+2*len(dataAdd),
},
smallHeatmap={
'draw':0,
},
legend= {
'draw':0,
},
rightPaneOffset=0
)
def addPageBreak(self):
self.addJs('''$("#"+d3ObjId).append('<div style="page-break-after:always; display:block; width:1px; height:1px;">&nbsp;</div>')''')
def getStandardCss(self, mode='jfCss'):
if mode=='jfCss':
return'''
html{
font-family: sans-serif;
}
.d3Output{
min-height: 1.2em;
line-height: 1.2em;
position: relative;
font-size: 1em;
padding: 5px 0;
list-style: none;
background: #fff;
color: #000;
}
svg{
color-rendering: optimizeQuality !important;
shape-rendering: geometricPrecision !important;
text-rendering: geometricPrecision !important;
}
.d3Output.header{
text-align: center;
font-weight: bold;
border-bottom: none;
font-size: 0.9em;
}
.d3Output.title{
text-align: center;
font-weight: bold;
border-bottom: none;
font-size: 1.2em;
}
.d3Output.description{
font-size: 0.8em;
text-align:justify;
text-justify:inter-word;
border-bottom: 1px solid #000;
}
.d3Output.description.panel{
text-align: center;
}
svg, canvas {
border-bottom: 1px solid #000;
display: block;
margin: 5px 0;
}
.d3Output.description.figure{
border-bottom: none;
}
'''
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Display the source blob
Display the rendered blob
Raw
{
"metadata": {
"name": "ipyD3sample"
},
"nbformat": 3,
"nbformat_minor": 0,
"worksheets": [
{
"cells": [
{
"cell_type": "code",
"collapsed": false,
"input": [
"%cd \"c:\\Projects\\HFI\\Python\""
],
"language": "python",
"metadata": {},
"outputs": [
{
"output_type": "stream",
"stream": "stdout",
"text": [
"c:\\Projects\\HFI\\Python\n"
]
}
],
"prompt_number": 1
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"While Matplotlib is powerful, it requires a steep learning curve. Moreover, I found it often requires more lines of code for the type of visualisations I wish to produce than various *.js libriaries. Ever since I found out about IPython Notebook and d3js I wanted to combine the two and replace Matplotlib in my workflow. IPython offers a great interactive way of using Python. D3js coupled with developer tools in Chrome/Firefox does the same to graphics.\n",
"\n",
"There are a few obstacles.\n",
"\n",
"##Obstacle 1: Javascript in a function is confusing"
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"def x():\n",
" from IPython.core.display import Javascript\n",
" Javascript('alert(\"a\")')\n",
"x()"
],
"language": "python",
"metadata": {},
"outputs": [],
"prompt_number": 2
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"This will not produce a warning if executed."
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"def x():\n",
" from IPython.core.display import publish_javascript\n",
" publish_javascript('alert(\"a\")')\n",
"x()"
],
"language": "python",
"metadata": {},
"outputs": [
{
"javascript": [
"alert(\"a\")"
],
"output_type": "display_data"
}
],
"prompt_number": 3
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"While this will...\n",
"\n",
"##Obstacle 2: Neither will execute after page refresh"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"Which initially forced me to output scripts in html.\n",
"\n",
"Of course, just like Javascript(), HTML() does not work from withing a function as well."
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"def x():\n",
" from IPython.core.display import HTML\n",
" HTML('<script>alert(\"a\")</script>')\n",
"#x()"
],
"language": "python",
"metadata": {},
"outputs": [],
"prompt_number": 4
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"You need to use publish_html if you want to get anywhere. It has the added benefit of executing on page refresh."
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"def x():\n",
" from IPython.core.display import publish_html\n",
" publish_html('<script>alert(\"a\")</script>')\n",
"#x()"
],
"language": "python",
"metadata": {},
"outputs": [],
"prompt_number": 5
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"##Obstacle 3: Javascript executes too soon\n",
"While publish_html works, I found that it would execute before d3js could be loaded, resulting only in errors in the console.\n",
"\n",
"##Obstacle 4: Some Javascript breaks the Notebook\n",
"Moreover, I found that every now and again, some long Javascript instructions would result in IPython Notebook not being able to display notebooks in whole. While the data was not destroyed, the page would stop displaying at a cell with the faulty script. Since you cannot save a selective cell, this forced me to manually edit notebooks all too often.\n",
"\n",
"##Result\n",
"As a result I resorted to creating the d3 scripts from within (I)Python but rendering them later on with PhantomJs. Becasue of that one can easily switch between producing interactive SVG visualisations by just copying the resulting HTML code from the rendered script file, or saving a static version in PNG, PDF, etc.\n",
"\n",
"The main ingredients are coded as a [class in Python](http://gist.github.com/4484816)"
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"from ipyD3 import *"
],
"language": "python",
"metadata": {},
"outputs": [],
"prompt_number": 6
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"The first thing is to start a d3 object instance."
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"d3 = d3object()"
],
"language": "python",
"metadata": {},
"outputs": [],
"prompt_number": 7
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"All arguments are kwargs, and you can set:\n",
"\n",
"* _height_ of your object\n",
"* _width_ of your object\n",
"* html that will preceed yout object (_topHtml_)\n",
"* html that will follow yout object (_bottomHtml_)\n",
"* a predefined _style_ that includes _topHtml_, _botttomHtml_, and css\n",
"* weather to execute the scripts in your notebook (_publish_)\n",
"* weather to append the resulting object to to toolbar so that it is always visible (_test_, requires _publish=1_)\n",
"* how precise should be the data on conversion to Javascript variables (_precision_)\n",
"* previous _d3_ objects if you wish to create a multi-page report\n",
"\n",
"\n",
"##Tables\n",
"I often use this class to produce tables."
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"d3 = d3object(width=800,\n",
" height=400,\n",
" style='JFTable',\n",
" number=1,\n",
" d3=None,\n",
" title='Example table with d3js',\n",
" desc='An example table created created with d3js with data generated with Python.')\n",
"data=[[1277.0, 654.0, 288.0, 1976.0, 3281.0, 3089.0, 10336.0, 4650.0, 4441.0, 4670.0, 944.0, 110.0],\n",
"[1318.0, 664.0, 418.0, 1952.0, 3581.0, 4574.0, 11457.0, 6139.0, 7078.0, 6561.0, 2354.0, 710.0],\n",
"[1783.0, 774.0, 564.0, 1470.0, 3571.0, 3103.0, 9392.0, 5532.0, 5661.0, 4991.0, 2032.0, 680.0],\n",
"[1301.0, 604.0, 286.0, 2152.0, 3282.0, 3369.0, 10490.0, 5406.0, 4727.0, 3428.0, 1559.0, 620.0],\n",
"[1537.0, 1714.0, 724.0, 4824.0, 5551.0, 8096.0, 16589.0, 13650.0, 9552.0, 13709.0, 2460.0, 720.0],\n",
"[5691.0, 2995.0, 1680.0, 11741.0, 16232.0, 14731.0, 43522.0, 32794.0, 26634.0, 31400.0, 7350.0, 3010.0],\n",
"[1650.0, 2096.0, 60.0, 50.0, 1180.0, 5602.0, 15728.0, 6874.0, 5115.0, 3510.0, 1390.0, 170.0],\n",
"[72.0, 60.0, 60.0, 10.0, 120.0, 172.0, 1092.0, 675.0, 408.0, 360.0, 156.0, 100.0]]\n",
"data=[list(i) for i in zip(*data)]\n",
"sRows=[['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'Deecember']]\n",
"sColumns=[['Prod {0}'.format(i) for i in xrange(1,9)],\n",
" [None, '', None, None, 'Group 1', None, None, 'Group 2']]\n",
"d3.addSimpleTable( data, \n",
" fontSizeCells=[12,],\n",
" sRows=sRows,\n",
" sColumns=sColumns,\n",
" sRowsMargins=[5,50,0],\n",
" sColsMargins=[5,20,10],\n",
" spacing=2,\n",
" addBorders=1,\n",
" addOutsideBorders=-1,\n",
" rectWidth=45,\n",
" rectHeight=0 \n",
" )\n",
"d3.render(mode=['html', 'show'])"
],
"language": "python",
"metadata": {},
"outputs": [
{
"html": [
"<style>\n",
"\n",
"\n",
" .d3Output{\n",
" min-height: 1.2em;\n",
" line-height: 1.2em;\n",
" position: relative;\n",
" font-size: 1em;\n",
" padding: 5px 0;\n",
" \n",
" list-style: none;\n",
" background: #fff;\n",
" color: #000;\n",
" }\n",
" svg{\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: geometricPrecision !important;\n",
" text-rendering: geometricPrecision !important;\n",
" }\n",
" .d3Output.header{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 0.9em;\n",
" \n",
" }\n",
" .d3Output.title{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 1.2em;\n",
" \n",
" }\n",
" .d3Output.description{\n",
" font-size: 0.8em;\n",
" text-align:justify;\n",
" text-justify:inter-word;\n",
" border-bottom: 1px solid #000;\n",
" }\n",
" .d3Output.description.panel{\n",
" text-align: center;\n",
" }\n",
" svg, canvas {\n",
" border-bottom: 1px solid #000;\n",
" display: block;\n",
" margin: 5px 0;\n",
" }\n",
" .d3Output.description.figure{\n",
" border-bottom: none;\n",
" }\n",
" \n",
"\n",
" .heatmapCell path, .heatmapCell line, .heatmapCell polyline, .d3Output polyline {\n",
" fill: none;\n",
" stroke-width: 1px;\n",
" stroke: black;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" .heatmapCell text, .heatmapCell rect, .d3Output rect {\n",
" font-size: 1em;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" \n",
"#-tag-60a90190-59a9-11e2-bed8-00268315e762{shape-rendering: crispEdges !important;}\n",
"</style>\r\n",
"<div class=\"d3Output header\" style=\"width: 800px;\">Table 1</div>\r\n",
"<div class=\"d3Output title\" style=\"width: 800px;\"> Example table with d3js</div>\r\n",
"<div class=\"d3Output description\" style=\"width: 800px\"> An example table created created with d3js with data generated with Python.</div>\r\n",
"<div id=\"id-60a9018f-59a9-11e2-a85c-00268315e762\" class=\"d3Output\"><svg width=\"800\" height=\"400\" style=\"border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: black; \"><g id=\"svgElementid-60a9018f-59a9-11e2-a85c-00268315e762-tag-60a90190-59a9-11e2-bed8-00268315e762\" transform=\"translate(187.5,37)\"><svg class=\"heatmap\" y=\"0\" x=\"0\" id=\"heatmap\"><g class=\"heatmapCell\" transform=\"translate(60,40)\"><rect y=\"22\" fill=\"#a7f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1277</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,64)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">654</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,88)\"><rect y=\"22\" fill=\"#b5fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">288</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,112)\"><rect y=\"22\" fill=\"#9df293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1976</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,136)\"><rect y=\"22\" fill=\"#8aec99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3281</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,160)\"><rect y=\"22\" fill=\"#8ded98\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3089</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,184)\"><rect y=\"22\" fill=\"#43c3b1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10336</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,208)\"><rect y=\"22\" fill=\"#78e49f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4650</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,232)\"><rect y=\"22\" fill=\"#7be59e\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4441</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,256)\"><rect y=\"22\" fill=\"#78e49f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4670</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,280)\"><rect y=\"22\" fill=\"#abf78e\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">944</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,304)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">110</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,40)\"><rect y=\"22\" fill=\"#a6f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1318</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,64)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">664</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,88)\"><rect y=\"22\" fill=\"#b3f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">418</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,112)\"><rect y=\"22\" fill=\"#9df392\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1952</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,136)\"><rect y=\"22\" fill=\"#86ea9a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3581</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,160)\"><rect y=\"22\" fill=\"#79e59f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4574</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,184)\"><rect y=\"22\" fill=\"#41bcb2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">11457</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,208)\"><rect y=\"22\" fill=\"#66dca6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">6139</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,232)\"><rect y=\"22\" fill=\"#5dd7a9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">7078</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,256)\"><rect y=\"22\" fill=\"#62daa7\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">6561</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,280)\"><rect y=\"22\" fill=\"#97f194\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2354</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,304)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">710</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,40)\"><rect y=\"22\" fill=\"#9ff392\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1783</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,64)\"><rect y=\"22\" fill=\"#aef88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">774</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,88)\"><rect y=\"22\" fill=\"#b1f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">564</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,112)\"><rect y=\"22\" fill=\"#a4f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1470</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,136)\"><rect y=\"22\" fill=\"#86ea9a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3571</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,160)\"><rect y=\"22\" fill=\"#8ded98\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3103</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,184)\"><rect y=\"22\" fill=\"#4ac9af\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">9392</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,208)\"><rect y=\"22\" fill=\"#6de0a3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5532</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,232)\"><rect y=\"22\" fill=\"#6cdfa4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5661</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,256)\"><rect y=\"22\" fill=\"#74e3a1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4991</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,280)\"><rect y=\"22\" fill=\"#9cf293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2032</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,304)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">680</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,40)\"><rect y=\"22\" fill=\"#a6f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1301</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,64)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">604</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,88)\"><rect y=\"22\" fill=\"#b5fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">286</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,112)\"><rect y=\"22\" fill=\"#9af293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2152</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,136)\"><rect y=\"22\" fill=\"#8aec99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3282</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,160)\"><rect y=\"22\" fill=\"#89eb99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3369</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,184)\"><rect y=\"22\" fill=\"#43c2b1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10490</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,208)\"><rect y=\"22\" fill=\"#6fe0a2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5406</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,232)\"><rect y=\"22\" fill=\"#77e49f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4727</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,256)\"><rect y=\"22\" fill=\"#88eb99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3428</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,280)\"><rect y=\"22\" fill=\"#a3f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1559</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,304)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">620</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,40)\"><rect y=\"22\" fill=\"#a3f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1537</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,64)\"><rect y=\"22\" fill=\"#a0f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1714</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,88)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">724</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,112)\"><rect y=\"22\" fill=\"#76e3a0\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4824</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,136)\"><rect y=\"22\" fill=\"#6de0a3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5551</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,160)\"><rect y=\"22\" fill=\"#53d0ac\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">8096</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,184)\"><rect y=\"22\" fill=\"#4c99ad\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">16589</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,208)\"><rect y=\"22\" fill=\"#41adb2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">13650</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,232)\"><rect y=\"22\" fill=\"#49c8af\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">9552</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,256)\"><rect y=\"22\" fill=\"#41acb2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">13709</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,280)\"><rect y=\"22\" fill=\"#96f095\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2460</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,304)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">720</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,40)\"><rect y=\"22\" fill=\"#6bdfa4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5691</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,64)\"><rect y=\"22\" fill=\"#8eed97\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2995</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,88)\"><rect y=\"22\" fill=\"#a1f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1680</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,112)\"><rect y=\"22\" fill=\"#40bab2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">11741</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,136)\"><rect y=\"22\" fill=\"#4a9bae\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">16232</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,160)\"><rect y=\"22\" fill=\"#44a6b1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">14731</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,184)\"><rect y=\"22\" fill=\"#210f06\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">43522</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,208)\"><rect y=\"22\" fill=\"#5c3544\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">32794</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,232)\"><rect y=\"22\" fill=\"#6a5673\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">26634</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,256)\"><rect y=\"22\" fill=\"#623c4f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">31400</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,280)\"><rect y=\"22\" fill=\"#5ad5aa\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">7350</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,304)\"><rect y=\"22\" fill=\"#8eed97\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3010</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,40)\"><rect y=\"22\" fill=\"#a1f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1650</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,64)\"><rect y=\"22\" fill=\"#9bf293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2096</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,88)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,112)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">50</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,136)\"><rect y=\"22\" fill=\"#a8f68f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1180</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,160)\"><rect y=\"22\" fill=\"#6ddfa3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5602</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,184)\"><rect y=\"22\" fill=\"#489faf\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">15728</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,208)\"><rect y=\"22\" fill=\"#5fd8a8\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">6874</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,232)\"><rect y=\"22\" fill=\"#72e2a1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5115</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,256)\"><rect y=\"22\" fill=\"#87ea9a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3510</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,280)\"><rect y=\"22\" fill=\"#a5f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1390</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,304)\"><rect y=\"22\" fill=\"#b7fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">170</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,40)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">72</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,64)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,88)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,112)\"><rect y=\"22\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,136)\"><rect y=\"22\" fill=\"#b7fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">120</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,160)\"><rect y=\"22\" fill=\"#b7fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">172</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,184)\"><rect y=\"22\" fill=\"#a9f68f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1092</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,208)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">675</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,232)\"><rect y=\"22\" fill=\"#b3f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">408</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,256)\"><rect y=\"22\" fill=\"#b4f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">360</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,280)\"><rect y=\"22\" fill=\"#b7fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">156</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,304)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">100</text><polyline points=\"0,0 45,0 45,22 0,22 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 1</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 2</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 3</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 4</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 5</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 6</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 7</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 8</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 9px; \" text-anchor=\"middle\">Group 1</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 9px; \" text-anchor=\"middle\">Group 2</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,40)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">January</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,64)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">February</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,88)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">March</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,112)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">April</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,136)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">May</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,160)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">June</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,184)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">July</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,208)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">August</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,232)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">September</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,256)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">October</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,280)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">November</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,304)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">Deecember</text><polyline points=\"55,1.5 55,20.5\"></polyline></g></svg></g></svg></div>\r\n",
"\r\n"
],
"output_type": "display_data"
},
{
"output_type": "pyout",
"prompt_number": 8,
"text": [
"True"
]
}
],
"prompt_number": 8
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"For a slightly cleaner look you can remove the borders..."
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"d3 = d3object(width=800,\n",
" height=400,\n",
" style='JFTable',\n",
" number=1,\n",
" d3=None,\n",
" title='Example table with d3js',\n",
" desc='An example table created created with d3js with data generated with Python.')\n",
"d3.addSimpleTable( data, \n",
" fontSizeCells=[12,],\n",
" sRows=sRows,\n",
" sColumns=sColumns,\n",
" sRowsMargins=[5,50,0],\n",
" sColsMargins=[5,20,10],\n",
" spacing=2,\n",
" addBorders=0,\n",
" addOutsideBorders=-1,\n",
" rectWidth=45,\n",
" rectHeight=0 \n",
" )\n",
"d3.render(mode=['html', 'show'])"
],
"language": "python",
"metadata": {},
"outputs": [
{
"html": [
"<style>\n",
"\n",
"\n",
" .d3Output{\n",
" min-height: 1.2em;\n",
" line-height: 1.2em;\n",
" position: relative;\n",
" font-size: 1em;\n",
" padding: 5px 0;\n",
" \n",
" list-style: none;\n",
" background: #fff;\n",
" color: #000;\n",
" }\n",
" svg{\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: geometricPrecision !important;\n",
" text-rendering: geometricPrecision !important;\n",
" }\n",
" .d3Output.header{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 0.9em;\n",
" \n",
" }\n",
" .d3Output.title{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 1.2em;\n",
" \n",
" }\n",
" .d3Output.description{\n",
" font-size: 0.8em;\n",
" text-align:justify;\n",
" text-justify:inter-word;\n",
" border-bottom: 1px solid #000;\n",
" }\n",
" .d3Output.description.panel{\n",
" text-align: center;\n",
" }\n",
" svg, canvas {\n",
" border-bottom: 1px solid #000;\n",
" display: block;\n",
" margin: 5px 0;\n",
" }\n",
" .d3Output.description.figure{\n",
" border-bottom: none;\n",
" }\n",
" \n",
"\n",
" .heatmapCell path, .heatmapCell line, .heatmapCell polyline, .d3Output polyline {\n",
" fill: none;\n",
" stroke-width: 1px;\n",
" stroke: black;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" .heatmapCell text, .heatmapCell rect, .d3Output rect {\n",
" font-size: 1em;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" \n",
"#-tag-645fef0f-59a9-11e2-ae2c-00268315e762{shape-rendering: crispEdges !important;}\n",
"</style>\r\n",
"<div class=\"d3Output header\" style=\"width: 800px;\">Table 1</div>\r\n",
"<div class=\"d3Output title\" style=\"width: 800px;\"> Example table with d3js</div>\r\n",
"<div class=\"d3Output description\" style=\"width: 800px\"> An example table created created with d3js with data generated with Python.</div>\r\n",
"<div id=\"id-645fc800-59a9-11e2-b901-00268315e762\" class=\"d3Output\"><svg width=\"800\" height=\"400\" style=\"border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: black; \"><g id=\"svgElementid-645fc800-59a9-11e2-b901-00268315e762-tag-645fef0f-59a9-11e2-ae2c-00268315e762\" transform=\"translate(190,39)\"><svg class=\"heatmap\" y=\"0\" x=\"0\" id=\"heatmap\"><g class=\"heatmapCell\" transform=\"translate(60,40)\"><rect y=\"22\" fill=\"#a7f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1277</text></g><g class=\"heatmapCell\" transform=\"translate(60,64)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">654</text></g><g class=\"heatmapCell\" transform=\"translate(60,88)\"><rect y=\"22\" fill=\"#b5fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">288</text></g><g class=\"heatmapCell\" transform=\"translate(60,112)\"><rect y=\"22\" fill=\"#9df293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1976</text></g><g class=\"heatmapCell\" transform=\"translate(60,136)\"><rect y=\"22\" fill=\"#8aec99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3281</text></g><g class=\"heatmapCell\" transform=\"translate(60,160)\"><rect y=\"22\" fill=\"#8ded98\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3089</text></g><g class=\"heatmapCell\" transform=\"translate(60,184)\"><rect y=\"22\" fill=\"#43c3b1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10336</text></g><g class=\"heatmapCell\" transform=\"translate(60,208)\"><rect y=\"22\" fill=\"#78e49f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4650</text></g><g class=\"heatmapCell\" transform=\"translate(60,232)\"><rect y=\"22\" fill=\"#7be59e\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4441</text></g><g class=\"heatmapCell\" transform=\"translate(60,256)\"><rect y=\"22\" fill=\"#78e49f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4670</text></g><g class=\"heatmapCell\" transform=\"translate(60,280)\"><rect y=\"22\" fill=\"#abf78e\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">944</text></g><g class=\"heatmapCell\" transform=\"translate(60,304)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">110</text></g><g class=\"heatmapCell\" transform=\"translate(107,40)\"><rect y=\"22\" fill=\"#a6f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1318</text></g><g class=\"heatmapCell\" transform=\"translate(107,64)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">664</text></g><g class=\"heatmapCell\" transform=\"translate(107,88)\"><rect y=\"22\" fill=\"#b3f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">418</text></g><g class=\"heatmapCell\" transform=\"translate(107,112)\"><rect y=\"22\" fill=\"#9df392\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1952</text></g><g class=\"heatmapCell\" transform=\"translate(107,136)\"><rect y=\"22\" fill=\"#86ea9a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3581</text></g><g class=\"heatmapCell\" transform=\"translate(107,160)\"><rect y=\"22\" fill=\"#79e59f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4574</text></g><g class=\"heatmapCell\" transform=\"translate(107,184)\"><rect y=\"22\" fill=\"#41bcb2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">11457</text></g><g class=\"heatmapCell\" transform=\"translate(107,208)\"><rect y=\"22\" fill=\"#66dca6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">6139</text></g><g class=\"heatmapCell\" transform=\"translate(107,232)\"><rect y=\"22\" fill=\"#5dd7a9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">7078</text></g><g class=\"heatmapCell\" transform=\"translate(107,256)\"><rect y=\"22\" fill=\"#62daa7\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">6561</text></g><g class=\"heatmapCell\" transform=\"translate(107,280)\"><rect y=\"22\" fill=\"#97f194\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2354</text></g><g class=\"heatmapCell\" transform=\"translate(107,304)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">710</text></g><g class=\"heatmapCell\" transform=\"translate(154,40)\"><rect y=\"22\" fill=\"#9ff392\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1783</text></g><g class=\"heatmapCell\" transform=\"translate(154,64)\"><rect y=\"22\" fill=\"#aef88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">774</text></g><g class=\"heatmapCell\" transform=\"translate(154,88)\"><rect y=\"22\" fill=\"#b1f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">564</text></g><g class=\"heatmapCell\" transform=\"translate(154,112)\"><rect y=\"22\" fill=\"#a4f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1470</text></g><g class=\"heatmapCell\" transform=\"translate(154,136)\"><rect y=\"22\" fill=\"#86ea9a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3571</text></g><g class=\"heatmapCell\" transform=\"translate(154,160)\"><rect y=\"22\" fill=\"#8ded98\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3103</text></g><g class=\"heatmapCell\" transform=\"translate(154,184)\"><rect y=\"22\" fill=\"#4ac9af\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">9392</text></g><g class=\"heatmapCell\" transform=\"translate(154,208)\"><rect y=\"22\" fill=\"#6de0a3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5532</text></g><g class=\"heatmapCell\" transform=\"translate(154,232)\"><rect y=\"22\" fill=\"#6cdfa4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5661</text></g><g class=\"heatmapCell\" transform=\"translate(154,256)\"><rect y=\"22\" fill=\"#74e3a1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4991</text></g><g class=\"heatmapCell\" transform=\"translate(154,280)\"><rect y=\"22\" fill=\"#9cf293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2032</text></g><g class=\"heatmapCell\" transform=\"translate(154,304)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">680</text></g><g class=\"heatmapCell\" transform=\"translate(201,40)\"><rect y=\"22\" fill=\"#a6f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1301</text></g><g class=\"heatmapCell\" transform=\"translate(201,64)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">604</text></g><g class=\"heatmapCell\" transform=\"translate(201,88)\"><rect y=\"22\" fill=\"#b5fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">286</text></g><g class=\"heatmapCell\" transform=\"translate(201,112)\"><rect y=\"22\" fill=\"#9af293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2152</text></g><g class=\"heatmapCell\" transform=\"translate(201,136)\"><rect y=\"22\" fill=\"#8aec99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3282</text></g><g class=\"heatmapCell\" transform=\"translate(201,160)\"><rect y=\"22\" fill=\"#89eb99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3369</text></g><g class=\"heatmapCell\" transform=\"translate(201,184)\"><rect y=\"22\" fill=\"#43c2b1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10490</text></g><g class=\"heatmapCell\" transform=\"translate(201,208)\"><rect y=\"22\" fill=\"#6fe0a2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5406</text></g><g class=\"heatmapCell\" transform=\"translate(201,232)\"><rect y=\"22\" fill=\"#77e49f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4727</text></g><g class=\"heatmapCell\" transform=\"translate(201,256)\"><rect y=\"22\" fill=\"#88eb99\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3428</text></g><g class=\"heatmapCell\" transform=\"translate(201,280)\"><rect y=\"22\" fill=\"#a3f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1559</text></g><g class=\"heatmapCell\" transform=\"translate(201,304)\"><rect y=\"22\" fill=\"#b0f88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">620</text></g><g class=\"heatmapCell\" transform=\"translate(248,40)\"><rect y=\"22\" fill=\"#a3f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1537</text></g><g class=\"heatmapCell\" transform=\"translate(248,64)\"><rect y=\"22\" fill=\"#a0f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1714</text></g><g class=\"heatmapCell\" transform=\"translate(248,88)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">724</text></g><g class=\"heatmapCell\" transform=\"translate(248,112)\"><rect y=\"22\" fill=\"#76e3a0\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4824</text></g><g class=\"heatmapCell\" transform=\"translate(248,136)\"><rect y=\"22\" fill=\"#6de0a3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5551</text></g><g class=\"heatmapCell\" transform=\"translate(248,160)\"><rect y=\"22\" fill=\"#53d0ac\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">8096</text></g><g class=\"heatmapCell\" transform=\"translate(248,184)\"><rect y=\"22\" fill=\"#4c99ad\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">16589</text></g><g class=\"heatmapCell\" transform=\"translate(248,208)\"><rect y=\"22\" fill=\"#41adb2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">13650</text></g><g class=\"heatmapCell\" transform=\"translate(248,232)\"><rect y=\"22\" fill=\"#49c8af\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">9552</text></g><g class=\"heatmapCell\" transform=\"translate(248,256)\"><rect y=\"22\" fill=\"#41acb2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">13709</text></g><g class=\"heatmapCell\" transform=\"translate(248,280)\"><rect y=\"22\" fill=\"#96f095\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2460</text></g><g class=\"heatmapCell\" transform=\"translate(248,304)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">720</text></g><g class=\"heatmapCell\" transform=\"translate(295,40)\"><rect y=\"22\" fill=\"#6bdfa4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5691</text></g><g class=\"heatmapCell\" transform=\"translate(295,64)\"><rect y=\"22\" fill=\"#8eed97\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2995</text></g><g class=\"heatmapCell\" transform=\"translate(295,88)\"><rect y=\"22\" fill=\"#a1f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1680</text></g><g class=\"heatmapCell\" transform=\"translate(295,112)\"><rect y=\"22\" fill=\"#40bab2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">11741</text></g><g class=\"heatmapCell\" transform=\"translate(295,136)\"><rect y=\"22\" fill=\"#4a9bae\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">16232</text></g><g class=\"heatmapCell\" transform=\"translate(295,160)\"><rect y=\"22\" fill=\"#44a6b1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">14731</text></g><g class=\"heatmapCell\" transform=\"translate(295,184)\"><rect y=\"22\" fill=\"#210f06\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">43522</text></g><g class=\"heatmapCell\" transform=\"translate(295,208)\"><rect y=\"22\" fill=\"#5c3544\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">32794</text></g><g class=\"heatmapCell\" transform=\"translate(295,232)\"><rect y=\"22\" fill=\"#6a5673\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">26634</text></g><g class=\"heatmapCell\" transform=\"translate(295,256)\"><rect y=\"22\" fill=\"#623c4f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">31400</text></g><g class=\"heatmapCell\" transform=\"translate(295,280)\"><rect y=\"22\" fill=\"#5ad5aa\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">7350</text></g><g class=\"heatmapCell\" transform=\"translate(295,304)\"><rect y=\"22\" fill=\"#8eed97\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3010</text></g><g class=\"heatmapCell\" transform=\"translate(342,40)\"><rect y=\"22\" fill=\"#a1f491\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1650</text></g><g class=\"heatmapCell\" transform=\"translate(342,64)\"><rect y=\"22\" fill=\"#9bf293\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2096</text></g><g class=\"heatmapCell\" transform=\"translate(342,88)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">60</text></g><g class=\"heatmapCell\" transform=\"translate(342,112)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">50</text></g><g class=\"heatmapCell\" transform=\"translate(342,136)\"><rect y=\"22\" fill=\"#a8f68f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1180</text></g><g class=\"heatmapCell\" transform=\"translate(342,160)\"><rect y=\"22\" fill=\"#6ddfa3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5602</text></g><g class=\"heatmapCell\" transform=\"translate(342,184)\"><rect y=\"22\" fill=\"#489faf\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">15728</text></g><g class=\"heatmapCell\" transform=\"translate(342,208)\"><rect y=\"22\" fill=\"#5fd8a8\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">6874</text></g><g class=\"heatmapCell\" transform=\"translate(342,232)\"><rect y=\"22\" fill=\"#72e2a1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5115</text></g><g class=\"heatmapCell\" transform=\"translate(342,256)\"><rect y=\"22\" fill=\"#87ea9a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3510</text></g><g class=\"heatmapCell\" transform=\"translate(342,280)\"><rect y=\"22\" fill=\"#a5f590\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1390</text></g><g class=\"heatmapCell\" transform=\"translate(342,304)\"><rect y=\"22\" fill=\"#b7fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">170</text></g><g class=\"heatmapCell\" transform=\"translate(389,40)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">72</text></g><g class=\"heatmapCell\" transform=\"translate(389,64)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">60</text></g><g class=\"heatmapCell\" transform=\"translate(389,88)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">60</text></g><g class=\"heatmapCell\" transform=\"translate(389,112)\"><rect y=\"22\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10</text></g><g class=\"heatmapCell\" transform=\"translate(389,136)\"><rect y=\"22\" fill=\"#b7fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">120</text></g><g class=\"heatmapCell\" transform=\"translate(389,160)\"><rect y=\"22\" fill=\"#b7fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">172</text></g><g class=\"heatmapCell\" transform=\"translate(389,184)\"><rect y=\"22\" fill=\"#a9f68f\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1092</text></g><g class=\"heatmapCell\" transform=\"translate(389,208)\"><rect y=\"22\" fill=\"#aff88d\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">675</text></g><g class=\"heatmapCell\" transform=\"translate(389,232)\"><rect y=\"22\" fill=\"#b3f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">408</text></g><g class=\"heatmapCell\" transform=\"translate(389,256)\"><rect y=\"22\" fill=\"#b4f98c\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">360</text></g><g class=\"heatmapCell\" transform=\"translate(389,280)\"><rect y=\"22\" fill=\"#b7fa8b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">156</text></g><g class=\"heatmapCell\" transform=\"translate(389,304)\"><rect y=\"22\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">100</text></g><g class=\"heatmapCell\" transform=\"translate(60,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 1</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 2</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 3</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 4</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 5</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 6</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 7</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Prod 8</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 9px; \" text-anchor=\"middle\">Group 1</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 9px; \" text-anchor=\"middle\">Group 2</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,40)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">January</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,64)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">February</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,88)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">March</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,112)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">April</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,136)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">May</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,160)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">June</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,184)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">July</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,208)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">August</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,232)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">September</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,256)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">October</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,280)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">November</text><polyline points=\"55,1.5 55,20.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,304)\"><text x=\"50\" y=\"15.5\" style=\"font-size: 9px; \" text-anchor=\"end\">Deecember</text><polyline points=\"55,1.5 55,20.5\"></polyline></g></svg></g></svg></div>\r\n",
"\r\n"
],
"output_type": "display_data"
},
{
"output_type": "pyout",
"prompt_number": 9,
"text": [
"True"
]
}
],
"prompt_number": 9
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"But since it is HTML you can easily increase readability of the table!! With _addTable_ instead of _addSimpleTable_. In fact _addSimpleTable_ is just a reference to _addTable_"
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"d3 = d3object(width=800,\n",
" height=400,\n",
" style='JFTable',\n",
" number=1,\n",
" d3=None,\n",
" title='Example table with d3js',\n",
" desc='An example table created created with d3js with data generated with Python.')\n",
"d3.addTable(data,\n",
" dataAdd=[],\n",
" pVals=-1,\n",
" fontSizeCells=[11,5],\n",
" fontSizeCellsLabels=[11,5],\n",
" sRows=sRows,\n",
" sColumns=sColumns,\n",
" sRowsMargins=[5,50,0],\n",
" sColsMargins=[5,20,10],\n",
" fontSizeHeaders=11,\n",
" shrinkHeadersBorders=1.5,\n",
" heatmapIgnoreText=1,\n",
" varLabels=[],\n",
" heatmap={\n",
" 'draw':1,\n",
" 'spacing':2,\n",
" 'fillProportion':21,\n",
" 'addText':1,\n",
" 'addTextRows':1,\n",
" 'addBorders':1,\n",
" 'addOutsideBorders':-1,\n",
" 'rectWidth':45,\n",
" 'rectHeight':21,\n",
" },\n",
" smallHeatmap={\n",
" 'draw':0,\n",
" 'spacing':0,\n",
" 'fillProportion':5,\n",
" 'addText':0,\n",
" 'addTextRows':0,\n",
" 'addBorders':1,\n",
" 'addOutsideBorders':-1,\n",
" 'rectWidth':5,\n",
" 'rectHeight':5,\n",
" },\n",
" heatmapLegendVert=1,\n",
" legend= {\n",
" 'draw':0,\n",
" 'width':2,\n",
" 'height':15,\n",
" 'rectWidth':60,\n",
" 'rectHeight':60\n",
" },\n",
" rightPaneOffset=0,\n",
" colorDomainAuto=1,\n",
" #colorDomainAutoIgnoreRows=[5],\n",
" colorRange=['#ffffff', '#dddddd', '#cccccc', '#bbbbbb', '#aaaaaa', '#999999']\n",
")\n",
"d3 = d3object(width=800,\n",
" height=400,\n",
" style='JFTable',\n",
" number=1,\n",
" d3=d3,\n",
" title='Example table with d3js with a small heatmap',\n",
" desc='An example table created created with d3js with data generated with Python.')\n",
"d3.addTable(data,\n",
" dataAdd=[],\n",
" pVals=-1,\n",
" fontSizeCells=[11,5],\n",
" fontSizeCellsLabels=[11,5],\n",
" sRows=sRows,\n",
" sColumns=sColumns,\n",
" sRowsMargins=[5,50,0],\n",
" sColsMargins=[5,20,10],\n",
" fontSizeHeaders=11,\n",
" shrinkHeadersBorders=1.5,\n",
" heatmapIgnoreText=1,\n",
" varLabels=['Sales'],\n",
" heatmap={\n",
" 'draw':1,\n",
" 'spacing':2,\n",
" 'fillProportion':0,\n",
" 'addText':1,\n",
" 'addTextRows':1,\n",
" 'addBorders':1,\n",
" 'addOutsideBorders':-1,\n",
" 'rectWidth':45,\n",
" 'rectHeight':21,\n",
" },\n",
" smallHeatmap={\n",
" 'draw':1,\n",
" 'spacing':0,\n",
" 'fillProportion':10,\n",
" 'addText':0,\n",
" 'addTextRows':0,\n",
" 'addBorders':0,\n",
" 'addOutsideBorders':0,\n",
" 'rectWidth':10,\n",
" 'rectHeight':10,\n",
" },\n",
" heatmapLegendVert=1,\n",
" legend= {\n",
" 'draw':1,\n",
" 'width':2,\n",
" 'height':15,\n",
" 'rectWidth':45,\n",
" 'rectHeight':30\n",
" },\n",
" rightPaneOffset=100,\n",
" colorDomainAuto=1,\n",
" colorRange=['#ffffff', '#eeeeee', '#aaaaaa', '#111111', '#000000']\n",
")\n",
"d3.render(mode=['html', 'show'])"
],
"language": "python",
"metadata": {},
"outputs": [
{
"html": [
"<style>\n",
"\n",
"\n",
" .d3Output{\n",
" min-height: 1.2em;\n",
" line-height: 1.2em;\n",
" position: relative;\n",
" font-size: 1em;\n",
" padding: 5px 0;\n",
" \n",
" list-style: none;\n",
" background: #fff;\n",
" color: #000;\n",
" }\n",
" svg{\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: geometricPrecision !important;\n",
" text-rendering: geometricPrecision !important;\n",
" }\n",
" .d3Output.header{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 0.9em;\n",
" \n",
" }\n",
" .d3Output.title{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 1.2em;\n",
" \n",
" }\n",
" .d3Output.description{\n",
" font-size: 0.8em;\n",
" text-align:justify;\n",
" text-justify:inter-word;\n",
" border-bottom: 1px solid #000;\n",
" }\n",
" .d3Output.description.panel{\n",
" text-align: center;\n",
" }\n",
" svg, canvas {\n",
" border-bottom: 1px solid #000;\n",
" display: block;\n",
" margin: 5px 0;\n",
" }\n",
" .d3Output.description.figure{\n",
" border-bottom: none;\n",
" }\n",
" \n",
"\n",
"\n",
" .d3Output{\n",
" min-height: 1.2em;\n",
" line-height: 1.2em;\n",
" position: relative;\n",
" font-size: 1em;\n",
" padding: 5px 0;\n",
" \n",
" list-style: none;\n",
" background: #fff;\n",
" color: #000;\n",
" }\n",
" svg{\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: geometricPrecision !important;\n",
" text-rendering: geometricPrecision !important;\n",
" }\n",
" .d3Output.header{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 0.9em;\n",
" \n",
" }\n",
" .d3Output.title{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 1.2em;\n",
" \n",
" }\n",
" .d3Output.description{\n",
" font-size: 0.8em;\n",
" text-align:justify;\n",
" text-justify:inter-word;\n",
" border-bottom: 1px solid #000;\n",
" }\n",
" .d3Output.description.panel{\n",
" text-align: center;\n",
" }\n",
" svg, canvas {\n",
" border-bottom: 1px solid #000;\n",
" display: block;\n",
" margin: 5px 0;\n",
" }\n",
" .d3Output.description.figure{\n",
" border-bottom: none;\n",
" }\n",
" \n",
"\n",
" .heatmapCell path, .heatmapCell line, .heatmapCell polyline, .d3Output polyline {\n",
" fill: none;\n",
" stroke-width: 1px;\n",
" stroke: black;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" .heatmapCell text, .heatmapCell rect, .d3Output rect {\n",
" font-size: 1em;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" \n",
"#-tag-65b6cc81-59a9-11e2-b2d2-00268315e762{shape-rendering: crispEdges !important;}\n",
"\n",
" .heatmapCell path, .heatmapCell line, .heatmapCell polyline, .d3Output polyline {\n",
" fill: none;\n",
" stroke-width: 1px;\n",
" stroke: black;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" .heatmapCell text, .heatmapCell rect, .d3Output rect {\n",
" font-size: 1em;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" \n",
"#-tag-67054580-59a9-11e2-84c0-00268315e762{shape-rendering: crispEdges !important;}\n",
"</style>\r\n",
"\r\n",
"<div class=\"d3Output header\" style=\"width: 800px;\">Table 1</div>\r\n",
"<div class=\"d3Output title\" style=\"width: 800px;\"> Example table with d3js</div>\r\n",
"<div class=\"d3Output description\" style=\"width: 800px\"> An example table created created with d3js with data generated with Python.</div>\r\n",
"<div id=\"id-65b6cc80-59a9-11e2-a446-00268315e762\" class=\"d3Output\"><svg width=\"800\" height=\"400\" style=\"border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: black; \"><g id=\"svgElementid-65b6cc80-59a9-11e2-a446-00268315e762-tag-65b6cc81-59a9-11e2-b2d2-00268315e762\" transform=\"translate(136.75,41.5)\"><svg class=\"heatmap\" y=\"0\" x=\"0\" id=\"heatmap\"><g class=\"heatmapCell\" transform=\"translate(60,40)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1277</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,63)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">654</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,86)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">288</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,109)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1976</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,132)\"><rect y=\"0\" fill=\"#f0f0f0\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3281</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,155)\"><rect y=\"0\" fill=\"#f1f1f1\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3089</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,178)\"><rect y=\"0\" fill=\"#d6d6d6\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">10336</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,201)\"><rect y=\"0\" fill=\"#e9e9e9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4650</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,224)\"><rect y=\"0\" fill=\"#eaeaea\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4441</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,247)\"><rect y=\"0\" fill=\"#e9e9e9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4670</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,270)\"><rect y=\"0\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">944</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,293)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">110</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,40)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1318</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,63)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">664</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,86)\"><rect y=\"0\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">418</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,109)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1952</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,132)\"><rect y=\"0\" fill=\"#eeeeee\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3581</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,155)\"><rect y=\"0\" fill=\"#eaeaea\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4574</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,178)\"><rect y=\"0\" fill=\"#d3d3d3\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">11457</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,201)\"><rect y=\"0\" fill=\"#e2e2e2\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">6139</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,224)\"><rect y=\"0\" fill=\"#dedede\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">7078</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,247)\"><rect y=\"0\" fill=\"#e0e0e0\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">6561</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,270)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2354</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,293)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">710</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,40)\"><rect y=\"0\" fill=\"#f7f7f7\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1783</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,63)\"><rect y=\"0\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">774</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,86)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">564</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,109)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1470</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,132)\"><rect y=\"0\" fill=\"#eeeeee\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3571</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,155)\"><rect y=\"0\" fill=\"#f0f0f0\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3103</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,178)\"><rect y=\"0\" fill=\"#d8d8d8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">9392</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,201)\"><rect y=\"0\" fill=\"#e5e5e5\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5532</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,224)\"><rect y=\"0\" fill=\"#e5e5e5\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5661</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,247)\"><rect y=\"0\" fill=\"#e8e8e8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4991</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,270)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2032</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,293)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">680</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,40)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1301</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,63)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">604</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,86)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">286</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,109)\"><rect y=\"0\" fill=\"#f5f5f5\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2152</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,132)\"><rect y=\"0\" fill=\"#f0f0f0\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3282</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,155)\"><rect y=\"0\" fill=\"#efefef\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3369</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,178)\"><rect y=\"0\" fill=\"#d5d5d5\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">10490</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,201)\"><rect y=\"0\" fill=\"#e6e6e6\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5406</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,224)\"><rect y=\"0\" fill=\"#e9e9e9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4727</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,247)\"><rect y=\"0\" fill=\"#efefef\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3428</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,270)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1559</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,293)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">620</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,40)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1537</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,63)\"><rect y=\"0\" fill=\"#f7f7f7\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1714</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,86)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">724</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,109)\"><rect y=\"0\" fill=\"#e8e8e8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4824</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,132)\"><rect y=\"0\" fill=\"#e5e5e5\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5551</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,155)\"><rect y=\"0\" fill=\"#dbdbdb\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">8096</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,178)\"><rect y=\"0\" fill=\"#c7c7c7\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">16589</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,201)\"><rect y=\"0\" fill=\"#cecece\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">13650</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,224)\"><rect y=\"0\" fill=\"#d8d8d8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">9552</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,247)\"><rect y=\"0\" fill=\"#cecece\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">13709</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,270)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2460</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,293)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">720</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,40)\"><rect y=\"0\" fill=\"#e4e4e4\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5691</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,63)\"><rect y=\"0\" fill=\"#f1f1f1\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2995</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,86)\"><rect y=\"0\" fill=\"#f7f7f7\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1680</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,109)\"><rect y=\"0\" fill=\"#d3d3d3\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">11741</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,132)\"><rect y=\"0\" fill=\"#c8c8c8\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">16232</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,155)\"><rect y=\"0\" fill=\"#cbcbcb\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">14731</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,178)\"><rect y=\"0\" fill=\"#888888\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">43522</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,201)\"><rect y=\"0\" fill=\"#a1a1a1\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">32794</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,224)\"><rect y=\"0\" fill=\"#b0b0b0\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">26634</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,247)\"><rect y=\"0\" fill=\"#a4a4a4\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">31400</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,270)\"><rect y=\"0\" fill=\"#dddddd\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">7350</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,293)\"><rect y=\"0\" fill=\"#f1f1f1\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3010</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,40)\"><rect y=\"0\" fill=\"#f7f7f7\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1650</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,63)\"><rect y=\"0\" fill=\"#f5f5f5\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2096</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,86)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,109)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">50</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,132)\"><rect y=\"0\" fill=\"#fafafa\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1180</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,155)\"><rect y=\"0\" fill=\"#e5e5e5\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5602</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,178)\"><rect y=\"0\" fill=\"#c9c9c9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">15728</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,201)\"><rect y=\"0\" fill=\"#dfdfdf\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">6874</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,224)\"><rect y=\"0\" fill=\"#e7e7e7\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5115</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,247)\"><rect y=\"0\" fill=\"#efefef\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3510</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,270)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1390</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,293)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">170</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,40)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">72</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,63)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,86)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,109)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">10</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,132)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">120</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,155)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">172</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,178)\"><rect y=\"0\" fill=\"#fafafa\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1092</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,201)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">675</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,224)\"><rect y=\"0\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">408</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,247)\"><rect y=\"0\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">360</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,270)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">156</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,293)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"21\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">100</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 1</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 2</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 3</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 4</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 5</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 6</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 7</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 8</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 11px; \" text-anchor=\"middle\">Group 1</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 11px; \" text-anchor=\"middle\">Group 2</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,40)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">January</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,63)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">February</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,86)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">March</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,109)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">April</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,132)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">May</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,155)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">June</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,178)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">July</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,201)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">August</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,224)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">September</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,247)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">October</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,270)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">November</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,293)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">Deecember</text><polyline points=\"55,1.5 55,19.5\"></polyline></g></svg><svg y=\"40\" x=\"456\" id=\"vertLegend\" style=\"opacity: 0.01; \"><rect y=\"-1\" fill=\"#ffffff\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"0\" fill=\"#fefefe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"1\" fill=\"#fefefe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"2\" fill=\"#fdfdfd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"3\" fill=\"#fcfcfc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"4\" fill=\"#fbfbfb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"5\" fill=\"#fbfbfb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"6\" fill=\"#fafafa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"7\" fill=\"#f9f9f9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"8\" fill=\"#f8f8f8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"9\" fill=\"#f8f8f8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"10\" fill=\"#f7f7f7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"11\" fill=\"#f6f6f6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"12\" fill=\"#f5f5f5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"13\" fill=\"#f5f5f5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"14\" fill=\"#f4f4f4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"15\" fill=\"#f3f3f3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"16\" fill=\"#f2f2f2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"17\" fill=\"#f2f2f2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"18\" fill=\"#f1f1f1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"19\" fill=\"#f0f0f0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"20\" fill=\"#efefef\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"21\" fill=\"#efefef\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"22\" fill=\"#eeeeee\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"23\" fill=\"#ededed\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"24\" fill=\"#ededed\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"25\" fill=\"#ececec\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"26\" fill=\"#ebebeb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"27\" fill=\"#eaeaea\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"28\" fill=\"#eaeaea\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"29\" fill=\"#e9e9e9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"30\" fill=\"#e8e8e8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"31\" fill=\"#e7e7e7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"32\" fill=\"#e7e7e7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"33\" fill=\"#e6e6e6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"34\" fill=\"#e5e5e5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"35\" fill=\"#e4e4e4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"36\" fill=\"#e4e4e4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"37\" fill=\"#e3e3e3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"38\" fill=\"#e2e2e2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"39\" fill=\"#e1e1e1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"40\" fill=\"#e1e1e1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"41\" fill=\"#e0e0e0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"42\" fill=\"#dfdfdf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"43\" fill=\"#dedede\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"44\" fill=\"#dedede\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"45\" fill=\"#dddddd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"46\" fill=\"#dddddd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"47\" fill=\"#dcdcdc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"48\" fill=\"#dcdcdc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"49\" fill=\"#dcdcdc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"50\" fill=\"#dbdbdb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"51\" fill=\"#dbdbdb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"52\" fill=\"#dadada\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"53\" fill=\"#dadada\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"54\" fill=\"#dadada\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"55\" fill=\"#d9d9d9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"56\" fill=\"#d9d9d9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"57\" fill=\"#d9d9d9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"58\" fill=\"#d8d8d8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"59\" fill=\"#d8d8d8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"60\" fill=\"#d7d7d7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"61\" fill=\"#d7d7d7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"62\" fill=\"#d7d7d7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"63\" fill=\"#d6d6d6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"64\" fill=\"#d6d6d6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"65\" fill=\"#d6d6d6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"66\" fill=\"#d5d5d5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"67\" fill=\"#d5d5d5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"68\" fill=\"#d5d5d5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"69\" fill=\"#d4d4d4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"70\" fill=\"#d4d4d4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"71\" fill=\"#d3d3d3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"72\" fill=\"#d3d3d3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"73\" fill=\"#d3d3d3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"74\" fill=\"#d2d2d2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"75\" fill=\"#d2d2d2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"76\" fill=\"#d2d2d2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"77\" fill=\"#d1d1d1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"78\" fill=\"#d1d1d1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"79\" fill=\"#d0d0d0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"80\" fill=\"#d0d0d0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"81\" fill=\"#d0d0d0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"82\" fill=\"#cfcfcf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"83\" fill=\"#cfcfcf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"84\" fill=\"#cfcfcf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"85\" fill=\"#cecece\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"86\" fill=\"#cecece\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"87\" fill=\"#cdcdcd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"88\" fill=\"#cdcdcd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"89\" fill=\"#cdcdcd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"90\" fill=\"#cccccc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"91\" fill=\"#cccccc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"92\" fill=\"#cccccc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"93\" fill=\"#cbcbcb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"94\" fill=\"#cbcbcb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"95\" fill=\"#cbcbcb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"96\" fill=\"#cacaca\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"97\" fill=\"#cacaca\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"98\" fill=\"#c9c9c9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"99\" fill=\"#c9c9c9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"100\" fill=\"#c9c9c9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"101\" fill=\"#c8c8c8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"102\" fill=\"#c8c8c8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"103\" fill=\"#c8c8c8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"104\" fill=\"#c7c7c7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"105\" fill=\"#c7c7c7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"106\" fill=\"#c6c6c6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"107\" fill=\"#c6c6c6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"108\" fill=\"#c6c6c6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"109\" fill=\"#c5c5c5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"110\" fill=\"#c5c5c5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"111\" fill=\"#c5c5c5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"112\" fill=\"#c4c4c4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"113\" fill=\"#c4c4c4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"114\" fill=\"#c4c4c4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"115\" fill=\"#c3c3c3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"116\" fill=\"#c3c3c3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"117\" fill=\"#c2c2c2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"118\" fill=\"#c2c2c2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"119\" fill=\"#c2c2c2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"120\" fill=\"#c1c1c1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"121\" fill=\"#c1c1c1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"122\" fill=\"#c1c1c1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"123\" fill=\"#c0c0c0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"124\" fill=\"#c0c0c0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"125\" fill=\"#bfbfbf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"126\" fill=\"#bfbfbf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"127\" fill=\"#bfbfbf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"128\" fill=\"#bebebe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"129\" fill=\"#bebebe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"130\" fill=\"#bebebe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"131\" fill=\"#bdbdbd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"132\" fill=\"#bdbdbd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"133\" fill=\"#bcbcbc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"134\" fill=\"#bcbcbc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"135\" fill=\"#bcbcbc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"136\" fill=\"#bbbbbb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"137\" fill=\"#bbbbbb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"138\" fill=\"#bbbbbb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"139\" fill=\"#bababa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"140\" fill=\"#bababa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"141\" fill=\"#bababa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"142\" fill=\"#b9b9b9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"143\" fill=\"#b9b9b9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"144\" fill=\"#b8b8b8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"145\" fill=\"#b8b8b8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"146\" fill=\"#b8b8b8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"147\" fill=\"#b7b7b7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"148\" fill=\"#b7b7b7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"149\" fill=\"#b7b7b7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"150\" fill=\"#b6b6b6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"151\" fill=\"#b6b6b6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"152\" fill=\"#b5b5b5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"153\" fill=\"#b5b5b5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"154\" fill=\"#b5b5b5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"155\" fill=\"#b4b4b4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"156\" fill=\"#b4b4b4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"157\" fill=\"#b4b4b4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"158\" fill=\"#b3b3b3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"159\" fill=\"#b3b3b3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"160\" fill=\"#b3b3b3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"161\" fill=\"#b2b2b2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"162\" fill=\"#b2b2b2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"163\" fill=\"#b1b1b1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"164\" fill=\"#b1b1b1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"165\" fill=\"#b1b1b1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"166\" fill=\"#b0b0b0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"167\" fill=\"#b0b0b0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"168\" fill=\"#b0b0b0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"169\" fill=\"#afafaf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"170\" fill=\"#afafaf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"171\" fill=\"#aeaeae\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"172\" fill=\"#aeaeae\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"173\" fill=\"#aeaeae\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"174\" fill=\"#adadad\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"175\" fill=\"#adadad\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"176\" fill=\"#adadad\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"177\" fill=\"#acacac\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"178\" fill=\"#acacac\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"179\" fill=\"#ababab\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"180\" fill=\"#ababab\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"181\" fill=\"#ababab\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"182\" fill=\"#aaaaaa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"183\" fill=\"#aaaaaa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"184\" fill=\"#aaaaaa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"185\" fill=\"#a9a9a9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"186\" fill=\"#a9a9a9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"187\" fill=\"#a9a9a9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"188\" fill=\"#a8a8a8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"189\" fill=\"#a8a8a8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"190\" fill=\"#a7a7a7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"191\" fill=\"#a7a7a7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"192\" fill=\"#a7a7a7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"193\" fill=\"#a6a6a6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"194\" fill=\"#a6a6a6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"195\" fill=\"#a6a6a6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"196\" fill=\"#a5a5a5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"197\" fill=\"#a5a5a5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"198\" fill=\"#a4a4a4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"199\" fill=\"#a4a4a4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"200\" fill=\"#a4a4a4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"201\" fill=\"#a3a3a3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"202\" fill=\"#a3a3a3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"203\" fill=\"#a3a3a3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"204\" fill=\"#a2a2a2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"205\" fill=\"#a2a2a2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"206\" fill=\"#a2a2a2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"207\" fill=\"#a1a1a1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"208\" fill=\"#a1a1a1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"209\" fill=\"#a0a0a0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"210\" fill=\"#a0a0a0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"211\" fill=\"#a0a0a0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"212\" fill=\"#9f9f9f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"213\" fill=\"#9f9f9f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"214\" fill=\"#9f9f9f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"215\" fill=\"#9e9e9e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"216\" fill=\"#9e9e9e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"217\" fill=\"#9d9d9d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"218\" fill=\"#9d9d9d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"219\" fill=\"#9d9d9d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"220\" fill=\"#9c9c9c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"221\" fill=\"#9c9c9c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"222\" fill=\"#9c9c9c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"223\" fill=\"#9b9b9b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"224\" fill=\"#9b9b9b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"225\" fill=\"#9a9a9a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"226\" fill=\"#9a9a9a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"227\" fill=\"#9a9a9a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"228\" fill=\"#999999\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"229\" fill=\"#999999\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"230\" fill=\"#999999\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"231\" fill=\"#989898\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"232\" fill=\"#989898\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"233\" fill=\"#989898\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"234\" fill=\"#979797\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"235\" fill=\"#979797\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"236\" fill=\"#969696\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"237\" fill=\"#969696\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"238\" fill=\"#969696\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"239\" fill=\"#959595\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"240\" fill=\"#959595\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"241\" fill=\"#959595\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"242\" fill=\"#949494\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"243\" fill=\"#949494\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"244\" fill=\"#939393\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"245\" fill=\"#939393\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"246\" fill=\"#939393\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"247\" fill=\"#929292\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"248\" fill=\"#929292\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"249\" fill=\"#929292\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"250\" fill=\"#919191\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"251\" fill=\"#919191\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"252\" fill=\"#919191\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"253\" fill=\"#909090\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"254\" fill=\"#909090\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"255\" fill=\"#8f8f8f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"256\" fill=\"#8f8f8f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"257\" fill=\"#8f8f8f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"258\" fill=\"#8e8e8e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"259\" fill=\"#8e8e8e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"260\" fill=\"#8e8e8e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"261\" fill=\"#8d8d8d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"262\" fill=\"#8d8d8d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"263\" fill=\"#8c8c8c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"264\" fill=\"#8c8c8c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"265\" fill=\"#8c8c8c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"266\" fill=\"#8b8b8b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"267\" fill=\"#8b8b8b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"268\" fill=\"#8b8b8b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"269\" fill=\"#8a8a8a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"270\" fill=\"#8a8a8a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"271\" fill=\"#898989\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"272\" fill=\"#898989\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"273\" fill=\"#898989\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"274\" fill=\"#888888\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"275\" fill=\"#888888\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><g class=\"axis\" transform=\"translate(22.5,0)\"><g style=\"opacity: 1; \" transform=\"translate(0,66.07142857142857)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">10,000</text></g><g style=\"opacity: 1; \" transform=\"translate(0,127.2039897039897)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">20,000</text></g><g style=\"opacity: 1; \" transform=\"translate(0,188.33655083655086)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">30,000</text></g><g style=\"opacity: 1; \" transform=\"translate(0,249.469111969112)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">40,000</text></g><path class=\"domain\" d=\"M0,5H0V271H0\"></path></g></svg></g></svg><div style=\"page-break-after:always; display:block; width:1px; height:1px;\">&nbsp;</div></div>\r\n",
"\r\n",
"\r\n",
"<div class=\"d3Output header\" style=\"width: 800px;\">Table 1</div>\r\n",
"<div class=\"d3Output title\" style=\"width: 800px;\"> Example table with d3js with a small heatmap</div>\r\n",
"<div class=\"d3Output description\" style=\"width: 800px\"> An example table created created with d3js with data generated with Python.</div>\r\n",
"<div id=\"id-65b6cc82-59a9-11e2-9aaa-00268315e762\" class=\"d3Output\"><svg width=\"800\" height=\"400\" style=\"border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: black; \"><g id=\"svgElementid-65b6cc82-59a9-11e2-9aaa-00268315e762-tag-67054580-59a9-11e2-84c0-00268315e762\" transform=\"translate(103.5,41.5)\"><svg class=\"heatmap\" y=\"0\" x=\"0\" id=\"heatmap\"><g class=\"heatmapCell\" transform=\"translate(60,40)\"><rect y=\"21\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1277</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,63)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">654</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,86)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">288</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,109)\"><rect y=\"21\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1976</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,132)\"><rect y=\"21\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3281</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,155)\"><rect y=\"21\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3089</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,178)\"><rect y=\"21\" fill=\"#e1e1e1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">10336</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,201)\"><rect y=\"21\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4650</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,224)\"><rect y=\"21\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4441</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,247)\"><rect y=\"21\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4670</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,270)\"><rect y=\"21\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">944</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,293)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">110</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,40)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1318</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,63)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">664</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,86)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">418</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,109)\"><rect y=\"21\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1952</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,132)\"><rect y=\"21\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3581</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,155)\"><rect y=\"21\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4574</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,178)\"><rect y=\"21\" fill=\"#d9d9d9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">11457</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,201)\"><rect y=\"21\" fill=\"#f3f3f3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">6139</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,224)\"><rect y=\"21\" fill=\"#f1f1f1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">7078</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,247)\"><rect y=\"21\" fill=\"#f2f2f2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">6561</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,270)\"><rect y=\"21\" fill=\"#fafafa\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2354</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,293)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">710</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,40)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1783</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,63)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">774</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,86)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">564</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,109)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1470</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,132)\"><rect y=\"21\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3571</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,155)\"><rect y=\"21\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3103</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,178)\"><rect y=\"21\" fill=\"#e9e9e9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">9392</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,201)\"><rect y=\"21\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5532</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,224)\"><rect y=\"21\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5661</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,247)\"><rect y=\"21\" fill=\"#f5f5f5\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4991</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,270)\"><rect y=\"21\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2032</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,293)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">680</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,40)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1301</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,63)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">604</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,86)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">286</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,109)\"><rect y=\"21\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2152</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,132)\"><rect y=\"21\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3282</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,155)\"><rect y=\"21\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3369</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,178)\"><rect y=\"21\" fill=\"#e0e0e0\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">10490</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,201)\"><rect y=\"21\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5406</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,224)\"><rect y=\"21\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4727</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,247)\"><rect y=\"21\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3428</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,270)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1559</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,293)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">620</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,40)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1537</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,63)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1714</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,86)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">724</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,109)\"><rect y=\"21\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">4824</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,132)\"><rect y=\"21\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5551</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,155)\"><rect y=\"21\" fill=\"#efefef\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">8096</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,178)\"><rect y=\"21\" fill=\"#b0b0b0\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">16589</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,201)\"><rect y=\"21\" fill=\"#c7c7c7\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">13650</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,224)\"><rect y=\"21\" fill=\"#e7e7e7\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">9552</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,247)\"><rect y=\"21\" fill=\"#c7c7c7\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">13709</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,270)\"><rect y=\"21\" fill=\"#fafafa\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2460</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,293)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">720</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,40)\"><rect y=\"21\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5691</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,63)\"><rect y=\"21\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2995</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,86)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1680</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,109)\"><rect y=\"21\" fill=\"#d6d6d6\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">11741</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,132)\"><rect y=\"21\" fill=\"#b3b3b3\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">16232</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,155)\"><rect y=\"21\" fill=\"#bfbfbf\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">14731</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,178)\"><rect y=\"21\" fill=\"#000000\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">43522</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,201)\"><rect y=\"21\" fill=\"#040404\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">32794</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,224)\"><rect y=\"21\" fill=\"#101010\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">26634</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,247)\"><rect y=\"21\" fill=\"#070707\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">31400</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,270)\"><rect y=\"21\" fill=\"#f1f1f1\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">7350</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,293)\"><rect y=\"21\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3010</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,40)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1650</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,63)\"><rect y=\"21\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">2096</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,86)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,109)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">50</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,132)\"><rect y=\"21\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1180</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,155)\"><rect y=\"21\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5602</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,178)\"><rect y=\"21\" fill=\"#b7b7b7\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">15728</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,201)\"><rect y=\"21\" fill=\"#f2f2f2\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">6874</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,224)\"><rect y=\"21\" fill=\"#f5f5f5\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">5115</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,247)\"><rect y=\"21\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">3510</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,270)\"><rect y=\"21\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1390</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,293)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">170</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,40)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">72</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,63)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,86)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">60</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,109)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">10</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,132)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">120</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,155)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">172</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,178)\"><rect y=\"21\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">1092</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,201)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">675</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,224)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">408</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,247)\"><rect y=\"21\" fill=\"#fefefe\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">360</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,270)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">156</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,293)\"><rect y=\"21\" fill=\"#ffffff\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">100</text><polyline points=\"0,0 45,0 45,21 0,21 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(60,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 1</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(107,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 2</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 3</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(201,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 4</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(248,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 5</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 6</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(342,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 7</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(389,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 11px; \" text-anchor=\"middle\">Prod 8</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(154,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 11px; \" text-anchor=\"middle\">Group 1</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(295,0)\"><text x=\"69.5\" y=\"10\" style=\"font-size: 11px; \" text-anchor=\"middle\">Group 2</text><polyline points=\"1.5,15 137.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,40)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">January</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,63)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">February</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,86)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">March</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,109)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">April</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,132)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">May</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,155)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">June</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,178)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">July</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,201)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">August</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,224)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">September</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,247)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">October</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,270)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">November</text><polyline points=\"55,1.5 55,19.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,293)\"><text x=\"50\" y=\"16\" style=\"font-size: 11px; \" text-anchor=\"end\">Deecember</text><polyline points=\"55,1.5 55,19.5\"></polyline></g></svg><svg class=\"heatmap\" y=\"35\" x=\"509\" id=\"smallHeatmap\"><g class=\"heatmapCell\" transform=\"translate(1,1)\"><rect y=\"0\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,11)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,21)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,31)\"><rect y=\"0\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,41)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,51)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,61)\"><rect y=\"0\" fill=\"#e1e1e1\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,71)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,81)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,91)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,101)\"><rect y=\"0\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(1,111)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,1)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,11)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,21)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,31)\"><rect y=\"0\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,41)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,51)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,61)\"><rect y=\"0\" fill=\"#d9d9d9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,71)\"><rect y=\"0\" fill=\"#f3f3f3\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,81)\"><rect y=\"0\" fill=\"#f1f1f1\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,91)\"><rect y=\"0\" fill=\"#f2f2f2\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,101)\"><rect y=\"0\" fill=\"#fafafa\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(11,111)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,1)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,11)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,21)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,31)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,41)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,51)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,61)\"><rect y=\"0\" fill=\"#e9e9e9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,71)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,81)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,91)\"><rect y=\"0\" fill=\"#f5f5f5\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,101)\"><rect y=\"0\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(21,111)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,1)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,11)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,21)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,31)\"><rect y=\"0\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,41)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,51)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,61)\"><rect y=\"0\" fill=\"#e0e0e0\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,71)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,81)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,91)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,101)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(31,111)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,1)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,11)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,21)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,31)\"><rect y=\"0\" fill=\"#f6f6f6\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,41)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,51)\"><rect y=\"0\" fill=\"#efefef\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,61)\"><rect y=\"0\" fill=\"#b0b0b0\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,71)\"><rect y=\"0\" fill=\"#c7c7c7\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,81)\"><rect y=\"0\" fill=\"#e7e7e7\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,91)\"><rect y=\"0\" fill=\"#c7c7c7\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,101)\"><rect y=\"0\" fill=\"#fafafa\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(41,111)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,1)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,11)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,21)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,31)\"><rect y=\"0\" fill=\"#d6d6d6\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,41)\"><rect y=\"0\" fill=\"#b3b3b3\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,51)\"><rect y=\"0\" fill=\"#bfbfbf\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,61)\"><rect y=\"0\" fill=\"#000000\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,71)\"><rect y=\"0\" fill=\"#040404\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,81)\"><rect y=\"0\" fill=\"#101010\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,91)\"><rect y=\"0\" fill=\"#070707\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,101)\"><rect y=\"0\" fill=\"#f1f1f1\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(51,111)\"><rect y=\"0\" fill=\"#f9f9f9\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,1)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,11)\"><rect y=\"0\" fill=\"#fbfbfb\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,21)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,31)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,41)\"><rect y=\"0\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,51)\"><rect y=\"0\" fill=\"#f4f4f4\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,61)\"><rect y=\"0\" fill=\"#b7b7b7\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,71)\"><rect y=\"0\" fill=\"#f2f2f2\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,81)\"><rect y=\"0\" fill=\"#f5f5f5\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,91)\"><rect y=\"0\" fill=\"#f8f8f8\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,101)\"><rect y=\"0\" fill=\"#fcfcfc\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(61,111)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,1)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,11)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,21)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,31)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,41)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,51)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,61)\"><rect y=\"0\" fill=\"#fdfdfd\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,71)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,81)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,91)\"><rect y=\"0\" fill=\"#fefefe\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,101)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><g class=\"heatmapCell\" transform=\"translate(71,111)\"><rect y=\"0\" fill=\"#ffffff\" id=\"heatCell\" width=\"10\" height=\"10\"></rect></g><rect fill=\"none\" stroke=\"#000\" stroke-widtx=\"1px\" x=\"1\" y=\"1\" width=\"79\" height=\"119\"></rect></svg><svg y=\"175\" x=\"509\"><rect x=\"-1\" fill=\"#ffffff\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"0\" fill=\"#fefefe\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"1\" fill=\"#fdfdfd\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"2\" fill=\"#fbfbfb\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"3\" fill=\"#fafafa\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"4\" fill=\"#f9f9f9\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"5\" fill=\"#f8f8f8\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"6\" fill=\"#f7f7f7\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"7\" fill=\"#f5f5f5\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"8\" fill=\"#f4f4f4\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"9\" fill=\"#f3f3f3\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"10\" fill=\"#f2f2f2\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"11\" fill=\"#f0f0f0\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"12\" fill=\"#efefef\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"13\" fill=\"#eeeeee\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"14\" fill=\"#e9e9e9\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"15\" fill=\"#e4e4e4\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"16\" fill=\"#dfdfdf\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"17\" fill=\"#dbdbdb\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"18\" fill=\"#d6d6d6\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"19\" fill=\"#d1d1d1\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"20\" fill=\"#cccccc\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"21\" fill=\"#c7c7c7\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"22\" fill=\"#c2c2c2\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"23\" fill=\"#bdbdbd\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"24\" fill=\"#b9b9b9\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"25\" fill=\"#b4b4b4\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"26\" fill=\"#afafaf\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"27\" fill=\"#aaaaaa\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"28\" fill=\"#9f9f9f\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"29\" fill=\"#949494\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"30\" fill=\"#898989\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"31\" fill=\"#7e7e7e\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"32\" fill=\"#737373\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"33\" fill=\"#686868\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"34\" fill=\"#5e5e5e\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"35\" fill=\"#535353\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"36\" fill=\"#484848\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"37\" fill=\"#3d3d3d\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"38\" fill=\"#323232\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"39\" fill=\"#272727\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"40\" fill=\"#1c1c1c\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"41\" fill=\"#111111\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"42\" fill=\"#101010\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"43\" fill=\"#0f0f0f\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"44\" fill=\"#0d0d0d\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"45\" fill=\"#0c0c0c\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"46\" fill=\"#0b0b0b\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"47\" fill=\"#0a0a0a\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"48\" fill=\"#090909\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"49\" fill=\"#070707\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"50\" fill=\"#060606\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"51\" fill=\"#050505\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"52\" fill=\"#040404\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"53\" fill=\"#020202\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"54\" fill=\"#010101\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"55\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"56\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"57\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"58\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"59\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"60\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"61\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"62\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"63\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"64\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"65\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"66\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"67\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"68\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><rect x=\"69\" fill=\"#000000\" width=\"1\" height=\"15\" transform=\"translate(5,0)\"></rect><g class=\"axis\" transform=\"translate(5,15)\"><g style=\"opacity: 1; \" transform=\"translate(14,0)\"><line class=\"tick\" y2=\"0\" x2=\"0\"></line><text y=\"3\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">8,712</text></g><g style=\"opacity: 1; \" transform=\"translate(56,0)\"><line class=\"tick\" y2=\"0\" x2=\"0\"></line><text y=\"3\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">34,820</text></g><path class=\"domain\" d=\"M0,0V0H70V0\"></path></g></svg><svg y=\"284\" x=\"509\"><g class=\"heatmapCell\"><rect x=\"1\" y=\"30\" fill=\"#ffffff\" width=\"79\" height=\"0\"></rect><text x=\"75\" y=\"9\" dy=\"11px\" style=\"font-size: 11px; \" text-anchor=\"end\">Sales</text><polyline points=\"1,1 79,1 79,30 1,30 1,1\"></polyline></g></svg><svg y=\"40\" x=\"456\" id=\"vertLegend\" style=\"opacity: 0.01; \"><rect y=\"-1\" fill=\"#ffffff\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"0\" fill=\"#ffffff\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"1\" fill=\"#fefefe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"2\" fill=\"#fefefe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"3\" fill=\"#fefefe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"4\" fill=\"#fdfdfd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"5\" fill=\"#fdfdfd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"6\" fill=\"#fdfdfd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"7\" fill=\"#fdfdfd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"8\" fill=\"#fcfcfc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"9\" fill=\"#fcfcfc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"10\" fill=\"#fcfcfc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"11\" fill=\"#fbfbfb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"12\" fill=\"#fbfbfb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"13\" fill=\"#fbfbfb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"14\" fill=\"#fafafa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"15\" fill=\"#fafafa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"16\" fill=\"#fafafa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"17\" fill=\"#f9f9f9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"18\" fill=\"#f9f9f9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"19\" fill=\"#f9f9f9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"20\" fill=\"#f9f9f9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"21\" fill=\"#f8f8f8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"22\" fill=\"#f8f8f8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"23\" fill=\"#f8f8f8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"24\" fill=\"#f7f7f7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"25\" fill=\"#f7f7f7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"26\" fill=\"#f7f7f7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"27\" fill=\"#f6f6f6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"28\" fill=\"#f6f6f6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"29\" fill=\"#f6f6f6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"30\" fill=\"#f5f5f5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"31\" fill=\"#f5f5f5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"32\" fill=\"#f5f5f5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"33\" fill=\"#f5f5f5\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"34\" fill=\"#f4f4f4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"35\" fill=\"#f4f4f4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"36\" fill=\"#f4f4f4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"37\" fill=\"#f3f3f3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"38\" fill=\"#f3f3f3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"39\" fill=\"#f3f3f3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"40\" fill=\"#f2f2f2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"41\" fill=\"#f2f2f2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"42\" fill=\"#f2f2f2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"43\" fill=\"#f1f1f1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"44\" fill=\"#f1f1f1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"45\" fill=\"#f1f1f1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"46\" fill=\"#f1f1f1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"47\" fill=\"#f0f0f0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"48\" fill=\"#f0f0f0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"49\" fill=\"#f0f0f0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"50\" fill=\"#efefef\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"51\" fill=\"#efefef\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"52\" fill=\"#efefef\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"53\" fill=\"#eeeeee\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"54\" fill=\"#eeeeee\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"55\" fill=\"#ededed\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"56\" fill=\"#ececec\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"57\" fill=\"#ebebeb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"58\" fill=\"#e9e9e9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"59\" fill=\"#e8e8e8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"60\" fill=\"#e7e7e7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"61\" fill=\"#e6e6e6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"62\" fill=\"#e4e4e4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"63\" fill=\"#e3e3e3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"64\" fill=\"#e2e2e2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"65\" fill=\"#e1e1e1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"66\" fill=\"#dfdfdf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"67\" fill=\"#dedede\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"68\" fill=\"#dddddd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"69\" fill=\"#dcdcdc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"70\" fill=\"#dbdbdb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"71\" fill=\"#d9d9d9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"72\" fill=\"#d8d8d8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"73\" fill=\"#d7d7d7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"74\" fill=\"#d6d6d6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"75\" fill=\"#d4d4d4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"76\" fill=\"#d3d3d3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"77\" fill=\"#d2d2d2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"78\" fill=\"#d1d1d1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"79\" fill=\"#cfcfcf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"80\" fill=\"#cecece\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"81\" fill=\"#cdcdcd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"82\" fill=\"#cccccc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"83\" fill=\"#cbcbcb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"84\" fill=\"#c9c9c9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"85\" fill=\"#c8c8c8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"86\" fill=\"#c7c7c7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"87\" fill=\"#c6c6c6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"88\" fill=\"#c4c4c4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"89\" fill=\"#c3c3c3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"90\" fill=\"#c2c2c2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"91\" fill=\"#c1c1c1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"92\" fill=\"#bfbfbf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"93\" fill=\"#bebebe\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"94\" fill=\"#bdbdbd\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"95\" fill=\"#bcbcbc\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"96\" fill=\"#bbbbbb\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"97\" fill=\"#b9b9b9\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"98\" fill=\"#b8b8b8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"99\" fill=\"#b7b7b7\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"100\" fill=\"#b6b6b6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"101\" fill=\"#b4b4b4\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"102\" fill=\"#b3b3b3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"103\" fill=\"#b2b2b2\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"104\" fill=\"#b1b1b1\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"105\" fill=\"#afafaf\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"106\" fill=\"#aeaeae\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"107\" fill=\"#adadad\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"108\" fill=\"#acacac\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"109\" fill=\"#aaaaaa\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"110\" fill=\"#a8a8a8\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"111\" fill=\"#a6a6a6\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"112\" fill=\"#a3a3a3\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"113\" fill=\"#a0a0a0\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"114\" fill=\"#9d9d9d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"115\" fill=\"#9a9a9a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"116\" fill=\"#989898\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"117\" fill=\"#959595\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"118\" fill=\"#929292\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"119\" fill=\"#8f8f8f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"120\" fill=\"#8d8d8d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"121\" fill=\"#8a8a8a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"122\" fill=\"#878787\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"123\" fill=\"#848484\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"124\" fill=\"#828282\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"125\" fill=\"#7f7f7f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"126\" fill=\"#7c7c7c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"127\" fill=\"#797979\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"128\" fill=\"#767676\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"129\" fill=\"#747474\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"130\" fill=\"#717171\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"131\" fill=\"#6e6e6e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"132\" fill=\"#6b6b6b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"133\" fill=\"#696969\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"134\" fill=\"#666666\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"135\" fill=\"#636363\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"136\" fill=\"#606060\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"137\" fill=\"#5e5e5e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"138\" fill=\"#5b5b5b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"139\" fill=\"#585858\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"140\" fill=\"#555555\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"141\" fill=\"#525252\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"142\" fill=\"#505050\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"143\" fill=\"#4d4d4d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"144\" fill=\"#4a4a4a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"145\" fill=\"#474747\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"146\" fill=\"#454545\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"147\" fill=\"#424242\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"148\" fill=\"#3f3f3f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"149\" fill=\"#3c3c3c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"150\" fill=\"#393939\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"151\" fill=\"#373737\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"152\" fill=\"#343434\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"153\" fill=\"#313131\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"154\" fill=\"#2e2e2e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"155\" fill=\"#2c2c2c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"156\" fill=\"#292929\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"157\" fill=\"#262626\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"158\" fill=\"#232323\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"159\" fill=\"#212121\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"160\" fill=\"#1e1e1e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"161\" fill=\"#1b1b1b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"162\" fill=\"#181818\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"163\" fill=\"#151515\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"164\" fill=\"#131313\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"165\" fill=\"#111111\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"166\" fill=\"#111111\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"167\" fill=\"#101010\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"168\" fill=\"#101010\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"169\" fill=\"#101010\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"170\" fill=\"#0f0f0f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"171\" fill=\"#0f0f0f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"172\" fill=\"#0f0f0f\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"173\" fill=\"#0e0e0e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"174\" fill=\"#0e0e0e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"175\" fill=\"#0e0e0e\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"176\" fill=\"#0d0d0d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"177\" fill=\"#0d0d0d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"178\" fill=\"#0d0d0d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"179\" fill=\"#0d0d0d\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"180\" fill=\"#0c0c0c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"181\" fill=\"#0c0c0c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"182\" fill=\"#0c0c0c\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"183\" fill=\"#0b0b0b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"184\" fill=\"#0b0b0b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"185\" fill=\"#0b0b0b\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"186\" fill=\"#0a0a0a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"187\" fill=\"#0a0a0a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"188\" fill=\"#0a0a0a\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"189\" fill=\"#090909\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"190\" fill=\"#090909\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"191\" fill=\"#090909\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"192\" fill=\"#090909\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"193\" fill=\"#080808\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"194\" fill=\"#080808\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"195\" fill=\"#080808\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"196\" fill=\"#070707\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"197\" fill=\"#070707\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"198\" fill=\"#070707\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"199\" fill=\"#060606\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"200\" fill=\"#060606\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"201\" fill=\"#060606\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"202\" fill=\"#050505\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"203\" fill=\"#050505\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"204\" fill=\"#050505\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"205\" fill=\"#050505\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"206\" fill=\"#040404\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"207\" fill=\"#040404\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"208\" fill=\"#040404\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"209\" fill=\"#030303\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"210\" fill=\"#030303\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"211\" fill=\"#030303\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"212\" fill=\"#020202\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"213\" fill=\"#020202\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"214\" fill=\"#020202\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"215\" fill=\"#010101\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"216\" fill=\"#010101\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"217\" fill=\"#010101\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"218\" fill=\"#010101\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"219\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"220\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"221\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"222\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"223\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"224\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"225\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"226\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"227\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"228\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"229\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"230\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"231\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"232\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"233\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"234\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"235\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"236\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"237\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"238\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"239\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"240\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"241\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"242\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"243\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"244\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"245\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"246\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"247\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"248\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"249\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"250\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"251\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"252\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"253\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"254\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"255\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"256\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"257\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"258\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"259\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"260\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"261\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"262\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"263\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"264\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"265\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"266\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"267\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"268\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"269\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"270\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"271\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"272\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"273\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"274\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><rect y=\"275\" fill=\"#000000\" width=\"15\" height=\"1\" transform=\"translate(5,0)\"></rect><g class=\"axis\" transform=\"translate(22.5,0)\"><g style=\"opacity: 1; \" transform=\"translate(0,66.07142857142857)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">10,000</text></g><g style=\"opacity: 1; \" transform=\"translate(0,127.2039897039897)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">20,000</text></g><g style=\"opacity: 1; \" transform=\"translate(0,188.33655083655086)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">30,000</text></g><g style=\"opacity: 1; \" transform=\"translate(0,249.469111969112)\"><line class=\"tick\" x2=\"0\" y2=\"0\"></line><text x=\"3\" y=\"0\" dy=\".32em\" text-anchor=\"start\">40,000</text></g><path class=\"domain\" d=\"M0,5H0V271H0\"></path></g></svg></g></svg></div>\r\n",
"\r\n"
],
"output_type": "display_data"
},
{
"output_type": "pyout",
"prompt_number": 10,
"text": [
"True"
]
}
],
"prompt_number": 10
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"I often work with output from statistical packages and including more information in a cell also comes at little to no cost."
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"d3 = d3object(width=800,\n",
" height=400,\n",
" style='JFTable',\n",
" number=1,\n",
" d3=None,\n",
" title='Example table with d3js',\n",
" desc='An example table created created with d3js with data generated with Python.')\n",
"sRows=[['Long/Short Eq. Hedge',\n",
" 'FoF',\n",
" 'Not L/S nor FoF',\n",
" 'All',\n",
" 'Not FoFs',\n",
"]]\n",
"\n",
"sColumns=[\n",
" ['N',\n",
" 'Initial',\n",
" 'Average',\n",
" 'Incentive',\n",
" 'Management',\n",
" 'Median',\n",
" 'Mean [%]',\n",
" 'Std. dev.',\n",
" 'Skewness',\n",
" 'Kurtosis'\n",
" ],\n",
" [ '',\n",
" None,\n",
" 'AUM [M, USD]',\n",
" None,\n",
" 'Fees [%]',\n",
" None,\n",
" None,\n",
" None,\n",
" None,\n",
" 'Returns'\n",
" ]\n",
" ]\n",
"data=[[3452, 3, 22, 20.0, 1.5, 0.666, 0.656, 3.538, -0.1, 1.0],\n",
" [5791, 7, 22, 10.0, 1.5, 0.502, 0.27, 1.17, -0.9, 1.8],\n",
" [6718, 4, 23, 20.0, 1.5, 0.7, 0.637, 1.448, -0.2, 1.2],\n",
" [15961,5,23, 20.0, 1.5, 0.6, 0.467, 1.467, -0.4, 1.3],\n",
" [10170,4, 23, 20.0, 1.5, 0.69, 0.646, 2.633, -0.1, 1.1],\n",
" ]\n",
"dataAdd=[['', '', '', '', '', '', 0.015, '', '', 0.084],\n",
" ['', '', '', '', '', '', 0.016, '', '', 0.015],\n",
" ['', '', '', '', '', '', 0.024, '', '', 0.162],\n",
" ['', '', '', '', '', '', 0.058, '', '', 0.126],\n",
" ['', '', '', '', '', '', 0.093, '', '', 0.149],\n",
" ]\n",
"dataAdd=[dataAdd,[[i for i in j] for j in dataAdd]]\n",
"d3.precision=2\n",
"data=d3.convertVar(data)\n",
"d3.precision=4\n",
"d3.addSimpleTable( data, \n",
" dataAdd=dataAdd,\n",
" fontSizeCells=[12,10,10],\n",
" pVals=0,\n",
" sRows=sRows,\n",
" sColumns=sColumns,\n",
" sRowsMargins=[5,100,0],\n",
" sColsMargins=[5,20,10],\n",
" spacing=2,\n",
" addBorders=1,\n",
" addOutsideBorders=-1,\n",
" rectWidth=45,\n",
" rectHeight=0 \n",
" )\n",
"html=d3.render(mode=('show','html'))"
],
"language": "python",
"metadata": {},
"outputs": [
{
"html": [
"<style>\n",
"\n",
"\n",
" .d3Output{\n",
" min-height: 1.2em;\n",
" line-height: 1.2em;\n",
" position: relative;\n",
" font-size: 1em;\n",
" padding: 5px 0;\n",
" \n",
" list-style: none;\n",
" background: #fff;\n",
" color: #000;\n",
" }\n",
" svg{\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: geometricPrecision !important;\n",
" text-rendering: geometricPrecision !important;\n",
" }\n",
" .d3Output.header{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 0.9em;\n",
" \n",
" }\n",
" .d3Output.title{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 1.2em;\n",
" \n",
" }\n",
" .d3Output.description{\n",
" font-size: 0.8em;\n",
" text-align:justify;\n",
" text-justify:inter-word;\n",
" border-bottom: 1px solid #000;\n",
" }\n",
" .d3Output.description.panel{\n",
" text-align: center;\n",
" }\n",
" svg, canvas {\n",
" border-bottom: 1px solid #000;\n",
" display: block;\n",
" margin: 5px 0;\n",
" }\n",
" .d3Output.description.figure{\n",
" border-bottom: none;\n",
" }\n",
" \n",
"\n",
" .heatmapCell path, .heatmapCell line, .heatmapCell polyline, .d3Output polyline {\n",
" fill: none;\n",
" stroke-width: 1px;\n",
" stroke: black;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" .heatmapCell text, .heatmapCell rect, .d3Output rect {\n",
" font-size: 1em;\n",
" shape-rendering: crispEdges !important;\n",
" }\n",
" \n",
"#-tag-6864d580-59a9-11e2-a076-00268315e762{shape-rendering: crispEdges !important;}\n",
"</style>\r\n",
"<div class=\"d3Output header\" style=\"width: 800px;\">Table 1</div>\r\n",
"<div class=\"d3Output title\" style=\"width: 800px;\"> Example table with d3js</div>\r\n",
"<div class=\"d3Output description\" style=\"width: 800px\"> An example table created created with d3js with data generated with Python.</div>\r\n",
"<div id=\"id-6864ae6e-59a9-11e2-9c12-00268315e762\" class=\"d3Output\"><svg width=\"800\" height=\"400\" style=\"border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: black; \"><g id=\"svgElementid-6864ae6e-59a9-11e2-9c12-00268315e762-tag-6864d580-59a9-11e2-a076-00268315e762\" transform=\"translate(117.5,61)\"><svg class=\"heatmap\" y=\"0\" x=\"0\" id=\"heatmap\"><g class=\"heatmapCell\" transform=\"translate(110,40)\"><rect y=\"46\" fill=\"#49c8af\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3452</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(110,88)\"><rect y=\"46\" fill=\"#499eaf\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5791</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(110,136)\"><rect y=\"46\" fill=\"#548da7\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">6718</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(110,184)\"><rect y=\"46\" fill=\"#210f06\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">15961</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(110,232)\"><rect y=\"46\" fill=\"#694f6b\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10170</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(157,40)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(157,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">7</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(157,136)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(157,184)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">5</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(157,232)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">4</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(204,40)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">22</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(204,88)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">22</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(204,136)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">23</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(204,184)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">23</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(204,232)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">23</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(251,40)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">20</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(251,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">10</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(251,136)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">20</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(251,184)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">20</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(251,232)\"><rect y=\"46\" fill=\"#b8fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">20</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(298,40)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.5</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(298,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.5</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(298,136)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.5</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(298,184)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.5</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(298,232)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.5</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(345,40)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.67</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(345,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.5</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(345,136)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.7</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(345,184)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.6</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(345,232)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.69</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(392,40)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.66</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">&#x2605;&#x2605;</text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.015</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(392,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.27</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">&#x2605;&#x2605;</text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.016</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(392,136)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.64</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">&#x2605;&#x2605;</text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.024</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(392,184)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.47</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">&#x2605;</text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.058</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(392,232)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">0.65</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">&#x2605;</text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.093</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(439,40)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">3.54</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(439,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.17</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(439,136)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.45</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(439,184)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.47</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(439,232)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">2.63</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(486,40)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">-0.1</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(486,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">-0.9</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(486,136)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">-0.2</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(486,184)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">-0.4</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(486,232)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">-0.1</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(533,40)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">&#x2605;</text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.084</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(533,88)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.8</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">&#x2605;&#x2605;</text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.015</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(533,136)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.2</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.162</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(533,184)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.3</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.126</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(533,232)\"><rect y=\"46\" fill=\"#b9fb8a\" id=\"heatCell\" width=\"45\" height=\"0\"></rect><text x=\"40\" y=\"3\" id=\"heatText\" dy=\"12px\" style=\"font-size: 12px; \" text-anchor=\"end\">1.1</text><text x=\"40\" y=\"17\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\"></text><text x=\"40\" y=\"29\" dy=\"10px\" id=\"heatTextAdd\" style=\"font-size: 10px; \" text-anchor=\"end\">0.149</text><polyline points=\"0,0 45,0 45,46 0,46 0,0\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(110,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">N</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(157,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Initial</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(204,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Average</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(251,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Incentive</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(298,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Management</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(345,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Median</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(392,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Mean [%]</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(439,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Std. dev.</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(486,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Skewness</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(533,0)\"><text x=\"22.5\" y=\"30\" style=\"font-size: 9px; \" text-anchor=\"middle\">Kurtosis</text><polyline points=\"1.5,35 43.5,35\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(157,0)\"><text x=\"46\" y=\"10\" style=\"font-size: 9px; \" text-anchor=\"middle\">AUM [M, USD]</text><polyline points=\"1.5,15 90.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(251,0)\"><text x=\"46\" y=\"10\" style=\"font-size: 9px; \" text-anchor=\"middle\">Fees [%]</text><polyline points=\"1.5,15 90.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(345,0)\"><text x=\"116.5\" y=\"10\" style=\"font-size: 9px; \" text-anchor=\"middle\">Returns</text><polyline points=\"1.5,15 231.5,15\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,40)\"><text x=\"100\" y=\"27.5\" style=\"font-size: 9px; \" text-anchor=\"end\">Long/Short Eq. Hedge</text><polyline points=\"105,1.5 105,44.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,88)\"><text x=\"100\" y=\"27.5\" style=\"font-size: 9px; \" text-anchor=\"end\">FoF</text><polyline points=\"105,1.5 105,44.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,136)\"><text x=\"100\" y=\"27.5\" style=\"font-size: 9px; \" text-anchor=\"end\">Not L/S nor FoF</text><polyline points=\"105,1.5 105,44.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,184)\"><text x=\"100\" y=\"27.5\" style=\"font-size: 9px; \" text-anchor=\"end\">All</text><polyline points=\"105,1.5 105,44.5\"></polyline></g><g class=\"heatmapCell\" transform=\"translate(0,232)\"><text x=\"100\" y=\"27.5\" style=\"font-size: 9px; \" text-anchor=\"end\">Not FoFs</text><polyline points=\"105,1.5 105,44.5\"></polyline></g></svg></g></svg></div>\r\n",
"\r\n"
],
"output_type": "display_data"
}
],
"prompt_number": 11
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"##Figures\n",
"Of course you can draw nice figures as well!"
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"import numpy as np\n",
"d3 = d3object(width=800,\n",
" height=200,\n",
" style='JFFigure',\n",
" number=1,\n",
" d3=None,\n",
" precision=100,\n",
" title='Example figure with d3js',\n",
" desc='Standrad normal distribution')\n",
"\n",
"d3.addVar(\n",
"interpolation1='basis',\n",
"interpolation2='step-before',\n",
"resolution=80,\n",
"domainRange=[-4,4],\n",
"imposeMax=0\n",
")\n",
"\n",
"d3.addJs('''\n",
" var svg = d3.select(\"#\"+d3ObjId)\n",
" .append(\"svg\")\n",
" .attr(\"width\", width)\n",
" .attr(\"height\", height)\n",
" .append(\"g\").attr(\"id\", \"#\"+d3ObjId+'InnerG')\n",
"\n",
" // A formatter for counts.\n",
" var formatCount = d3.format(\",.0f\");\n",
" \n",
" var margin = {top: 10, right: 30, bottom: 30, left: 30},\n",
" width = width - margin.left - margin.right,\n",
" height = height - margin.top - margin.bottom;\n",
" \n",
" var x = d3.scale.linear()\n",
" //.domain(domainRange)\n",
" .range([0, width]);\n",
" \n",
" // Generate a histogram using twenty uniformly-spaced bins.\n",
" var xAxis = d3.svg.axis()\n",
" .ticks(4)\n",
" .scale(x)\n",
" .orient(\"bottom\");\n",
"\n",
" function appendHistogram(series, domainSeries, height, width, x_offset, y_offset, interpolation){\n",
" var svg2 = svg.append(\"g\")\n",
" y_offset=Math.round(y_offset)\n",
" height=Math.round(height)\n",
" height+=y_offset\n",
" width+=x_offset\n",
"\n",
" x.range([x_offset, width])\n",
" .domain(domainSeries)\n",
"\n",
" var data = d3.layout.histogram()\n",
" .bins(x.ticks(resolution))\n",
" .frequency(0)\n",
" (series);\n",
" \n",
" var seriesMax=d3.max([imposeMax, d3.max(data, function(d) { return d.y; })]);\n",
" var y = d3.scale.linear()\n",
" //.domain([0, d3.max(data, function(d) { return d.y; })])\n",
" .domain([0, seriesMax])\n",
" .range([height, y_offset]);\n",
" \n",
"\n",
" var area = d3.svg.area()\n",
" .interpolate(interpolation)\n",
" .x(function(d) { \n",
" if(interpolation==\"step-before\")\n",
" return x(d.x+d.dx/2)\n",
" return x(d.x); \n",
" })\n",
" .y0(height)\n",
" .y1(function(d) { return d3.max([y(d.y),y(seriesMax)]); });\n",
" \n",
" svg2.append(\"path\")\n",
" .datum(data)\n",
" .attr(\"class\", \"area\")\n",
" .attr(\"d\", area);\n",
" \n",
" svg2.append(\"g\")\n",
" .attr(\"class\", \"axis\")\n",
" .attr(\"transform\", \"translate(0,\" + height + \")\")\n",
" .call(xAxis);\n",
" \n",
" \n",
" }\n",
"\n",
"appendHistogram(data, domainRange, height, width/2-15, 10, 0, interpolation1)\n",
"appendHistogram(data, domainRange, height, width/2-15, width/2+20, 0, interpolation2)\n",
"''')\n",
"\n",
"d3.addCss('''\n",
" .polyline{\n",
" stroke: #000;\n",
" shape-rendering: crispEdges;\n",
" }\n",
" .area{\n",
" shape-rendering: geometricPrecision;\n",
" stroke: #000 !important;\n",
" stroke-width:1 !important;\n",
" fill: #ddd !important;\n",
" }\n",
" \n",
" .axis path, .axis line {\n",
" fill: none;\n",
" stroke: #000;\n",
" stroke-width: 1px;\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: crispEdges !important;\n",
" text-rendering: geometricPrecision !important; \n",
" \n",
" }\n",
"''')"
],
"language": "python",
"metadata": {},
"outputs": [],
"prompt_number": 12
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"E.g. dsitribution of standard normal. D3js allows for quick swtiching between histograms and approx. shape of the distribution.\n",
"\n",
"With too few observations:"
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"d3.addVar(data=np.random.randn(1000))\n",
"html=d3.render(mode=('show','html'))"
],
"language": "python",
"metadata": {},
"outputs": [
{
"html": [
"<style>\n",
"\n",
"\n",
" .d3Output{\n",
" min-height: 1.2em;\n",
" line-height: 1.2em;\n",
" position: relative;\n",
" font-size: 1em;\n",
" padding: 5px 0;\n",
" \n",
" list-style: none;\n",
" background: #fff;\n",
" color: #000;\n",
" }\n",
" svg{\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: geometricPrecision !important;\n",
" text-rendering: geometricPrecision !important;\n",
" }\n",
" .d3Output.header{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 0.9em;\n",
" \n",
" }\n",
" .d3Output.title{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 1.2em;\n",
" \n",
" }\n",
" .d3Output.description{\n",
" font-size: 0.8em;\n",
" text-align:justify;\n",
" text-justify:inter-word;\n",
" border-bottom: 1px solid #000;\n",
" }\n",
" .d3Output.description.panel{\n",
" text-align: center;\n",
" }\n",
" svg, canvas {\n",
" border-bottom: 1px solid #000;\n",
" display: block;\n",
" margin: 5px 0;\n",
" }\n",
" .d3Output.description.figure{\n",
" border-bottom: none;\n",
" }\n",
" \n",
"\n",
" .polyline{\n",
" stroke: #000;\n",
" shape-rendering: crispEdges;\n",
" }\n",
" .area{\n",
" shape-rendering: geometricPrecision;\n",
" stroke: #000 !important;\n",
" stroke-width:1 !important;\n",
" fill: #ddd !important;\n",
" }\n",
" \n",
" .axis path, .axis line {\n",
" fill: none;\n",
" stroke: #000;\n",
" stroke-width: 1px;\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: crispEdges !important;\n",
" text-rendering: geometricPrecision !important; \n",
" \n",
" }\n",
"\n",
"</style>\r\n",
"<div id=\"id-69c10a1e-59a9-11e2-b2c4-00268315e762\" class=\"d3Output\"><svg width=\"800\" height=\"200\"><g id=\"#id-69c10a1e-59a9-11e2-b2c4-00268315e762InnerG\"><g><path class=\"area\" d=\"M10,160C10,160,10,160,10.739583333333332,159.99999999999997C11.479166666666668,160,12.958333333333336,160,14.437500000000002,159.99999999999997C15.916666666666671,160,17.39583333333334,160,18.875000000000004,159.99999999999997C20.354166666666668,160,21.83333333333333,160,23.312499999999996,159.99999999999997C24.791666666666657,160,26.27083333333333,160,27.749999999999993,159.99999999999997C29.229166666666664,160,30.70833333333333,160,32.1875,159.99999999999997C33.666666666666664,160,35.14583333333333,160,36.625,158.86524822695034C38.104166666666664,157.73049645390068,39.583333333333336,155.46099290780143,41.0625,155.4609929078014C42.54166666666667,155.46099290780143,44.02083333333333,157.73049645390068,45.49999999999999,158.86524822695034C46.97916666666666,160,48.45833333333332,160,49.937499999999986,159.99999999999997C51.41666666666666,160,52.89583333333333,160,54.375,159.99999999999997C55.85416666666667,160,57.333333333333336,160,58.8125,159.99999999999997C60.29166666666667,160,61.77083333333334,160,63.25000000000001,158.86524822695034C64.72916666666667,157.73049645390068,66.20833333333334,155.46099290780143,67.6875,154.32624113475177C69.16666666666666,153.1914893617021,70.64583333333333,153.1914893617021,72.125,153.19148936170214C73.60416666666666,153.1914893617021,75.08333333333333,153.1914893617021,76.5625,153.19148936170214C78.04166666666666,153.1914893617021,79.52083333333333,153.1914893617021,81,152.05673758865248C82.47916666666667,150.92198581560285,83.95833333333334,148.65248226950354,85.4375,147.5177304964539C86.91666666666667,146.38297872340428,88.39583333333333,146.38297872340428,89.875,147.5177304964539C91.35416666666666,148.65248226950354,92.83333333333333,150.92198581560285,94.31249999999999,150.354609929078C95.79166666666666,149.7872340425532,97.27083333333333,146.38297872340428,98.75,142.97872340425533C100.22916666666666,139.5744680851064,101.70833333333331,136.17021276595744,103.18749999999999,135.60283687943263C104.66666666666666,135.03546099290782,106.14583333333333,137.3049645390071,107.62499999999999,138.43971631205673C109.10416666666666,139.5744680851064,110.58333333333331,139.5744680851064,112.06249999999997,135.60283687943263C113.54166666666664,131.63120567375887,115.02083333333331,123.68794326241135,116.49999999999999,115.74468085106383C117.97916666666666,107.80141843971631,119.45833333333333,99.8581560283688,120.93749999999999,96.45390070921985C122.41666666666666,93.04964539007092,123.89583333333333,94.18439716312056,125.375,99.29078014184398C126.85416666666666,104.39716312056738,128.33333333333331,113.47517730496455,129.8125,112.3404255319149C131.29166666666666,111.20567375886526,132.77083333333331,99.8581560283688,134.25,97.0212765957447C135.72916666666666,94.18439716312056,137.20833333333331,99.8581560283688,138.6875,100.99290780141844C140.16666666666666,102.12765957446808,141.64583333333331,98.72340425531915,143.125,85.67375886524825C144.60416666666666,72.62411347517731,146.08333333333331,49.929078014184405,147.5625,40.28368794326242C149.04166666666666,30.63829787234043,150.52083333333331,34.04255319148937,152,38.01418439716313C153.47916666666666,41.98581560283688,154.95833333333331,46.52482269503546,156.4375,45.95744680851064C157.91666666666666,45.39007092198581,159.39583333333331,39.716312056737586,160.875,36.87943262411347C162.35416666666666,34.04255319148936,163.83333333333331,34.04255319148936,165.31249999999997,36.87943262411347C166.79166666666666,39.716312056737586,168.27083333333331,45.39007092198581,169.75,41.98581560283688C171.22916666666666,38.58156028368794,172.70833333333331,26.099290780141846,174.1875,26.099290780141846C175.66666666666666,26.099290780141846,177.14583333333331,38.58156028368794,178.62499999999997,36.87943262411348C180.10416666666666,35.177304964539,181.58333333333331,19.290780141843957,183.0625,10.780141843971617C184.54166666666666,2.269503546099277,186.02083333333331,1.1347517730496386,187.5,7.943262411347513C188.97916666666666,14.751773049645388,190.45833333333331,29.503546099290777,191.93749999999997,30.63829787234042C193.41666666666663,31.773049645390063,194.89583333333331,19.29078014184396,196.375,17.588652482269495C197.85416666666666,15.886524822695026,199.33333333333331,24.964539007092192,200.8125,30.0709219858156C202.29166666666669,35.177304964539005,203.77083333333334,36.312056737588655,205.25,36.312056737588655C206.72916666666669,36.312056737588655,208.20833333333331,35.177304964539005,209.6875,32.90780141843972C211.16666666666663,30.638297872340424,212.64583333333331,27.23404255319149,214.12499999999994,32.34042553191489C215.60416666666663,37.4468085106383,217.08333333333331,51.06382978723404,218.56249999999997,61.27659574468085C220.04166666666663,71.48936170212767,221.52083333333331,78.29787234042553,223,74.8936170212766C224.47916666666666,71.48936170212767,225.95833333333331,57.87234042553192,227.4375,61.843971631205676C228.91666666666666,65.81560283687944,230.39583333333331,87.3758865248227,231.87499999999997,95.88652482269504C233.35416666666663,104.39716312056738,234.8333333333333,99.8581560283688,236.31249999999994,102.69503546099291C237.79166666666663,105.53191489361703,239.27083333333331,115.74468085106383,240.75,118.01418439716312C242.22916666666666,120.28368794326241,243.70833333333331,114.60992907801419,245.1875,110.0709219858156C246.66666666666666,105.53191489361703,248.14583333333334,102.12765957446808,249.625,103.26241134751774C251.10416666666669,104.39716312056738,252.58333333333334,110.07092198581562,254.0625,115.17730496453902C255.54166666666666,120.28368794326242,257.0208333333333,124.822695035461,258.5,128.22695035460993C259.97916666666663,131.63120567375887,261.4583333333333,133.9007092198582,262.9375,135.03546099290782C264.41666666666663,136.17021276595747,265.8958333333333,136.17021276595747,267.375,135.60283687943266C268.85416666666663,135.03546099290782,270.3333333333333,133.9007092198582,271.8125,135.03546099290782C273.29166666666663,136.17021276595744,274.7708333333333,139.5744680851064,276.25,141.84397163120568C277.72916666666663,144.11347517730496,279.2083333333333,145.24822695035462,280.6875,147.5177304964539C282.16666666666663,149.7872340425532,283.6458333333333,153.1914893617021,285.125,153.75886524822693C286.60416666666663,154.32624113475177,288.0833333333333,152.05673758865248,289.5625,152.05673758865248C291.04166666666663,152.05673758865248,292.5208333333333,154.32624113475177,294,154.89361702127658C295.47916666666663,155.46099290780143,296.9583333333333,154.32624113475177,298.4375,154.32624113475177C299.91666666666663,154.32624113475177,301.3958333333333,155.46099290780143,302.875,156.02836879432624C304.35416666666663,156.59574468085106,305.8333333333333,156.59574468085106,307.3125,157.16312056737587C308.79166666666663,157.73049645390068,310.2708333333333,158.86524822695034,311.75,158.86524822695034C313.22916666666663,158.86524822695034,314.7083333333333,157.73049645390068,316.1875,157.73049645390068C317.66666666666663,157.73049645390068,319.1458333333333,158.86524822695034,320.625,159.43262411347516C322.10416666666663,160,323.5833333333333,160,325.0625,159.43262411347516C326.54166666666663,158.86524822695034,328.0208333333333,157.73049645390068,329.5,157.73049645390068C330.97916666666663,157.73049645390068,332.4583333333333,158.86524822695034,333.9375,159.43262411347516C335.41666666666663,160,336.8958333333333,160,338.375,159.99999999999997C339.85416666666663,160,341.3333333333333,160,342.8125,159.99999999999997C344.29166666666663,160,345.7708333333333,160,347.25,159.99999999999997C348.72916666666663,160,350.2083333333333,160,351.6875,159.99999999999997C353.16666666666663,160,354.6458333333333,160,356.125,159.43262411347516C357.60416666666663,158.86524822695034,359.0833333333333,157.73049645390068,359.8229166666667,157.16312056737587C360.5625,156.59574468085106,360.5625,156.59574468085106,360.5625,156.59574468085106L360.5625,160C360.5625,160,360.5625,160,359.8229166666667,159.99999999999997C359.0833333333333,160,357.60416666666663,160,356.12499999999994,159.99999999999997C354.6458333333333,160,353.16666666666663,160,351.6875,159.99999999999997C350.2083333333333,160,348.72916666666663,160,347.25,159.99999999999997C345.7708333333333,160,344.29166666666663,160,342.81249999999994,159.99999999999997C341.3333333333333,160,339.85416666666663,160,338.375,159.99999999999997C336.8958333333333,160,335.41666666666663,160,333.9375,159.99999999999997C332.4583333333333,160,330.97916666666663,160,329.49999999999994,159.99999999999997C328.0208333333333,160,326.54166666666663,160,325.0625,159.99999999999997C323.5833333333333,160,322.10416666666663,160,320.625,159.99999999999997C319.1458333333333,160,317.66666666666663,160,316.18749999999994,159.99999999999997C314.7083333333333,160,313.22916666666663,160,311.75,159.99999999999997C310.2708333333333,160,308.79166666666663,160,307.3125,159.99999999999997C305.8333333333333,160,304.35416666666663,160,302.875,159.99999999999997C301.3958333333333,160,299.91666666666663,160,298.4375,159.99999999999997C296.9583333333333,160,295.47916666666663,160,294,159.99999999999997C292.5208333333333,160,291.04166666666663,160,289.5625,159.99999999999997C288.0833333333333,160,286.60416666666663,160,285.125,159.99999999999997C283.6458333333333,160,282.16666666666663,160,280.6875,159.99999999999997C279.2083333333333,160,277.72916666666663,160,276.25,159.99999999999997C274.7708333333333,160,273.29166666666663,160,271.8125,159.99999999999997C270.3333333333333,160,268.85416666666663,160,267.375,159.99999999999997C265.8958333333333,160,264.41666666666663,160,262.9375,159.99999999999997C261.4583333333333,160,259.97916666666663,160,258.5,159.99999999999997C257.0208333333333,160,255.54166666666666,160,254.0625,159.99999999999997C252.58333333333334,160,251.10416666666669,160,249.625,159.99999999999997C248.14583333333334,160,246.66666666666666,160,245.1875,159.99999999999997C243.70833333333331,160,242.22916666666666,160,240.74999999999997,159.99999999999997C239.27083333333331,160,237.79166666666663,160,236.31249999999994,159.99999999999997C234.8333333333333,160,233.35416666666663,160,231.87499999999997,159.99999999999997C230.39583333333331,160,228.91666666666666,160,227.43749999999997,159.99999999999997C225.95833333333331,160,224.47916666666666,160,223,159.99999999999997C221.52083333333331,160,220.04166666666663,160,218.56249999999997,159.99999999999997C217.08333333333331,160,215.60416666666663,160,214.12499999999997,159.99999999999997C212.64583333333331,160,211.16666666666663,160,209.6875,159.99999999999997C208.20833333333331,160,206.72916666666669,160,205.25,159.99999999999997C203.77083333333334,160,202.29166666666669,160,200.8125,159.99999999999997C199.33333333333331,160,197.85416666666666,160,196.375,159.99999999999997C194.89583333333331,160,193.41666666666663,160,191.93749999999997,159.99999999999997C190.45833333333331,160,188.97916666666666,160,187.49999999999997,159.99999999999997C186.02083333333331,160,184.54166666666666,160,183.0625,159.99999999999997C181.58333333333331,160,180.10416666666666,160,178.625,159.99999999999997C177.14583333333331,160,175.66666666666666,160,174.1875,159.99999999999997C172.70833333333331,160,171.22916666666666,160,169.75,159.99999999999997C168.27083333333331,160,166.79166666666666,160,165.3125,159.99999999999997C163.83333333333331,160,162.35416666666666,160,160.875,159.99999999999997C159.39583333333331,160,157.91666666666666,160,156.4375,159.99999999999997C154.95833333333331,160,153.47916666666666,160,152,159.99999999999997C150.52083333333331,160,149.04166666666666,160,147.5625,159.99999999999997C146.08333333333331,160,144.60416666666666,160,143.125,159.99999999999997C141.64583333333331,160,140.16666666666666,160,138.6875,159.99999999999997C137.20833333333331,160,135.72916666666666,160,134.25,159.99999999999997C132.77083333333331,160,131.29166666666666,160,129.8125,159.99999999999997C128.33333333333331,160,126.85416666666666,160,125.375,159.99999999999997C123.89583333333333,160,122.41666666666666,160,120.9375,159.99999999999997C119.45833333333333,160,117.97916666666666,160,116.49999999999999,159.99999999999997C115.02083333333331,160,113.54166666666664,160,112.06249999999997,159.99999999999997C110.58333333333331,160,109.10416666666666,160,107.625,159.99999999999997C106.14583333333333,160,104.66666666666666,160,103.18749999999999,159.99999999999997C101.70833333333331,160,100.22916666666666,160,98.75,159.99999999999997C97.27083333333333,160,95.79166666666666,160,94.3125,159.99999999999997C92.83333333333333,160,91.35416666666666,160,89.875,159.99999999999997C88.39583333333333,160,86.91666666666667,160,85.4375,159.99999999999997C83.95833333333334,160,82.47916666666667,160,81.00000000000001,159.99999999999997C79.52083333333333,160,78.04166666666666,160,76.56249999999999,159.99999999999997C75.08333333333333,160,73.60416666666666,160,72.125,159.99999999999997C70.64583333333333,160,69.16666666666666,160,67.6875,159.99999999999997C66.20833333333334,160,64.72916666666667,160,63.25000000000001,159.99999999999997C61.77083333333334,160,60.29166666666667,160,58.8125,159.99999999999997C57.333333333333336,160,55.85416666666667,160,54.375,159.99999999999997C52.89583333333333,160,51.41666666666666,160,49.937499999999986,159.99999999999997C48.45833333333332,160,46.97916666666666,160,45.49999999999999,159.99999999999997C44.02083333333333,160,42.54166666666667,160,41.0625,159.99999999999997C39.583333333333336,160,38.104166666666664,160,36.625,159.99999999999997C35.14583333333333,160,33.666666666666664,160,32.1875,159.99999999999997C30.70833333333333,160,29.229166666666664,160,27.749999999999993,159.99999999999997C26.27083333333333,160,24.791666666666657,160,23.312499999999996,159.99999999999997C21.83333333333333,160,20.354166666666668,160,18.875000000000004,159.99999999999997C17.39583333333334,160,15.916666666666671,160,14.437500000000002,159.99999999999997C12.958333333333336,160,11.479166666666668,160,10.739583333333332,159.99999999999997C10,160,10,160,9.999999999999998,159.99999999999997Z\"></path><g class=\"axis\" transform=\"translate(0,160)\"><g style=\"opacity: 1; \" transform=\"translate(10,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-4</text></g><g style=\"opacity: 1; \" transform=\"translate(98.75,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-2</text></g><g style=\"opacity: 1; \" transform=\"translate(187.5,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">0</text></g><g style=\"opacity: 1; \" transform=\"translate(276.25,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">2</text></g><g style=\"opacity: 1; \" transform=\"translate(365,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">4</text></g><path class=\"domain\" d=\"M10,6V0H365V6\"></path></g></g><g><path class=\"area\" d=\"M392.21875,160V160H396.65625V160H401.09375V160H405.53125V160H409.96875V160H414.40625V160H418.84375V153.19148936170214H423.28125V160H427.71875V160H432.15625V160H436.59375V160H441.03125V160H445.46875V153.19148936170214H449.90625V153.19148936170214H454.34375V153.19148936170214H458.78125V153.19148936170214H463.21875V146.38297872340428H467.65625V146.38297872340428H472.09375V153.19148936170214H476.53125V142.97872340425533H480.96875V132.76595744680853H485.40625V139.5744680851064H489.84375V139.5744680851064H494.28125V115.74468085106385H498.71875V91.91489361702128H503.15625V95.31914893617022H507.59375V122.55319148936172H512.03125V88.51063829787235H516.46875V105.53191489361703H520.90625V95.31914893617022H525.34375V27.2340425531915H529.78125V37.446808510638306H534.21875V51.06382978723404H538.65625V34.04255319148936H543.09375V34.04255319148936H547.53125V51.06382978723404H551.96875V13.61702127659575H556.40625V51.06382978723404H560.84375V3.404255319148916H565.28125V0H569.71875V44.25531914893617H574.15625V6.808510638297861H578.59375V34.04255319148936H583.03125V37.446808510638306H587.46875V34.04255319148936H591.90625V23.829787234042556H596.34375V64.68085106382979H600.78125V85.10638297872342H605.21875V44.25531914893617H609.65625V108.93617021276597H614.09375V95.31914893617022H618.53125V125.95744680851065H622.96875V108.93617021276597H627.40625V98.72340425531917H631.84375V115.74468085106385H636.28125V129.36170212765958H640.71875V136.17021276595747H645.15625V136.17021276595747H649.59375V132.76595744680853H654.03125V142.97872340425533H658.46875V146.38297872340428H662.90625V156.59574468085106H667.34375V149.7872340425532H671.78125V156.59574468085106H676.21875V153.19148936170214H680.65625V156.59574468085106H685.09375V156.59574468085106H689.53125V160H693.96875V156.59574468085106H698.40625V160H702.84375V160H707.28125V156.59574468085106H711.71875V160H716.15625V160H720.59375V160H725.03125V160H729.46875V160H733.90625V160H738.34375V156.59574468085106H742.78125L742.78125,160H738.34375V160H733.90625V160H729.46875V160H725.03125V160H720.59375V160H716.15625V160H711.71875V160H707.28125V160H702.84375V160H698.40625V160H693.96875V160H689.53125V160H685.09375V160H680.65625V160H676.21875V160H671.78125V160H667.34375V160H662.90625V160H658.46875V160H654.03125V160H649.59375V160H645.15625V160H640.71875V160H636.28125V160H631.84375V160H627.40625V160H622.96875V160H618.53125V160H614.09375V160H609.65625V160H605.21875V160H600.78125V160H596.34375V160H591.90625V160H587.46875V160H583.03125V160H578.59375V160H574.15625V160H569.71875V160H565.28125V160H560.84375V160H556.40625V160H551.96875V160H547.53125V160H543.09375V160H538.65625V160H534.21875V160H529.78125V160H525.34375V160H520.90625V160H516.46875V160H512.03125V160H507.59375V160H503.15625V160H498.71875V160H494.28125V160H489.84375V160H485.40625V160H480.96875V160H476.53125V160H472.09375V160H467.65625V160H463.21875V160H458.78125V160H454.34375V160H449.90625V160H445.46875V160H441.03125V160H436.59375V160H432.15625V160H427.71875V160H423.28125V160H418.84375V160H414.40625V160H409.96875V160H405.53125V160H401.09375V160H396.65625V160H392.21875V160Z\"></path><g class=\"axis\" transform=\"translate(0,160)\"><g style=\"opacity: 1; \" transform=\"translate(390,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-4</text></g><g style=\"opacity: 1; \" transform=\"translate(478.75,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-2</text></g><g style=\"opacity: 1; \" transform=\"translate(567.5,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">0</text></g><g style=\"opacity: 1; \" transform=\"translate(656.25,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">2</text></g><g style=\"opacity: 1; \" transform=\"translate(745,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">4</text></g><path class=\"domain\" d=\"M390,6V0H745V6\"></path></g></g></g></svg></div>\r\n",
"<div class=\"d3Output description figure\" style=\"width: 800px\">\r\n",
" <b>Figure 1. Example figure with d3js.</b> Standrad normal distribution</div>\r\n",
" \r\n",
"\r\n"
],
"output_type": "display_data"
}
],
"prompt_number": 13
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"And with just enough:"
]
},
{
"cell_type": "code",
"collapsed": false,
"input": [
"d3.addVar(data=np.random.randn(300000))\n",
"html=d3.render(mode=('show','html'))"
],
"language": "python",
"metadata": {},
"outputs": [
{
"html": [
"<style>\n",
"\n",
"\n",
" .d3Output{\n",
" min-height: 1.2em;\n",
" line-height: 1.2em;\n",
" position: relative;\n",
" font-size: 1em;\n",
" padding: 5px 0;\n",
" \n",
" list-style: none;\n",
" background: #fff;\n",
" color: #000;\n",
" }\n",
" svg{\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: geometricPrecision !important;\n",
" text-rendering: geometricPrecision !important;\n",
" }\n",
" .d3Output.header{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 0.9em;\n",
" \n",
" }\n",
" .d3Output.title{\n",
" text-align: center;\n",
" font-weight: bold;\n",
" border-bottom: none;\n",
" font-size: 1.2em;\n",
" \n",
" }\n",
" .d3Output.description{\n",
" font-size: 0.8em;\n",
" text-align:justify;\n",
" text-justify:inter-word;\n",
" border-bottom: 1px solid #000;\n",
" }\n",
" .d3Output.description.panel{\n",
" text-align: center;\n",
" }\n",
" svg, canvas {\n",
" border-bottom: 1px solid #000;\n",
" display: block;\n",
" margin: 5px 0;\n",
" }\n",
" .d3Output.description.figure{\n",
" border-bottom: none;\n",
" }\n",
" \n",
"\n",
" .polyline{\n",
" stroke: #000;\n",
" shape-rendering: crispEdges;\n",
" }\n",
" .area{\n",
" shape-rendering: geometricPrecision;\n",
" stroke: #000 !important;\n",
" stroke-width:1 !important;\n",
" fill: #ddd !important;\n",
" }\n",
" \n",
" .axis path, .axis line {\n",
" fill: none;\n",
" stroke: #000;\n",
" stroke-width: 1px;\n",
" color-rendering: optimizeQuality !important;\n",
" shape-rendering: crispEdges !important;\n",
" text-rendering: geometricPrecision !important; \n",
" \n",
" }\n",
"\n",
"</style>\r\n",
"<div id=\"id-69c10a1e-59a9-11e2-b2c4-00268315e762\" class=\"d3Output\"><svg width=\"800\" height=\"200\"><g id=\"#id-69c10a1e-59a9-11e2-b2c4-00268315e762InnerG\"><g><path class=\"area\" d=\"M10,159.7475712031886C10,159.7475712031886,10,159.7475712031886,10.739583333333332,159.78299980624985C11.479166666666668,159.8184284093111,12.958333333333336,159.8892856154336,14.437500000000002,159.9136427800382C15.916666666666671,159.93799994464283,17.39583333333334,159.91585706772955,18.875000000000004,159.87599988928565C20.354166666666668,159.83614271084173,21.83333333333333,159.7785712308672,23.312499999999996,159.74314262780595C24.791666666666657,159.7077140247447,26.27083333333333,159.69442829859673,27.749999999999993,159.6700711339921C29.229166666666664,159.64571396938751,30.70833333333333,159.61028536632625,32.1875,159.57485676326502C33.666666666666664,159.53942816020376,35.14583333333333,159.50399955714252,36.625,159.4552852279333C38.104166666666664,159.4065708987241,39.583333333333336,159.3445708433669,41.0625,159.2161421572699C42.54166666666667,159.0877134711729,44.02083333333333,158.89285615433602,45.49999999999999,158.74892745439968C46.97916666666666,158.6049987544634,48.45833333333332,158.5119986714276,49.937499999999986,158.37249854687394C51.41666666666666,158.2329984223203,52.89583333333333,158.04699825624874,54.375,157.94071244706498C55.85416666666667,157.83442663788122,57.333333333333336,157.8078551855853,58.8125,157.59085499183516C60.29166666666667,157.373854798085,61.77083333333334,156.96642586288067,63.25000000000001,156.4305682415793C64.72916666666667,155.89471062027795,66.20833333333334,155.23042431287956,67.6875,154.77649533615735C69.16666666666666,154.32256635943511,70.64583333333333,154.07899471338905,72.125,153.72028010739393C73.60416666666666,153.36156550139881,75.08333333333333,152.88770793545464,76.5625,152.2832073957221C78.04166666666666,151.67870685598956,79.52083333333333,150.94356334246862,81,149.9559910321363C82.47916666666667,148.968418721804,83.95833333333334,147.7284176146603,85.4375,146.80727393506783C86.91666666666667,145.88613025547534,88.39583333333333,145.28384400343413,89.875,144.36270032384164C91.35416666666666,143.44155664424915,92.83333333333333,142.20155553710543,94.31249999999999,140.85969719616062C95.79166666666666,139.5178388552158,97.27083333333333,138.07412328046993,98.75,136.53297904730562C100.22916666666666,134.99183481414127,101.70833333333331,133.35326192255852,103.18749999999999,131.5906889202615C104.66666666666666,129.82811591796448,106.14583333333333,127.9415428049532,107.62499999999999,126.09482687038596C109.10416666666666,124.24811093581872,110.58333333333331,122.4412521796955,112.06249999999997,120.1871073099241C113.54166666666664,117.93296244015274,115.02083333333331,115.2315314567332,116.49999999999999,112.38395748568604C117.97916666666666,109.53638351463889,119.45833333333333,106.54266655596413,120.93749999999999,103.74602120181736C122.41666666666666,100.94937584767057,123.89583333333333,98.34980209805177,125.375,95.7457997730498C126.85416666666666,93.14179744804783,128.33333333333331,90.53336654766268,129.8125,87.77657837195852C131.29166666666666,85.01979019625438,132.77083333333331,82.1146447452312,134.25,78.57621301448803C135.72916666666666,75.03778128374488,137.20833333333331,70.86606327328172,138.6875,67.5623460378194C140.16666666666666,64.25862880235708,141.64583333333331,61.822912341895574,143.125,58.63876664176499C144.60416666666666,55.4546209416344,146.08333333333331,51.522046001834745,147.5625,48.03675717568347C149.04166666666666,44.55146834953219,150.52083333333331,41.5134656370293,152,38.64374878906738C153.47916666666666,35.77403194110546,154.95833333333331,33.07260095768452,156.4375,30.579313017248477C157.91666666666666,28.08602507681243,159.39583333333331,25.800880179361286,160.875,23.25444933433335C162.35416666666666,20.70801848930542,163.83333333333331,17.9003016967007,165.31249999999997,15.522156716213747C166.79166666666666,13.14401173572679,168.27083333333331,11.195438567357598,169.75,10.156937640124468C171.22916666666666,9.118436712891338,172.70833333333331,8.990008026794271,174.1875,8.026792881066314C175.66666666666666,7.063577735338356,177.14583333333331,5.265576129979507,178.62499999999997,3.872789172133792C180.10416666666666,2.4800022142880773,181.58333333333331,1.4924299039554965,183.0625,0.9145008165187201C184.54166666666666,0.3365717290819437,186.02083333333331,0.16828586454097186,187.5,0.682000608929215C188.97916666666666,1.195715353317458,190.45833333333331,2.391430706634916,191.93749999999997,3.3590744277455302C193.41666666666663,4.326718148856145,194.89583333333331,5.066290237759915,196.375,5.898862409699484C197.85416666666666,6.731434581639054,199.33333333333331,7.657006836614423,200.8125,9.472722743503908C202.29166666666669,11.288438650393392,203.77083333333334,13.994298209196993,205.25,16.50972902654633C206.72916666666669,19.025159843895665,208.20833333333331,21.350161919790736,209.6875,23.4891638296142C211.16666666666663,25.628165739437662,212.64583333333331,27.581167483189517,214.12499999999994,30.45088433115143C215.60416666666663,33.32060117911334,217.08333333333331,37.10703313128531,218.56249999999997,40.32217885909449C220.04166666666663,43.53732458690368,221.52083333333331,46.18118409035007,223,49.30554402281477C224.47916666666666,52.429903955279485,225.95833333333331,56.034764316762505,227.4375,59.41376733373C228.91666666666666,62.79277035069751,230.39583333333331,65.9459160231495,231.87499999999997,68.86434720032064C233.35416666666663,71.78277837749178,234.8333333333333,74.4664950593821,236.31249999999994,77.61964073183408C237.79166666666663,80.77278640428605,239.27083333333331,84.3953610672997,240.75,87.45329236902455C242.22916666666666,90.51122367074939,243.70833333333331,93.00451161118545,245.1875,95.75465692381502C246.66666666666666,98.5048022364446,248.14583333333334,101.51180492126772,249.625,104.43023609843755C251.10416666666669,107.34866727560735,252.58333333333334,110.17852694512388,254.0625,112.76702925628571C255.54166666666666,115.35553156744754,257.0208333333333,117.70267652025467,258.5,119.83503556700305C259.97916666666663,121.96739461375141,261.4583333333333,123.88496775444102,262.9375,125.73389797669957C264.41666666666663,127.58282819895811,265.8958333333333,129.3631155027856,267.375,131.14561709430455C268.85416666666663,132.9281186858235,270.3333333333333,134.71283456503392,271.8125,136.25176451050694C273.29166666666663,137.79069445597995,274.7708333333333,139.08383846771554,276.25,140.38141105483376C277.72916666666663,141.67898364195202,279.2083333333333,142.9809848044529,280.6875,144.0770572116603C282.16666666666663,145.17312961886768,283.6458333333333,146.06327327078156,285.125,147.11727421185375C286.60416666666663,148.1712751529259,288.0833333333333,149.38913338315632,289.5625,150.2615627335396C291.04166666666663,151.13399208392283,292.5208333333333,151.66099255445891,294,152.1503501342424C295.47916666666663,152.6397077140259,296.9583333333333,153.09142240305678,298.4375,153.58077998284026C299.91666666666663,154.07013756262373,301.3958333333333,154.59713803315978,302.875,155.06213844833866C304.35416666666663,155.5271388635175,305.8333333333333,155.93013922333918,307.3125,156.33978244623486C308.79166666666663,156.74942566913052,310.2708333333333,157.16571175510018,311.75,157.44028342882487C313.22916666666663,157.71485510254954,314.7083333333333,157.84771236402923,316.1875,157.99828392703952C317.66666666666663,158.1488554900498,319.1458333333333,158.31714135459075,320.625,158.4787843560577C322.10416666666663,158.64042735752463,323.5833333333333,158.79542749591758,325.0625,158.8906418666447C326.54166666666663,158.9858562373718,328.0208333333333,159.02128484043305,329.5,159.09435633424687C330.97916666666663,159.16742782806068,332.4583333333333,159.27814221262707,333.9375,159.33792798029293C335.41666666666663,159.3977137479588,336.8958333333333,159.4065708987241,338.375,159.459713803316C339.85416666666663,159.51285670790784,341.3333333333333,159.61028536632628,342.8125,159.6744997093748C344.29166666666663,159.7387140524233,345.7708333333333,159.7697140801019,347.25,159.78299980624988C348.72916666666663,159.7962855323978,350.2083333333333,159.79185695701517,351.6875,159.80735697085444C353.16666666666663,159.82285698469374,354.6458333333333,159.858285587755,356.125,159.858285587755C357.60416666666663,159.858285587755,359.0833333333333,159.82285698469374,359.8229166666667,159.80514268316313C360.5625,159.78742838163248,360.5625,159.78742838163248,360.5625,159.7874283816325L360.5625,160C360.5625,160,360.5625,160,359.8229166666667,159.99999999999997C359.0833333333333,160,357.60416666666663,160,356.12499999999994,159.99999999999997C354.6458333333333,160,353.16666666666663,160,351.6875,159.99999999999997C350.2083333333333,160,348.72916666666663,160,347.25,159.99999999999997C345.7708333333333,160,344.29166666666663,160,342.81249999999994,159.99999999999997C341.3333333333333,160,339.85416666666663,160,338.375,159.99999999999997C336.8958333333333,160,335.41666666666663,160,333.9375,159.99999999999997C332.4583333333333,160,330.97916666666663,160,329.49999999999994,159.99999999999997C328.0208333333333,160,326.54166666666663,160,325.0625,159.99999999999997C323.5833333333333,160,322.10416666666663,160,320.625,159.99999999999997C319.1458333333333,160,317.66666666666663,160,316.18749999999994,159.99999999999997C314.7083333333333,160,313.22916666666663,160,311.75,159.99999999999997C310.2708333333333,160,308.79166666666663,160,307.3125,159.99999999999997C305.8333333333333,160,304.35416666666663,160,302.875,159.99999999999997C301.3958333333333,160,299.91666666666663,160,298.4375,159.99999999999997C296.9583333333333,160,295.47916666666663,160,294,159.99999999999997C292.5208333333333,160,291.04166666666663,160,289.5625,159.99999999999997C288.0833333333333,160,286.60416666666663,160,285.125,159.99999999999997C283.6458333333333,160,282.16666666666663,160,280.6875,159.99999999999997C279.2083333333333,160,277.72916666666663,160,276.25,159.99999999999997C274.7708333333333,160,273.29166666666663,160,271.8125,159.99999999999997C270.3333333333333,160,268.85416666666663,160,267.375,159.99999999999997C265.8958333333333,160,264.41666666666663,160,262.9375,159.99999999999997C261.4583333333333,160,259.97916666666663,160,258.5,159.99999999999997C257.0208333333333,160,255.54166666666666,160,254.0625,159.99999999999997C252.58333333333334,160,251.10416666666669,160,249.625,159.99999999999997C248.14583333333334,160,246.66666666666666,160,245.1875,159.99999999999997C243.70833333333331,160,242.22916666666666,160,240.74999999999997,159.99999999999997C239.27083333333331,160,237.79166666666663,160,236.31249999999994,159.99999999999997C234.8333333333333,160,233.35416666666663,160,231.87499999999997,159.99999999999997C230.39583333333331,160,228.91666666666666,160,227.43749999999997,159.99999999999997C225.95833333333331,160,224.47916666666666,160,223,159.99999999999997C221.52083333333331,160,220.04166666666663,160,218.56249999999997,159.99999999999997C217.08333333333331,160,215.60416666666663,160,214.12499999999997,159.99999999999997C212.64583333333331,160,211.16666666666663,160,209.6875,159.99999999999997C208.20833333333331,160,206.72916666666669,160,205.25,159.99999999999997C203.77083333333334,160,202.29166666666669,160,200.8125,159.99999999999997C199.33333333333331,160,197.85416666666666,160,196.375,159.99999999999997C194.89583333333331,160,193.41666666666663,160,191.93749999999997,159.99999999999997C190.45833333333331,160,188.97916666666666,160,187.49999999999997,159.99999999999997C186.02083333333331,160,184.54166666666666,160,183.0625,159.99999999999997C181.58333333333331,160,180.10416666666666,160,178.625,159.99999999999997C177.14583333333331,160,175.66666666666666,160,174.1875,159.99999999999997C172.70833333333331,160,171.22916666666666,160,169.75,159.99999999999997C168.27083333333331,160,166.79166666666666,160,165.3125,159.99999999999997C163.83333333333331,160,162.35416666666666,160,160.875,159.99999999999997C159.39583333333331,160,157.91666666666666,160,156.4375,159.99999999999997C154.95833333333331,160,153.47916666666666,160,152,159.99999999999997C150.52083333333331,160,149.04166666666666,160,147.5625,159.99999999999997C146.08333333333331,160,144.60416666666666,160,143.125,159.99999999999997C141.64583333333331,160,140.16666666666666,160,138.6875,159.99999999999997C137.20833333333331,160,135.72916666666666,160,134.25,159.99999999999997C132.77083333333331,160,131.29166666666666,160,129.8125,159.99999999999997C128.33333333333331,160,126.85416666666666,160,125.375,159.99999999999997C123.89583333333333,160,122.41666666666666,160,120.9375,159.99999999999997C119.45833333333333,160,117.97916666666666,160,116.49999999999999,159.99999999999997C115.02083333333331,160,113.54166666666664,160,112.06249999999997,159.99999999999997C110.58333333333331,160,109.10416666666666,160,107.625,159.99999999999997C106.14583333333333,160,104.66666666666666,160,103.18749999999999,159.99999999999997C101.70833333333331,160,100.22916666666666,160,98.75,159.99999999999997C97.27083333333333,160,95.79166666666666,160,94.3125,159.99999999999997C92.83333333333333,160,91.35416666666666,160,89.875,159.99999999999997C88.39583333333333,160,86.91666666666667,160,85.4375,159.99999999999997C83.95833333333334,160,82.47916666666667,160,81.00000000000001,159.99999999999997C79.52083333333333,160,78.04166666666666,160,76.56249999999999,159.99999999999997C75.08333333333333,160,73.60416666666666,160,72.125,159.99999999999997C70.64583333333333,160,69.16666666666666,160,67.6875,159.99999999999997C66.20833333333334,160,64.72916666666667,160,63.25000000000001,159.99999999999997C61.77083333333334,160,60.29166666666667,160,58.8125,159.99999999999997C57.333333333333336,160,55.85416666666667,160,54.375,159.99999999999997C52.89583333333333,160,51.41666666666666,160,49.937499999999986,159.99999999999997C48.45833333333332,160,46.97916666666666,160,45.49999999999999,159.99999999999997C44.02083333333333,160,42.54166666666667,160,41.0625,159.99999999999997C39.583333333333336,160,38.104166666666664,160,36.625,159.99999999999997C35.14583333333333,160,33.666666666666664,160,32.1875,159.99999999999997C30.70833333333333,160,29.229166666666664,160,27.749999999999993,159.99999999999997C26.27083333333333,160,24.791666666666657,160,23.312499999999996,159.99999999999997C21.83333333333333,160,20.354166666666668,160,18.875000000000004,159.99999999999997C17.39583333333334,160,15.916666666666671,160,14.437500000000002,159.99999999999997C12.958333333333336,160,11.479166666666668,160,10.739583333333332,159.99999999999997C10,160,10,160,9.999999999999998,159.99999999999997Z\"></path><g class=\"axis\" transform=\"translate(0,160)\"><g style=\"opacity: 1; \" transform=\"translate(10,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-4</text></g><g style=\"opacity: 1; \" transform=\"translate(98.75,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-2</text></g><g style=\"opacity: 1; \" transform=\"translate(187.5,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">0</text></g><g style=\"opacity: 1; \" transform=\"translate(276.25,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">2</text></g><g style=\"opacity: 1; \" transform=\"translate(365,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">4</text></g><path class=\"domain\" d=\"M10,6V0H365V6\"></path></g></g><g><path class=\"area\" d=\"M392.21875,159.7475712031886V159.9601428215561H396.65625V159.89371419081627H401.09375V159.72099975089267H405.53125V159.68114257244878H409.96875V159.57485676326502H414.40625V159.4685709540813H418.84375V159.28257078800974H423.28125V158.69799883749917H427.71875V158.41899858839184H432.15625V157.8609980901772H436.59375V157.78128373328937H441.03125V156.55899692767633H445.46875V154.5661380054812H449.90625V153.835423067343H454.34375V152.41385036951047H458.78125V150.2084198289477H463.21875V146.48841650751658H467.65625V144.6815577513929H472.09375V140.96155442996172H476.53125V136.63040770572405H480.96875V131.71468903097576H485.40625V126.05496969194195H489.84375V120.63439342357228H494.28125V112.53010047331367H498.71875V103.54894959728938H503.15625V95.75022834843297H507.59375V87.92493564727755H512.03125V79.20949929420803H516.46875V66.69434526281859H520.90625V59.38719588143407H525.34375V47.58947106203509H529.78125V38.47546292452641H534.21875V30.37116997426358H538.65625V23.51573528191014H543.09375V15.092584904095986H547.53125V9.246865398988405H551.96875V8.861579340697205H556.40625V3.467574524620659H560.84375V0.5048575936229156H565.28125V0H569.71875V3.5871460599523743H574.15625V5.805862326663686H578.59375V8.582579091589793H583.03125V16.700157768000594H587.46875V23.675163995685807H591.90625V29.534169226941373H596.34375V40.893465083457286H600.78125V48.825043593796465H605.21875V59.639624678245525H609.65625V69.09906169560148H614.09375V77.15021174127241H618.53125V88.01793573031335H622.96875V95.4977995516215H627.40625V104.51880760609083H631.84375V113.00838661464041H636.28125V120.04982147306181H640.71875V125.80254089513062H645.15625V131.1434028066131H649.59375V136.49755044424435H654.03125V140.37698247945113H658.46875V144.28298596695382H662.90625V146.95341692269548H667.34375V150.60699161338678H671.78125V152.187993024995H676.21875V153.5431370920877H680.65625V155.12413850369583H685.09375V156.3331395831609H689.53125V157.58199784106986H693.96875V157.9805696255089H698.40625V158.48542721913168H702.84375V158.95042763431056H707.28125V159.0567134434943H711.71875V159.3888565971935H716.15625V159.4154280494894H720.59375V159.70771402474472H725.03125V159.8007141077805H729.46875V159.7874283816325H733.90625V159.89371419081627H738.34375V159.7874283816325H742.78125L742.78125,160H738.34375V160H733.90625V160H729.46875V160H725.03125V160H720.59375V160H716.15625V160H711.71875V160H707.28125V160H702.84375V160H698.40625V160H693.96875V160H689.53125V160H685.09375V160H680.65625V160H676.21875V160H671.78125V160H667.34375V160H662.90625V160H658.46875V160H654.03125V160H649.59375V160H645.15625V160H640.71875V160H636.28125V160H631.84375V160H627.40625V160H622.96875V160H618.53125V160H614.09375V160H609.65625V160H605.21875V160H600.78125V160H596.34375V160H591.90625V160H587.46875V160H583.03125V160H578.59375V160H574.15625V160H569.71875V160H565.28125V160H560.84375V160H556.40625V160H551.96875V160H547.53125V160H543.09375V160H538.65625V160H534.21875V160H529.78125V160H525.34375V160H520.90625V160H516.46875V160H512.03125V160H507.59375V160H503.15625V160H498.71875V160H494.28125V160H489.84375V160H485.40625V160H480.96875V160H476.53125V160H472.09375V160H467.65625V160H463.21875V160H458.78125V160H454.34375V160H449.90625V160H445.46875V160H441.03125V160H436.59375V160H432.15625V160H427.71875V160H423.28125V160H418.84375V160H414.40625V160H409.96875V160H405.53125V160H401.09375V160H396.65625V160H392.21875V160Z\"></path><g class=\"axis\" transform=\"translate(0,160)\"><g style=\"opacity: 1; \" transform=\"translate(390,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-4</text></g><g style=\"opacity: 1; \" transform=\"translate(478.75,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">-2</text></g><g style=\"opacity: 1; \" transform=\"translate(567.5,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">0</text></g><g style=\"opacity: 1; \" transform=\"translate(656.25,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">2</text></g><g style=\"opacity: 1; \" transform=\"translate(745,0)\"><line class=\"tick\" y2=\"6\" x2=\"0\"></line><text y=\"9\" x=\"0\" dy=\".71em\" text-anchor=\"middle\">4</text></g><path class=\"domain\" d=\"M390,6V0H745V6\"></path></g></g></g></svg></div>\r\n",
"<div class=\"d3Output description figure\" style=\"width: 800px\">\r\n",
" <b>Figure 1. Example figure with d3js.</b> Standrad normal distribution</div>\r\n",
" \r\n",
"\r\n"
],
"output_type": "display_data"
}
],
"prompt_number": 14
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"I would like to turn it into a more elaborate tool, sometime in the future..."
]
}
],
"metadata": {}
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment