d3.js - wrong shadows at a parallel coordinates plot -

-

i'm (still) working on representation of data using parallel-coordinates library github (https://github.com/syntagmatic/parallel-coordinates#parallel-coordinates)(based on d3.js).

at moment i'm facing problem there shadow wich shouldn't exist, after reorder axes.

after upload of data website plot looks that: enter image description here

after reordering (switch first axes) plot looks that: enter image description here

here can see shadow between second , third axis, shouldn't there.
other shadows work fine (as can see in following picture). there additional one. enter image description here

i checked api description of library if maybe use .shadows() method in wrong way, didn't find anything. although checked issues, stackoverflow , google didn't find helpful.

here code:

<link rel="stylesheet" type="text/css" href="imports/d3.parcoords.css"> <link rel="stylesheet" type="text/css" href="imports/style.css"> <script src="imports/lib/d3.min.js"></script> <script src="imports/d3.parcoords.js"></script>  <link rel="stylesheet" type="text/css" href="imports/d3.parcoords.css"> <link rel="stylesheet" type="text/css" href="imports/style.css">   <body>      <input type="file" id="fileinput" />      <div id="example" class="parcoords" style="width:700px; height:300px; position:relativ;"></div>      <script>         function handlefileselect(evt) {             var inputfiles=evt.target.files;              var reader=new filereader();             reader.onload = (function(e){                 ausfuehren(reader.result);     //call 'main' method             });             reader.readastext(inputfiles[0]);         }         document.getelementbyid('fileinput').addeventlistener('change', handlefileselect, false);          // main method         function ausfuehren(eingabe){             var save=eingabe;             save=parse(save);                        save=drawparallelcoordinates(save);         }          // text ->objekt array         function parse(text){                var ergebnis= text.split("\n");         //split single lines             var header = ergebnis[0].split(",");    //split first line "," names of attributes/dimensions             var final_res = [];                     //arraylist             (var = 1; i<ergebnis.length; i++) {  //loop on following lines, contain information representet objekts                 var zeile=ergebnis[i];                 var tmp = zeile.split(",");                     //split "," single attributevalues                 final_res.push({});                             //push new objekt array list                 (var j = 0, element; element = tmp[j]; j++) {   //loop on every attribute                     final_res[i-1][header[j]] = element;            // add dynamical 1 attribute objekt identifier in header , value csv                 }             }             return final_res;         }          // eingabe: data         function drawparallelcoordinates(eingabe){  //objekt array -> parcoords objekt             console.log("drawparallelcoordinates: data:",eingabe);             var parcoords = d3.parcoords()("#example")                   .data(eingabe)                                      .render()                        .reorderable()                   .shadows()                       .brushmode("1d-axes")                return parcoords;         }     </script> </body>

(if want run it(it should work), need imports d3 , paarcoords lib in imports directory has in same directory htmlfile) (you can "imports" directory @ following link: http://ge.tt/31whtgl2/v/0?c)

the main functional part drawparallelcoordinates method @ end of code.

the uploaded csv file contains following:

name,reifen,tueren,ps audi ,4,5,300 motorad,2,0,100 fiat,4,5,60 trike,3,0,130

the inner data (directly before overhanding parcoords) following: enter image description here

the questions are: do mistake? , if so: do wrong, right solution, or can find answers ?
or facing bug in library

update: (some additional info)

one thing looks similar (it causes wrong shadows too) can caused missing / undefinded values. here think not case, because didn't finde spot value missing in little(postet above) example.

i observed discribed behavior appears @ bottom of plot (this means: when min values of axes next eachother connected) if change order of axes, shadow stays. can kind of creat new wrong shadows. (at moment dont know if there can such wrong shadws beginning)

fiddle

here working fiddle: https://jsfiddle.net/x74wemq0/4/
somehow error doesn't occur in results window of fiddle. maybe had on older version of the library , bug fixed. (i'll check this)

thanks in advance
jones

i switched load imports via link: 

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script> <script src="https://syntagmatic.github.io/parallel-coordinates/d3.parcoords.js" charset="utf-8"></script> <link rel="stylesheet" href="https://syntagmatic.github.io/parallel-coordinates/d3.parcoords.css"/>

so have newest version of libraries , error doesn't occur anymore.
think bug in older version used before , should fixed now.

greetings jones

ps: if i'm wrong , error occurs again i'll let know ;)


Comments

Post a Comment

Popular posts from this blog

python - pip install -U PySide error -

-
does know how avoid following error when running pip install -u pyside per official website instructions here: https://pypi.python.org/pypi/pyside/#installing-pyside-on-a-mac-os-x-system note have done brew install qt successfully. you using pip version 7.0.3, version 7.1.2 available. should consider upgrading via 'pip install --upgrade pip' command. collecting pyside using cached pyside-1.2.4.tar.gz installing collected packages: pyside running setup.py install pyside complete output command /applications/anaconda/bin/python -c "import setuptools, tokenize;__file__='/private/var/folders/dy/ttgqhqqx3g9bsbsnqnxsk2z80000gq/t/pip-build-cpxemt/pyside/setup.py';exec(compile(getattr(tokenize, 'open', open)(__file__).read().replace('\r\n', '\n'), __file__, 'exec'))" install --record /var/folders/dy/ttgqhqqx3g9bsbsnqnxsk2z80000gq/t/pip-0r7hri-record/install-record.txt --single-version-externally-managed --compile:
Read more

arrays - C++ error: a brace-enclosed initializer is not allowed here before ‘{’ token -

-
simple question: i'm trying initialize array within c++ class declaration: using namespace std; #include <string> class myclass{ public: string myarray[] = {"a","b","c"}; }; and i'm getting error: error: brace-enclosed initializer not allowed here before ‘{’ token no, without complied c++11 compiler, cannot initialize member array in declaration. have initialize array member in constructor. , don't use open array if know number of elements initialize array.
Read more

cytoscape.js - How to add nodes to Dagre layout with Cytoscape -

-
i trying add nodes dagre graph through cityscape.js. problem nodes not painted. code have: cy.add({ group: "nodes", data: { id:"n0",name:"n0",weight: 75 }, }); $.ajax(url).done(function(jsontree){ var newnodes=[]; for(var i=1;i<6;i++){ //var child = jsontree.result[i]; newnodes.push( { group: "nodes", data: { id: "n"+i, name:"n"+i}}, { group: "edges", data: { id: "e"+i, source: "n0", target: "n"+i } } ); } cy.add(newnodes); any ideas? have used loaded function reload graph not work. not know if have use specific function reload graph. thank in advance. you need add positions new nodes. cytoscape.js docs : it important note positions of newly added nodes must defined when calling cy.add(). nodes can not placed in graph without valid position — otherwise not displayed. yo
Read more