27/09/2015

[D3.js]Bar chart



var dataset = [];
for (var i=0; i < 15; i++) {
var newnumber = Math.floor(Math.random() * 30) + 5;
dataset.push(newnumber);
}

var w = 500;
var h = 500;
var barPadding = 1;

var svg = d3.select("body")
.append("svg")
.attr("width",w)
.attr("height",h);
var rect = svg.selectAll("rect")
.data(dataset)
.enter()
.append("rect")
.attr({ //multivalue map
x: function(d,i){return i* ( w / dataset.length);},
y: function(d){return (h - d* 10);},
width: (w / dataset.length - barPadding),
height: function(d){return (d * 10);},
fill: function(d){return "rgb(0,0," + ( d * 10) + ")"},
});
var text = svg.selectAll("text")
.data(dataset)
.enter()
.append("text")
.text(function (d){
return d;
})
.attr({ //multivalue map
x: function(d,i){return i* ( w / dataset.length) + 15;},
y: function(d){return (h - d* 10) + 20;},
width: (w / dataset.length - barPadding),
height: function(d){return (d * 10);},
fill: "white",
"font-size": "15px",
"text-anchor": "middle",
});

[D3.js]SVG code

<svg width="500" height="500">
<circle cx="150" cy="150" r="100" class="dancircle"/>
<text x="300" y="250">Circle</text>
</svg>

26/09/2015

[D3.js]HTML +CSS +Javascript +D3 Basic coding

<!DOCTYPE html>
 <html lang="en">
 <head>
<!--Call D3-->
<meta charset="utf-8">
<script type="text/javascript" src="d3/d3.js">
                </script>

<title></title>

<!--Call CSS-->
<link rel="stylesheet" type="text/css" href="mystyle.css">

</head>

<body>

<!--Call JS-->
<script type="text/javascript" src="myscript.js"></script>

</body>
</html>

06/09/2015

[SAS]Create dummy variables

data b;
set a;
dummuy_a = (a="Y");
/*if a = Y then dummy_a = 1 else dummy_a  =0*/
run;

[SAS]Sampling - Proc Surveyselect V.S. data step

Suppose you wish to select a random sample from a large SAS dataset.  No problem. The PROC SURVEYSELECT step below randomly selects a 2 percent sample:
proc surveyselect data=large out=sample
  method=srs   /* simple random sample */
  n=1000000;  /* sample size */
run;
Do you have a SAS/STAT license?   If not, or if you seek maximum efficiency, keep reading.
I benchmarked the above program against a SAS dataset with 50 million rows and 3 columns, running SAS 9.4 on my 64-bit Windows 7 machine.
Time: 2.8 seconds
Is the DATA step more efficient?  It might be, if you know some tricks.  Let's look at a few.
The DATA step below selects a random sample of approximately 1 million rows.
899  data sample;
900     set large;
901     if rand('uniform') < .02;
902  run;
 
NOTE: There were 50000000 observations read from the data set WORK.LARGE.
NOTE: The data set WORK.SAMPLE has 1001125 observations and 3 variables.
NOTE: DATA statement used (Total process time):
      real time           3.31 seconds
      cpu time            3.29 seconds
The RAND function generates random numbers between 0 and 1.  The UNIFORM argument means that every value between 0 and 1 has an equal chance of being generated.  The subsetting IF statement selects a random sample of approximately 2 percent.
Time: 3.3 seconds  (Winner: PROC SURVEYSELECT, but keep reading)
The SET statement above reads all 50 million rows by default, which are then filtered by the subsetting IF statement.  We can, however, change the SET statement to read only 1 million rows, bypassing the other 49 million, for a huge performance improvement, like this:
data sample;
   set large (obs=1000000);
run;
Time:  .1 second
This, of course, is cheating, because the DATA step above reads the first million rows, which is not a random sample.
The DATA step below, like the one above, also reads only 1 million rows, bypassing the other 49 million, for very fast performance.  This time, instead of reading the first million rows, the SET statement reads every 50th row.
data sample;
   do RowNum=50 to 50000000 by 50;
   set large point=RowNum;
   output;
   end;
   stop;
run;
The POINT= option designates a numeric variable whose value represents a row number.  The SET statement jumps directly to each designated row, and reads that row, bypassing intervening rows.
The selected sample may be more representative than the first million rows, but it's still not random.
Time:  .9 second
The DATA step below, like the two above, also reads only 1 million rows, bypassing the other 49 million.  This time, however, the datastep selects a random sample, comparable to PROC SURVEYSELECT.
data sample;
 
   drop Need Pool Ratio Row;
 
   Need= 1000000;  * Desired sample size;
   Pool=50000000;  * Number of rows in dataset;
 
   do until (Need=0);         * Continue until no additional sample rows needed;
 
      Row+1;   * Row number. Every row in the pool is a candidate           
                 for possible inclusion in the sample;
 
      Ratio=Need/Pool;          * Initial ratio is .02 or 2 percent.  
  Ratio is continuoulsy adjusted as necessary;
 
if rand('uniform') < ratio then do; * Expression will be true for 
    exactly 2 percent of rows;
 
        set large point=Row;     * Jump to desired row. Read desired row;
     output;       * Output desired row;
     Need=Need-1;      * Because a row was selected, subtract 1  
  from remaining rows needed.;
  end;
 
      Pool=Pool-1;       * Subtract 1 from pool, regardless of       
  whether a row was selected or not;
 
   end;
 
   stop;
 
run;
Method                                      Time                                Advantage
PROC SURVEYSELECT        2.8 seconds                    ease of use
DATA step                                 2.2 seconds                    speed

[D3.js]Simple Bar Chart




















<!doctype html>
<html>
<head>

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>

</head>
<body>

<script>

var dataArray =[20, 40, 100];

var canvas = d3.select("body")
.append("svg")
.attr("width", 500)
.attr("height", 500);

var bars = canvas.selectAll("rect")
.data(dataArray)
.enter()
.append("rect")
.attr("width", function(d){return d;})
.attr("height", 50)
.attr("y", function(d,i){return i*100;});

</script>


</body>

</html>

05/09/2015

[D3.js]First Class from youyube learning

D3 =  Data-Driven Documents

<!doctype html>
<html>

<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>
</head>

<body>
<p> this is a paragraph</p>

<script>
d3.select("body")
.append("p")
.style("color","red")
.text("Hi");


   console.log(d3)
</script>

</body>
</html>

## using notepad++

SVG shapes
var canvas = d3.select("body")
.append("svg")
.attr("width",500)
.attr("height",500);

var circle = canvas.append("circle")
.attr("cx",250)
.attr("cy",250)
.attr("r",250)
.attr("fill","red")