search

jcdterry / bipartiteD3

Repository for R package bipartiteD3
GNU General Public License v2.0
0 stars 0 forks source link

The same code does not work anymore with problems of vizjs #4

Open anbai106 opened 1 month ago

anbai106 commented 1 month ago

Hi,

I found out today the same code worked before did not work anymore and produced the following error:

trying URL 'http://vizjs.org/viz.v1.1.0.min.js'
Content type 'text/html' length 114 bytes

downloaded 114 bytes

Command for sourcing the URL:
  downloader::source_url("http://vizjs.org/viz.v1.1.0.min.js", sha="f9d9055e9878723a12063b47d4a1a5f58c3eb1e9")
trying URL 'http://vizjs.org/viz.v1.1.0.min.js'
Content type 'text/html' length 114 bytes

downloaded 114 bytes

Command for sourcing the URL:
  downloader::source_url("http://vizjs.org/viz.v1.1.0.min.js", sha="f9d9055e9878723a12063b47d4a1a5f58c3eb1e9")
Called from: eval(expr, p)
Warning messages:
1: In doTryCatch(return(expr), name, parentenv, handler) :
  Hash of http://vizjs.org/viz.v1.1.0.min.js doesn't match stored hash, so not downloading in case it has been modified.
                Please save an up-to-date version of the viz.js library as vizjs.js library in the working directory
2: In doTryCatch(return(expr), name, parentenv, handler) :
  Hash of http://vizjs.org/viz.v1.1.0.min.js doesn't match stored hash, so not downloading in case it has been modified.
                Please save an up-to-date version of the viz.js library as vizjs.js library in the working directory

After I typed d3 object in the RStudio, I found this:

Error: vizjs is not defined in (Fig.js#-2:1) ReferenceError: vizjs is not defined

anbai106 commented 1 month ago

I got the same issue discussed here: https://stackoverflow.com/questions/78640069/bipartite-d3-giving-referenceerror-vizjs-is-not-defined-error-and-not-runnin

When I tried to download the source from RStudio, I got this error:

source_url("http://vizjs.org/viz.v1.1.0.min.js", sha="f9d9055e9878723a12063b47d4a1a5f58c3eb1e9")
trying URL 'http://vizjs.org/viz.v1.1.0.min.js'
Content type 'text/html' length 114 bytes
downloaded 114 bytes

Hash f9d9055e9878723a12063b47d4a1a5f58c3eb1e9 matches expected value.
Error in source(temp_file, ...) : 
  /var/folders/5j/b_hrkbf929d1sm5qdjyn1kx80000gn/T//RtmpPUT03w/file96d3e4b01c0:1:1: unexpected '<'
1: <
    ^

When I tried to open the web link (http://vizjs.org/viz.v1.1.0.min.js) in Google Chrome, I got this:

Screenshot 2024-07-17 at 9 44 12 AM
anbai106 commented 1 month ago

Here are the .css and .js output files:

CSS

.mainBars{
    shape-rendering: auto;
    fill-opacity: 1;
    stroke-width: 0.5px;
    stroke: rgb(0, 0, 0);
    stroke-opacity: 0;
  }
    .subBars{
    shape-rendering:crispEdges;
    }
    .edges{
    stroke:none;
    fill-opacity:0.3;
    }
    .label{
    color:#000000;
    }

JS

var data=[["C1024","ADAM22",1],
["C128","ADAM22",0],
["C256","ADAM22",0],
["C32","ADAM22",0],
["C512","ADAM22",0],
["C64","ADAM22",0],
["C1024","APLP1",0],
["C128","APLP1",0],
["C256","APLP1",0],
["C32","APLP1",2],
["C512","APLP1",0],
["C64","APLP1",1],
["C1024","BAIAP2",2],
["C128","BAIAP2",0],
["C256","BAIAP2",0],
["C32","BAIAP2",0],
["C512","BAIAP2",1],
["C64","BAIAP2",0],
["C1024","BCAN",102],
["C128","BCAN",22],
["C256","BCAN",23],
["C32","BCAN",17],
["C512","BCAN",38],
["C64","BCAN",22],
["C1024","CCL18",1],
["C128","CCL18",0],
["C256","CCL18",0],
["C32","CCL18",0],
["C512","CCL18",0],
["C64","CCL18",0],
["C1024","CCL27",0],
["C128","CCL27",0],
["C256","CCL27",0],
["C32","CCL27",1],
["C512","CCL27",0],
["C64","CCL27",1],
["C1024","CD99L2",1],
["C128","CD99L2",0],
["C256","CD99L2",0],
["C32","CD99L2",0],
["C512","CD99L2",0],
["C64","CD99L2",0],
["C1024","DPP6",0],
["C128","DPP6",0],
["C256","DPP6",0],
["C32","DPP6",1],
["C512","DPP6",0],
["C64","DPP6",1],
["C1024","FABP4",0],
["C128","FABP4",0],
["C256","FABP4",0],
["C32","FABP4",4],
["C512","FABP4",0],
["C64","FABP4",2],
["C1024","FGF21",1],
["C128","FGF21",0],
["C256","FGF21",0],
["C32","FGF21",1],
["C512","FGF21",0],
["C64","FGF21",0],
["C1024","GDF15",1],
["C128","GDF15",0],
["C256","GDF15",0],
["C32","GDF15",1],
["C512","GDF15",0],
["C64","GDF15",0],
["C1024","GGT1",3],
["C128","GGT1",0],
["C256","GGT1",0],
["C32","GGT1",0],
["C512","GGT1",2],
["C64","GGT1",0],
["C1024","IGF2R",1],
["C128","IGF2R",0],
["C256","IGF2R",0],
["C32","IGF2R",0],
["C512","IGF2R",0],
["C64","IGF2R",0],
["C1024","IGSF9",5],
["C128","IGSF9",0],
["C256","IGSF9",0],
["C32","IGSF9",0],
["C512","IGSF9",1],
["C64","IGSF9",0],
["C1024","KLK6",75],
["C128","KLK6",5],
["C256","KLK6",5],
["C32","KLK6",6],
["C512","KLK6",25],
["C64","KLK6",7],
["C1024","LEP",4],
["C128","LEP",3],
["C256","LEP",2],
["C32","LEP",1],
["C512","LEP",3],
["C64","LEP",2],
["C1024","MOG",189],
["C128","MOG",36],
["C256","MOG",48],
["C32","MOG",23],
["C512","MOG",81],
["C64","MOG",33],
["C1024","MZB1",19],
["C128","MZB1",1],
["C256","MZB1",2],
["C32","MZB1",1],
["C512","MZB1",5],
["C64","MZB1",1],
["C1024","NCAN",123],
["C128","NCAN",43],
["C256","NCAN",45],
["C32","NCAN",21],
["C512","NCAN",69],
["C64","NCAN",37],
["C1024","NELL2",0],
["C128","NELL2",1],
["C256","NELL2",1],
["C32","NELL2",0],
["C512","NELL2",0],
["C64","NELL2",1],
["C1024","NOTCH3",0],
["C128","NOTCH3",0],
["C256","NOTCH3",0],
["C32","NOTCH3",0],
["C512","NOTCH3",1],
["C64","NOTCH3",0],
["C1024","OMG",0],
["C128","OMG",0],
["C256","OMG",0],
["C32","OMG",2],
["C512","OMG",1],
["C64","OMG",1],
["C1024","PTPRN2",1],
["C128","PTPRN2",8],
["C256","PTPRN2",4],
["C32","PTPRN2",7],
["C512","PTPRN2",1],
["C64","PTPRN2",6],
["C1024","SCG3",1],
["C128","SCG3",1],
["C256","SCG3",1],
["C32","SCG3",5],
["C512","SCG3",1],
["C64","SCG3",2],
["C1024","SEZ6L",1],
["C128","SEZ6L",3],
["C256","SEZ6L",1],
["C32","SEZ6L",3],
["C512","SEZ6L",1],
["C64","SEZ6L",3],
["C1024","SLITRK1",4],
["C128","SLITRK1",9],
["C256","SLITRK1",8],
["C32","SLITRK1",12],
["C512","SLITRK1",7],
["C64","SLITRK1",8],
["C1024","VGF",0],
["C128","VGF",0],
["C256","VGF",1],
["C32","VGF",1],
["C512","VGF",0],
["C64","VGF",0]]

 function sort(sortOrder){
                    return function(a,b){ return d3.ascending(sortOrder.indexOf(a),sortOrder.indexOf(b)) }
                  }
var color = {'Unlinked':'#3366CC','C32':'#387AA4','C64':'#4A9078','C128':'#EB5F2C','C256':'#CEBB30','C512':'#E89935','C1024':'#5A2657'};

var g1 = svg.append("g").attr("transform","translate(240,50)");
                         var bp1=viz.bP()
                         .data(data)
                         .value(d=>d[2])
                         .min(20)
                         .pad(5)
                         .height(2500)
                         .width(300)
                         .barSize(30)
                         .fill(d=>color[d.primary])
.sortSecondary(sort(["KLK6","MZB1","NCAN","MOG","BCAN","OMG","SEZ6L","PTPRN2","FGF21","APLP1","SLITRK1","LEP","FABP4","SCG3","CCL27","VGF","DPP6","GDF15","NELL2","IGSF9","GGT1","BAIAP2","NOTCH3","ADAM22","CD99L2","CCL18","IGF2R"]))
.sortPrimary(sort(["C32","C64","C128","C256","C512","C1024"]))
.orient("vertical");

g1.call(bp1);g1.append("text")
                        .attr("x",-50).attr("y",-8)
                        .style("text-anchor","middle")
                        .text("Brain_category");
                        g1.append("text")
                        .attr("x", 250)
                        .attr("y",-8).style("text-anchor","middle")
                        .text("Protein");
                        g1.append("text")
                        .attr("x",100).attr("y",-25)
                        .style("text-anchor","middle")
                        .attr("class","header")
                        .text("Site Name");

 g1.selectAll(".mainBars")
                        .on("mouseover",mouseover)
                        .on("mouseout",mouseout);

 g1.selectAll(".mainBars").append("text").attr("class","label")
                        .attr("x",d=>(d.part=="primary"? -20:20))
                        .attr("y",d=>+6)
                        .text(d=>d.key)
                        .attr("text-anchor",d=>(d.part=="primary"? "end": "start"));

 g1.selectAll(".mainBars").append("text").attr("class","perc")
                        .attr("x",d=>(d.part=="primary"? -200:200))
                        .attr("y",d=>+6)
                        .text(function(d){ return d3.format("0.0%")(d.percent)})
                        .attr("text-anchor",d=>(d.part=="primary"? "end": "start")); 

function mouseover(d){
bp1.mouseover(d);
                            g1.selectAll(".mainBars")
                            .select(".perc")
                            .text(function(d){ return d3.format("0.0%")(d.percent)});
}

                     function mouseout(d){
bp1.mouseout(d);
                            g1.selectAll(".mainBars")
                            .select(".perc")
                            .text(function(d){ return d3.format("0.0%")(d.percent)});
}