Skip to content

Instantly share code, notes, and snippets.

@azimut
Last active November 15, 2016 06:25
Show Gist options
  • Save azimut/cbaac08c39d08acfa8d40bf61cd1e035 to your computer and use it in GitHub Desktop.
Save azimut/cbaac08c39d08acfa8d40bf61cd1e035 to your computer and use it in GitHub Desktop.
key value date
C 10515.0 04/15/13
C 8144.0 05/05/13
C 5713.0 05/25/13
C 506.0 06/14/13
C 6123.0 07/04/13
C 7483.0 07/24/13
C 5173.0 08/13/13
C 974.0 09/02/13
C 7281.0 09/22/13
C 2068.0 10/12/13
C 1488.0 11/01/13
C 0.0 11/21/13
C 1335.0 12/11/13
C 0.0 12/31/13
C 2035.0 01/20/14
C 0.0 02/09/14
C 2098.0 03/01/14
C 4640.0 03/21/14
C 750.0 04/10/14
C 2740.0 04/30/14
C 2331.0 05/20/14
C 954.0 06/09/14
C 1908.0 06/29/14
C 0.0 07/19/14
C 0.0 08/08/14
C 1501.0 08/28/14
C 4376.0 09/17/14
C 3202.0 10/07/14
C 1216.0 10/27/14
C 898.0 11/16/14
C 287.0 12/06/14
C 961.0 12/26/14
C 4492.0 01/15/15
C 2549.0 02/04/15
C 1702.0 02/24/15
C 0.0 03/16/15
C 0.0 04/05/15
C 1919.0 04/25/15
C 190.0 05/15/15
C 13754.0 06/04/15
C 0.0 06/24/15
C 4374.0 07/14/15
C 2228.0 08/03/15
C 7845.0 08/23/15
C 4027.0 09/12/15
C 1735.0 10/02/15
C 1202.0 10/22/15
C 722.0 11/11/15
C 774.0 12/01/15
C 899.0 12/21/15
C 1066.0 01/10/16
C 993.0 01/30/16
C 2842.0 02/19/16
C 7687.0 03/10/16
C 1820.0 03/30/16
C 3731.0 04/19/16
C 6343.0 05/09/16
C 11857.0 05/29/16
C 19528.0 06/18/16
C 2670.0 07/08/16
C 1251.0 07/28/16
C 7483.0 08/17/16
C 3947.0 09/06/16
C 1112.0 09/26/16
C 0.0 10/17/16
C 0.0 11/06/16
N 14814.0 04/16/13
N 3398.0 05/06/13
N 4313.0 05/26/13
N 1128.0 06/15/13
N 2826.0 07/05/13
N 9360.0 07/25/13
N 5236.0 08/14/13
N 1330.0 09/03/13
N 6139.0 09/23/13
N 1878.0 10/13/13
N 2306.0 11/02/13
N 0.0 11/22/13
N 1858.0 12/12/13
N 0.0 01/01/14
N 2742.0 01/21/14
N 0.0 02/10/14
N 1185.0 03/02/14
N 6267.0 03/22/14
N 1114.0 04/11/14
N 2407.0 05/01/14
N 2468.0 05/21/14
N 1734.0 06/10/14
N 1270.0 06/30/14
N 0.0 07/20/14
N 0.0 08/09/14
N 1133.0 08/29/14
N 4657.0 09/18/14
N 3144.0 10/08/14
N 604.0 10/28/14
N 1573.0 11/17/14
N 998.0 12/07/14
N 1572.0 12/27/14
N 5160.0 01/16/15
N 2367.0 02/05/15
N 3282.0 02/25/15
N 0.0 03/17/15
N 0.0 04/06/15
N 3292.0 04/26/15
N 743.0 05/16/15
N 11522.0 06/05/15
N 0.0 06/25/15
N 5682.0 07/15/15
N 1382.0 08/04/15
N 11481.0 08/24/15
N 8325.0 09/13/15
N 3677.0 10/03/15
N 3609.0 10/23/15
N 2605.0 11/12/15
N 2377.0 12/02/15
N 2436.0 12/22/15
N 3712.0 01/11/16
N 2656.0 01/31/16
N 6919.0 02/20/16
N 9047.0 03/11/16
N 7174.0 03/31/16
N 13614.0 04/20/16
N 15765.0 05/10/16
N 15042.0 05/30/16
N 22821.0 06/19/16
N 5339.0 07/09/16
N 4157.0 07/29/16
N 11399.0 08/18/16
N 6878.0 09/07/16
N 7042.0 09/27/16
N 5426.0 10/17/16
N 1169.0 11/06/16
<!DOCTYPE html>
<!-- http://bl.ocks.org/WillTurman/4631136 -->
<!-- http://inyourspeakers.com/content/review/294-spazzkid-promise-ep-07092014 -->
<!-- http://bl.ocks.org/jwhitfieldseed/9697914 -->
<head>
<title>Numero de caracteres "hablados"</title>
<meta charset="utf-8">
<style>
body {
font: 10px sans-serif;
}
.chart {
background: #fff;
}
p {
font: 12px helvetica;
}
.axis path, .axis line {
fill: none;
stroke: #000;
stroke-width: 2px;
shape-rendering: crispEdges;
}
button {
position: absolute;
right: 50px;
top: 10px;
}
</style>
</head>
<body>
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://raw.githubusercontent.com/jasondavies/d3-cloud/master/build/d3.layout.cloud.js"></script>
<!--<script src="http://d3js.org/d3.v2.js"></script>
<script src="https://rawgit.com/jasondavies/d3-cloud/master/build/d3.layout.cloud.js"></script>-->
<div class="chart">
</div>
<div class="cloudt">
</div>
<script>
cwords = '{"42013":[{"text":"si","size":18},{"text":"xd","size":15},{"text":":p","size":14},{"text":"asi","size":11},{"text":"voy","size":11},{"text":"tenes","size":9},{"text":"bien","size":8}],"52013":[{"text":"si","size":24},{"text":"xd","size":20},{"text":"asi","size":16},{"text":":p","size":15},{"text":"tambien","size":14},{"text":"bien","size":12},{"text":"hacer","size":12}],"62013":[{"text":"bien","size":5},{"text":"suena","size":4},{"text":"raras","size":3},{"text":"voy","size":2},{"text":":3","size":2},{"text":":p","size":2},{"text":"raros","size":2}],"72013":[{"text":"si","size":16},{"text":"xd","size":11},{"text":"ahora","size":11},{"text":":p","size":10},{"text":"vos","size":9},{"text":"voy","size":9},{"text":"gusta","size":9}],"82013":[{"text":":p","size":13},{"text":"xd","size":10},{"text":"asi","size":9},{"text":"si","size":8},{"text":"bueno","size":7},{"text":"ir","size":6},{"text":"bien","size":6}],"92013":[{"text":"si","size":14},{"text":":p","size":12},{"text":"asi","size":11},{"text":"bueno","size":10},{"text":"vos","size":10},{"text":"musica","size":8},{"text":":d","size":6}],"102013":[{"text":":p","size":11},{"text":"si","size":11},{"text":"bueno","size":9},{"text":"xd","size":8},{"text":"asi","size":7},{"text":"cancion","size":7},{"text":"mira","size":6}],"112013":[{"text":":p","size":4},{"text":":3","size":3},{"text":"pagina","size":3},{"text":"bueno","size":3},{"text":"examenes","size":3},{"text":"dos","size":3},{"text":"voy","size":2}],"122013":[{"text":"si","size":6},{"text":"tenes","size":4},{"text":"nunca","size":3},{"text":"asi","size":3},{"text":"razon","size":2},{"text":"n.n","size":2},{"text":"23","size":2}],"12014":[{"text":"si","size":2},{"text":"chicas","size":2},{"text":"bueno","size":1},{"text":"banda","size":1},{"text":"aunque","size":1},{"text":"musica","size":1},{"text":"saludaste","size":1}],"22014":[{"text":"aprender","size":4},{"text":"escucho","size":3},{"text":"cancion","size":2},{"text":"queria","size":2},{"text":"idiomas","size":2},{"text":"idioma","size":2},{"text":"bien","size":2}],"32014":[{"text":"si","size":12},{"text":"asi","size":7},{"text":"cosas","size":6},{"text":"xd","size":5},{"text":"bueno","size":5},{"text":"hacer","size":5},{"text":"jajaj","size":5}],"42014":[{"text":"si","size":8},{"text":"xd","size":7},{"text":"hacer","size":4},{"text":"vos","size":4},{"text":"bien","size":4},{"text":"profesora","size":4},{"text":":p","size":3}],"52014":[{"text":"bien","size":5},{"text":"xd","size":4},{"text":"vos","size":4},{"text":"tan","size":4},{"text":"casino","size":3},{"text":"sueo","size":3},{"text":"tenias","size":3}],"62014":[{"text":"saber","size":3},{"text":"despus","size":2},{"text":"as","size":2},{"text":"noche","size":2},{"text":":d","size":1},{"text":"veo","size":1},{"text":":p","size":1}],"72014":[{"text":"claro","size":3},{"text":"vos","size":3},{"text":"buenas","size":2},{"text":"punto","size":2},{"text":"entiendo","size":2},{"text":" ","size":2},{"text":"arreglo","size":2}],"82014":[],"92014":[{"text":"ex","size":4},{"text":"xdd","size":4},{"text":"si","size":3},{"text":"quizas","size":3},{"text":"lindo","size":3},{"text":":/","size":2},{"text":"jajaj","size":2}],"102014":[{"text":"asi","size":12},{"text":"si","size":11},{"text":"bueno","size":9},{"text":"xd","size":8},{"text":"vos","size":8},{"text":"cosas","size":7},{"text":".-.","size":6}],"112014":[{"text":"conoca","size":3},{"text":"vos","size":2},{"text":"stay","size":1},{"text":"hungry","size":1},{"text":"stay","size":1},{"text":"voy","size":1},{"text":"conformista","size":1}],"122014":[{"text":"dios","size":3},{"text":"buenas","size":2},{"text":"noches","size":2},{"text":"jajaj","size":2},{"text":"verlo","size":2},{"text":"ver","size":2},{"text":"puse","size":2}],"12015":[{"text":"vos","size":9},{"text":"asi","size":8},{"text":"si","size":8},{"text":"ir","size":6},{"text":"ahora","size":6},{"text":"bueno","size":5},{"text":"compu","size":5}],"22015":[{"text":"asi","size":8},{"text":"boca","size":4},{"text":"creo","size":4},{"text":"vez","size":3},{"text":"trabajo","size":3},{"text":"hermano","size":2},{"text":"sentir","size":2}],"32015":[{"text":"asi","size":5},{"text":":/","size":3},{"text":"hacer","size":3},{"text":"mejor","size":3},{"text":"sangre","size":3},{"text":"voy","size":2},{"text":"si","size":2}],"42015":[{"text":"va","size":2},{"text":"ir","size":2},{"text":"vos","size":1},{"text":"colores","size":1},{"text":"bueno","size":1},{"text":":d","size":1},{"text":"iba","size":1}],"52015":[{"text":"amigo","size":4},{"text":"tambien","size":4},{"text":"hecho","size":3},{"text":"voy","size":2},{"text":"ir","size":2},{"text":"gusta","size":2},{"text":"compre","size":2}],"62015":[{"text":"si","size":29},{"text":".-.","size":17},{"text":"vos","size":16},{"text":"asi","size":15},{"text":"voy","size":13},{"text":"cosas","size":13},{"text":"xd","size":12}],"72015":[{"text":"asi","size":9},{"text":"si","size":7},{"text":"bien","size":5},{"text":".-.","size":4},{"text":"vez","size":4},{"text":"genial","size":4},{"text":"(que","size":3}],"82015":[{"text":"asi","size":14},{"text":"bueno","size":10},{"text":"si","size":10},{"text":":d","size":8},{"text":".-.","size":7},{"text":"cosas","size":7},{"text":"xd","size":6}],"92015":[{"text":"voy","size":9},{"text":"bien","size":8},{"text":"asi","size":8},{"text":"si","size":8},{"text":"ahi","size":7},{"text":"jaja","size":6},{"text":":s","size":6}],"102015":[{"text":"asi","size":5},{"text":"responder","size":4},{"text":"hace","size":4},{"text":"mente","size":4},{"text":"perdon","size":4},{"text":"cosas","size":4},{"text":"decir","size":4}],"112015":[{"text":"hacer","size":3},{"text":"jajaja","size":3},{"text":"vos","size":3},{"text":"asi","size":3},{"text":"creo","size":3},{"text":"cayo","size":2},{"text":"agua","size":2}],"122015":[{"text":"regalaron","size":3},{"text":"super","size":3},{"text":"hoy","size":3},{"text":"vos","size":3},{"text":"ir","size":2},{"text":"si","size":2},{"text":"pasaste","size":2}],"12016":[{"text":"asi","size":3},{"text":"ahora","size":2},{"text":"facultad","size":2},{"text":"debe","size":2},{"text":"termine","size":2},{"text":"parte","size":2},{"text":"entrevista","size":2}],"22016":[{"text":"re","size":4},{"text":"genial","size":3},{"text":"vos","size":3},{"text":"alegre","size":3},{"text":"eh","size":2},{"text":"cancion","size":2},{"text":"bueno","size":2}],"32016":[{"text":"asi","size":14},{"text":"re","size":11},{"text":"ir","size":8},{"text":"voy","size":8},{"text":"dia","size":7},{"text":"it","size":6},{"text":"comida","size":6}],"42016":[{"text":"asi","size":7},{"text":"si","size":5},{"text":"ir","size":4},{"text":"ver","size":4},{"text":"xd","size":4},{"text":"re","size":4},{"text":"compu","size":3}],"52016":[{"text":"asi","size":15},{"text":"cosas","size":14},{"text":"voy","size":13},{"text":"si","size":10},{"text":"gusta","size":8},{"text":"vez","size":8},{"text":"ahora","size":7}],"62016":[{"text":"si","size":41},{"text":"asi","size":30},{"text":"cosas","size":24},{"text":"xd","size":21},{"text":"vos","size":20},{"text":"hacer","size":20},{"text":"*","size":17}],"72016":[{"text":"si","size":9},{"text":"cosas","size":9},{"text":"xd","size":8},{"text":" ","size":7},{"text":"kant","size":7},{"text":"asi","size":7},{"text":"ver","size":7}],"82016":[{"text":"as","size":15},{"text":" ","size":10},{"text":"si","size":7},{"text":"ver","size":7},{"text":"gente","size":5},{"text":"ir","size":4},{"text":"caminar","size":4}],"92016":[{"text":" ","size":15},{"text":"as","size":13},{"text":"cosas","size":9},{"text":"si","size":8},{"text":"voy","size":7},{"text":"personas","size":7},{"text":"jaja","size":6}],"102016":[{"text":"cosas","size":4},{"text":"perdn","size":2},{"text":"puedo","size":2},{"text":"responder","size":2},{"text":"ver","size":2},{"text":"bien","size":2},{"text":"hacer","size":1}]}';
nwords = '{"42013":[{"text":":p","size":35},{"text":"si","size":17},{"text":":d","size":13},{"text":"*","size":11},{"text":"igual","size":10},{"text":"creo","size":7},{"text":"mal","size":7}],"52013":[{"text":":p","size":39},{"text":"q","size":21},{"text":"si","size":21},{"text":":d","size":17},{"text":":s","size":17},{"text":"igual","size":14},{"text":"creo","size":12}],"62013":[{"text":":d","size":2},{"text":"si","size":2},{"text":":p","size":2},{"text":"bueno","size":1},{"text":"misma","size":1},{"text":"viste","size":1},{"text":"asi","size":1}],"72013":[{"text":":p","size":26},{"text":"si","size":16},{"text":":d","size":11},{"text":"tema","size":8},{"text":"mmmm","size":7},{"text":"vos","size":6},{"text":"dia","size":6}],"82013":[{"text":":d","size":24},{"text":":p","size":24},{"text":"si","size":14},{"text":":s","size":10},{"text":"mejor","size":7},{"text":"xd","size":6},{"text":"mmm","size":6}],"92013":[{"text":":p","size":22},{"text":":d","size":19},{"text":"xd","size":7},{"text":"bueno","size":7},{"text":"si","size":6},{"text":"musica","size":6},{"text":":)","size":5}],"102013":[{"text":":p","size":16},{"text":"si","size":12},{"text":"xd","size":8},{"text":"bien","size":8},{"text":"paso","size":7},{"text":":d","size":5},{"text":"asi","size":5}],"112013":[{"text":"banda","size":5},{"text":":p","size":4},{"text":"pagina","size":4},{"text":"*","size":4},{"text":"voy","size":3},{"text":":d","size":3},{"text":":/","size":2}],"122013":[{"text":"blah","size":3},{"text":":p","size":2},{"text":"si","size":2},{"text":"cierto","size":2},{"text":"xd","size":2},{"text":"siempre","size":2},{"text":"gato","size":2}],"12014":[{"text":":p","size":4},{"text":"aprender","size":4},{"text":"voy","size":3},{"text":"vez","size":3},{"text":"*","size":3},{"text":"si","size":2},{"text":"algun","size":2}],"22014":[{"text":"primero","size":4},{"text":"aeternus","size":3},{"text":"sopor","size":2},{"text":"frances","size":2},{"text":"idiomas","size":2},{"text":"xd","size":2},{"text":"aaa","size":2}],"32014":[{"text":":p","size":9},{"text":"si","size":8},{"text":"xd","size":7},{"text":"solo","size":4},{"text":"aunque","size":4},{"text":"ahora","size":4},{"text":"pasa","size":4}],"42014":[{"text":"si","size":8},{"text":"xd","size":6},{"text":"alguien","size":5},{"text":":p","size":4},{"text":"web","size":4},{"text":"tarjeta","size":3},{"text":"bueno","size":3}],"52014":[{"text":"xd","size":8},{"text":"si","size":7},{"text":"gente","size":5},{"text":":p","size":5},{"text":"bien","size":5},{"text":"asi","size":5},{"text":"cuenta","size":5}],"62014":[{"text":"estudiar","size":4},{"text":"cosas","size":3},{"text":":d","size":2},{"text":"bueno","size":2},{"text":":p","size":2},{"text":"eso","size":2},{"text":"quizas","size":2}],"72014":[{"text":":p","size":4},{"text":"xd","size":2},{"text":"ultimo","size":2},{"text":"bien","size":2},{"text":"tambien","size":2},{"text":"quizs","size":2},{"text":"creo","size":2}],"82014":[],"92014":[{"text":"si","size":6},{"text":"puedo","size":4},{"text":":d","size":3},{"text":":p","size":3},{"text":"hace","size":3},{"text":"dia","size":3},{"text":"hablar","size":3}],"102014":[{"text":":p","size":9},{"text":"si","size":9},{"text":"*","size":8},{"text":"xd","size":6},{"text":"pasa","size":6},{"text":"hace","size":5},{"text":"dopamina","size":5}],"112014":[{"text":":p","size":3},{"text":"habia","size":3},{"text":"vinilo","size":2},{"text":"dijo","size":2},{"text":"casa","size":2},{"text":"banda","size":2},{"text":"frase","size":2}],"122014":[{"text":"videos","size":4},{"text":":d","size":3},{"text":"hace","size":3},{"text":"iamamiwhoami","size":3},{"text":"bien","size":3},{"text":"cuenta","size":3},{"text":"cancion","size":2}],"12015":[{"text":"si","size":5},{"text":":p","size":4},{"text":"bahia","size":3},{"text":"blanca","size":3},{"text":"your","size":3},{"text":"aaa","size":3},{"text":"mmmm","size":3}],"22015":[{"text":"si","size":15},{"text":":d","size":8},{"text":"xd","size":6},{"text":"bien","size":6},{"text":"ahora","size":6},{"text":":o","size":5},{"text":"cine","size":5}],"32015":[{"text":":d","size":6},{"text":"si","size":4},{"text":"escuchar","size":3},{"text":"cosas","size":3},{"text":":|","size":3},{"text":"hacerme","size":3},{"text":"idea","size":3}],"42015":[{"text":"siempre","size":2},{"text":"voy","size":1},{"text":"solamente","size":1},{"text":"i.imgur.com\/azntx.gif","size":1},{"text":"dias","size":1},{"text":"familia\/perro\/guitarra\/lapiz\/trabajo\/life(el","size":1},{"text":"concepto","size":1}],"52015":[{"text":"gente","size":7},{"text":":d","size":4},{"text":":p","size":4},{"text":"ver","size":4},{"text":"vas","size":4},{"text":"ahora","size":4},{"text":"ir","size":3}],"62015":[{"text":"si","size":22},{"text":"*","size":12},{"text":"vos","size":12},{"text":":p","size":11},{"text":"voy","size":11},{"text":":d","size":10},{"text":"bien","size":10}],"72015":[{"text":"si","size":11},{"text":":p","size":8},{"text":"habia","size":6},{"text":":d","size":6},{"text":"paso","size":5},{"text":"bien","size":5},{"text":"vos","size":5}],"82015":[{"text":"si","size":18},{"text":":p","size":16},{"text":"hacer","size":11},{"text":"cosas","size":11},{"text":"creo","size":10},{"text":"bien","size":7},{"text":"xd","size":6}],"92015":[{"text":"si","size":27},{"text":":d","size":23},{"text":":p","size":19},{"text":"cosas","size":19},{"text":"*","size":19},{"text":"bien","size":14},{"text":"voy","size":13}],"102015":[{"text":"cosas","size":11},{"text":"vos","size":10},{"text":"mejor","size":9},{"text":"si","size":9},{"text":":d","size":7},{"text":"quizas","size":7},{"text":"ahora","size":6}],"112015":[{"text":"si","size":13},{"text":"vos","size":7},{"text":":p","size":5},{"text":"the","size":5},{"text":"cafe","size":4},{"text":"of","size":4},{"text":"telefono","size":4}],"122015":[{"text":":p","size":9},{"text":":d","size":6},{"text":"vos","size":6},{"text":"habia","size":5},{"text":"aca","size":5},{"text":"ao","size":5},{"text":"ahora","size":5}],"12016":[{"text":":p","size":10},{"text":"si","size":10},{"text":"entrevista","size":6},{"text":":d","size":5},{"text":"normal","size":4},{"text":"osea","size":4},{"text":"cosas","size":4}],"22016":[{"text":"cosas","size":7},{"text":":p","size":6},{"text":"vos","size":6},{"text":":d","size":5},{"text":"bueno","size":4},{"text":"aca","size":4},{"text":"bien","size":4}],"32016":[{"text":"si","size":20},{"text":"*","size":20},{"text":"xd","size":16},{"text":":p","size":15},{"text":"dia","size":13},{"text":"cosas","size":12},{"text":"bueno","size":10}],"42016":[{"text":"si","size":30},{"text":"*","size":16},{"text":":p","size":12},{"text":"cosas","size":12},{"text":"ahora","size":11},{"text":"ver","size":9},{"text":"creo","size":9}],"52016":[{"text":"si","size":47},{"text":"cosas","size":30},{"text":":p","size":26},{"text":"bien","size":17},{"text":"vez","size":16},{"text":"asique","size":13},{"text":"va","size":13}],"62016":[{"text":"si","size":45},{"text":"cosas","size":40},{"text":":p","size":31},{"text":"xd","size":26},{"text":"bueno","size":21},{"text":"vos","size":19},{"text":"dia","size":19}],"72016":[{"text":"*","size":26},{"text":"si","size":20},{"text":":p","size":19},{"text":"*coff","size":12},{"text":"cosas","size":11},{"text":"creo","size":11},{"text":"voy","size":10}],"82016":[{"text":"si","size":11},{"text":"cosas","size":11},{"text":"ahora","size":10},{"text":"bien","size":9},{"text":":p","size":8},{"text":"hacer","size":8},{"text":"dia","size":8}],"92016":[{"text":"si","size":20},{"text":":p","size":13},{"text":"cosas","size":13},{"text":"vos","size":11},{"text":"asi","size":11},{"text":"ahora","size":11},{"text":"dia","size":10}],"102016":[{"text":"cosas","size":6},{"text":"quizas","size":5},{"text":"si","size":4},{"text":"dia","size":4},{"text":"bien","size":4},{"text":"voy","size":3},{"text":":p","size":3}],"112016":[{"text":"libro","size":7},{"text":"ver","size":5},{"text":"libros","size":4},{"text":"asi","size":4},{"text":"dia","size":4},{"text":"cosas","size":4},{"text":"vez","size":4}]}'
jnwords = JSON.parse(nwords);
jcwords = JSON.parse(cwords);
// ============
var frequency_list = jcwords['112014'].concat(jnwords['112014'])
//var svg = d3.select("body").selectAll("div.cloudt").append("svg")
// Encapsulate the word cloud functionality
function wordCloud(selector) {
// var fill = d3.scale.category20b();
var fill = d3.scale.linear()
.domain([0,1,2,3,4,5,6,10,15,20,100])
.range(["#ddd", "#ccc", "#bbb", "#aaa", "#999", "#888", "#777", "#666", "#555", "#444", "#333", "#222"]);
//Construct the word cloud's SVG element
// var svg = d3.select(selector).append("svg")
var svg = d3.select("body").selectAll("div.cloudt").append("svg")
.attr("width", 300)
.attr("height", 300)
.append("g")
.attr("transform", "translate(150,150)");
//Draw the word cloud
function draw(words) {
var cloud = svg.selectAll("g text")
.data(words, function(d) { return d.text; })
//Entering words
cloud.enter()
.append("text")
.style("font-family", "Impact")
.style("fill", function(d, i) { return fill(i); })
.attr("text-anchor", "middle")
.attr('font-size', 1)
.text(function(d) { return d.text; });
//Entering and existing words
cloud
.transition()
.duration(600)
.style("font-size", function(d) { return d.size + "px"; })
.attr("transform", function(d) {
return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
})
.style("fill-opacity", 1);
//Exiting words
cloud.exit()
.transition()
.duration(200)
.style('fill-opacity', 1e-6)
.attr('font-size', 1)
.remove();
}
//Use the module pattern to encapsulate the visualisation code. We'll
// expose only the parts that need to be public.
return {
//Recompute the word cloud for a new set of words. This method will
// asycnhronously call draw when the layout has been computed.
//The outside world will need to call this function, so make it part
// of the wordCloud return value.
update: function(words) {
d3.layout.cloud().size([300, 300])
.words(words)
.padding(5)
.rotate(function() { return ~~(Math.random() * 2) * 90; })
.font("Impact")
.fontSize(function(d) { return d.size * 1.5; })
.on("end", draw)
.start();
}
}
}
var myWordCloud = wordCloud('body');
// ============
//chart("data.2.csv", "blue");
//chart("b.csv", "blue");
chart("https://rawgit.com/azimut/cbaac08c39d08acfa8d40bf61cd1e035/raw/e3009a10929b08b71aec52e386f07acd0ab56764/b.csv","blue");
var datearray = [];
var colorrange = [];
var wait = false;
function chart(csvpath, color) {
if (color == "blue") {
//colorrange = ["#045A8D", "#2B8CBE"];
colorrange = ["#d7b5c6","#5ccee8"];
//colorrange = ["#045A8D", "#2B8CBE", "#74A9CF", "#A6BDDB", "#D0D1E6", "#F1EEF6"];
}
else if (color == "pink") {
colorrange = ["#980043", "#DD1C77", "#DF65B0", "#C994C7", "#D4B9DA", "#F1EEF6"];
}
else if (color == "orange") {
colorrange = ["#B30000", "#E34A33", "#FC8D59", "#FDBB84", "#FDD49E", "#FEF0D9"];
}
strokecolor = colorrange[0];
var format = d3.time.format("%m/%d/%y");
var margin = {top: 20, right: 40, bottom: 30, left: 30};
var width = document.body.clientWidth - margin.left - margin.right;
var height = 400 - margin.top - margin.bottom;
var tooltip = d3.select("body")
.append("div")
.attr("class", "remove")
.style("position", "absolute")
.style("z-index", "20")
.style("visibility", "hidden")
.style("top", "30px")
.style("left", "55px");
var x = d3.time.scale()
.range([0, width]);
var y = d3.scale.linear()
.range([height-10, 0]);
var z = d3.scale.ordinal()
.range(colorrange);
var xAxis = d3.svg.axis()
.scale(x)
.orient("bottom")
.ticks(d3.time.years);
// var yAxis = d3.svg.axis()
// .scale(y);
//
// var yAxisr = d3.svg.axis()
// .scale(y);
var stack = d3.layout.stack()
.offset("silhouette")
.values(function(d) { return d.values; })
.x(function(d) { return d.date; })
.y(function(d) { return d.value; });
var nest = d3.nest()
.key(function(d) { return d.key; });
var area = d3.svg.area()
.interpolate("cardinal")
.x(function(d) { return x(d.date); })
.y0(function(d) { return y(d.y0); })
.y1(function(d) { return y(d.y0 + d.y); });
var svg = d3.select(".chart").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
var graph = d3.csv(csvpath, function(data) {
data.forEach(function(d) {
d.date = format.parse(d.date);
d.value = +d.value;
});
var layers = stack(nest.entries(data));
x.domain(d3.extent(data, function(d) { return d.date; }));
y.domain([0, d3.max(data, function(d) { return d.y0 + d.y; })]);
svg.selectAll(".layer")
.data(layers)
.enter().append("path")
.attr("class", "layer")
.attr("d", function(d) { return area(d.values); })
.style("fill", function(d, i) { return z(i); });
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);
// svg.append("g")
// .attr("class", "y axis")
// .attr("transform", "translate(" + width + ", 0)")
// .call(yAxis.orient("right"));
// svg.append("g")
// .attr("class", "y axis")
// .call(yAxis.orient("left"));
svg.selectAll(".layer")
.attr("opacity", 1)
.on("mouseover", function(d, i) {
svg.selectAll(".layer").transition()
.duration(250)
.attr("opacity", function(d, j) {
return j != i ? 0.6 : 1;
})})
.on("mousemove", function(d, i) {
if(!wait){
mousex = d3.mouse(this);
mousex = mousex[0];
var invertedx = x.invert(mousex);
invertedx = invertedx.getMonth() + invertedx.getDate();
var selected = (d.values);
for (var k = 0; k < selected.length; k++) {
datearray[k] = selected[k].date
datearray[k] = datearray[k].getMonth() + datearray[k].getDate();
}
mousedate = datearray.indexOf(invertedx);
pro = d.values[mousedate].value;
var mywords;
if(d.key === "C")
mywords = jcwords[x.invert(mousex).getMonth() + "" + x.invert(mousex).getFullYear()];
if(d.key === "N")
mywords = jnwords[x.invert(mousex).getMonth() + "" + x.invert(mousex).getFullYear()];
myWordCloud.update(mywords)
//showNewWords(myWordCloud, x.invert(mousex).getMonth() + "" + x.invert(mousex).getFullYear());
d3.select(this)
.classed("hover", true)
.attr("stroke", strokecolor)
.attr("stroke-width", "0.5px"),
tooltip.html( "<p>" + d.key + "<br>" + pro + "<br>" + x.invert(mousex).getDate() + "/" + x.invert(mousex).getMonth() + "/" + x.invert(mousex).getFullYear() + "</p>" ).style("visibility", "visible");
}
wait = true;
setTimeout(function(){ wait = false; },200);
})
.on("mouseout", function(d, i) {
svg.selectAll(".layer")
.transition()
.duration(250)
.attr("opacity", "1");
d3.select(this)
.classed("hover", false)
.attr("stroke-width", "0px"), tooltip.html( "<p>" + d.key + "<br>" + pro + "<br>" + x.invert(mousex).getDate() + "/" + x.invert(mousex).getMonth() + "/" + x.invert(mousex).getFullYear() + "</p>" ).style("visibility", "hidden");
})
var vertical = d3.select(".chart")
.append("div")
.attr("class", "remove")
.style("position", "absolute")
.style("z-index", "19")
.style("width", "1px")
.style("height", "380px")
.style("top", "10px")
.style("bottom", "30px")
.style("left", "0px")
.style("background", "#fff");
d3.select(".chart")
.on("mousemove", function(){
mousex = d3.mouse(this);
mousex = mousex[0] + 5;
vertical.style("left", mousex + "px" )})
.on("mouseover", function(){
mousex = d3.mouse(this);
mousex = mousex[0] + 5;
vertical.style("left", mousex + "px")});
});
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment