d3.js - dc.js with node.js server side -


i want rendering dccharts on server node.js. have example d3.js , node.js. code doesnt work. im beginner node.js, yoe have idea ?

the code d3.js node.js:example

and here try dc.js , node.js: 

var d3 = require('d3') , dc = require('dc') , jsdom = require('jsdom') , fs = require('fs') , htmlstub = '<html><head></head><body><div id="dataviz-container"></div><script    src="js/d3.v3.min.js"></script></body></html>'  jsdom.env({ features : { queryselector : true } , html : htmlstub , done : function(errors, window) { // callback function pre-renders dataviz inside html document,    export result static file  var el = window.document.queryselector('#dataviz-container') , body = window.document.queryselector('body')  var data = [     {date: "12/27/2012", http_404: 2, http_200: 190, http_302: 100},     {date: "12/28/2012", http_404: 2, http_200: 10, http_302: 100},     {date: "12/29/2012", http_404: 1, http_200: 300, http_302: 200},     {date: "12/30/2012", http_404: 2, http_200: 90, http_302: 0},     {date: "12/31/2012", http_404: 2, http_200: 90, http_302: 0},     {date: "01/01/2013", http_404: 2, http_200: 90, http_302: 0},     {date: "01/02/2013", http_404: 1, http_200: 10, http_302: 1},     {date: "01/03/2013", http_404: 2, http_200: 90, http_302: 0},     {date: "01/04/2013", http_404: 2, http_200: 90, http_302: 0},     {date: "01/05/2013", http_404: 2, http_200: 90, http_302: 0},     {date: "01/06/2013", http_404: 2, http_200: 200, http_302: 1},     {date: "01/07/2013", http_404: 1, http_200: 200, http_302: 100}     ];  var ndx = crossfilter(data);  var parsedate = d3.time.format("%m/%d/%y").parse;  data.foreach(function(d) { d.date = parsedate(d.date); d.total= d.http_404+d.http_200+d.http_302; });  var datedim = ndx.dimension(function(d) {return d.date;}); var hits = datedim.group().reducesum(function(d) {return d.total;});  var hitslinechart  = dc.piechart('dataviz-container'); hitslinechart .width(500).height(200) .transitionduration(500) .colors(d3.scale.category10()) .radius(90) .dimension(datedim) .group(hits);  dc.renderall();      // save result in html file, keep in memory, or export       interesting fragment database later use var svgsrc = window.document.innerhtml fs.writefile('index.html', svgsrc, function(err) { if(err) { console.log('fehler beim speichern', err) } else { console.log('datei wurde gespeichert!') } })   } // end jsdom done callback })

i think var hitslinechart = dc.piechart('dataviz-container'); wrong.

i change know htmlstub , dc.piechart:

var hitslinechart  = dc.piechart('el');  htmlstub = '<html><head></head><body><div id="dataviz-container"></div></script><script type="text/javascript" src="js/d3.js"></script><script type="text/javascript" src="js/crossfilter.js"></script><script type="text/javascript" src="js/dc.js"></script></body></html>'

unfortunately, still error:

c:\users\kasse\code\node-modules\dc\dc.js:2366     var _colors = d3.scale.category20c();  referenceerror: d3 not defined @ object.dc.colorchart (c:\users\kasse\code\node_modules\dc\dc.js:2366:19) @ object.dc.piechart (c:\users\kasse\code\node_modules\dc\dc.js:2971:31) @ jsdom.env.done (c:\users\kasse\code\pre_render.js:44:25) @ c:\users\kasse\code\node_modules\jsdom\lib\jsdom.js:255:9 @ process._tickcallback (node.js:415:13) @ function.module.runmain (module.js:499:11) @ startup (node.js:119:16) @ node.js:902:3

thanks help.

you need make d3 global variable inside module:

global.d3 = d3;  ... chart rendered here dc.renderall();      var svgsrc = window.document.queryselector('#bubblechart');     fs.writefile('chart.svg', svgsrc.innerhtml, function(err) {         if (err) {             console.log('error saving document', err);         } else {             console.log('the file saved!');         }     });

then convert svg png using command line tools imagemagick. see post example: http://eng.wealthfront.com/2011/12/converting-dynamic-svg-to-png-with.html


-

Comments

Post a Comment

Popular posts from this blog

php - regexp cyrillic filename not matches -

i take list of files php glob(."*.pdf") . files have cyrillic names. example: ООО «Рога и копыта» then load company names database , try find them in file names: preg_match("/$firm_name/ui", $file_name, $match); i have problem: firms if $firm_name visually similar $file_name , preg_match says there no match. mb_detect_encoding both variables return utf-8. there problem in file name, or maybe there encoding or something, can not understand, ask help. upd: $file_name='ООО «Рога и копыта»'; preg_match("/... .Рога и копыта./ui", $file_name, $match); as result, ОО «Рога и копыта» , 1 О missing
Read more

c# - OpenXML hanging while writing elements -

Image
i have program pulls data database, caches file , exports data multiple formats (excel, excel 2003, csv). i'm using openxml sdk 2.0 excel work. these export processes run in parallel (using parallel.foreach ), , amount of data can pretty large - e.g. csvs 800mb. during these larger exports, i've noticed writing of xml documents hang. instance, if have 8 exporting in parallel, @ point "pause". hang around same point: //this.writer openxmlwriter created worksheetpart. this.writer.writeelement(new cell() { cellvalue = new cellvalue(value), datatype = cellvalues.string }); when happens, pause debugger (vs2013 in case) , notice threads blocking around same portion of code - bit deeper in openxml sdk - stem call openxmlwriter.writeelement . i dug through source using justdecompile didn't find answers. appears there intermediary stream in use writing isolated storage , is, reason, blocking. underlying stream each of these filestream . here screenshot ...
Read more

sql - Select Query has unexpected multiple records (MS Access) -

i may tired, can't seem figure out happening. have 2 queries. query 1 has 10 fields. query 2 has 5 fields. fields 1 through 3 same in both queries. trying write select query , simple add field 5 query2 query1 result should query1 additional field (query2.field5). i join first 3 fields both queries , choose select records in query1 , in query2 match. don't know sql, use query designer. expect same number of records have query 1 instead have 3 times or more. can tell me doing wrong. tried reversing joins still seem same records. thanks in advance. here query: the fields in common divisionname , supplierid = vendorid , commodityname . select [part revenue exposed query p1].divisionname, [part revenue exposed query p1].commodityname, [part revenue exposed query p1].suppliername, [part revenue exposed query p1].partnumber, [part revenue exposed query p1].partdescription, [part revenue exposed query p1].bucode, ...
Read more