d7650p - 経済統計練習帳

<!DOCTYPE html>
 
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">    
        <link rel="stylesheet" href="https://storage.googleapis.com/code.getmdl.io/1.0.6/material.indigo-pink.min.css">
<script src="https://storage.googleapis.com/code.getmdl.io/1.0.6/material.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
 
 
<script  src="jquery.js"></script>
<script  src="svgpaint.js"></script>
    <script  src="sample.js"></script>
    </head>
    <body onload="sample()">
       <div id="memo"></div>
         <div>  
  <input id="but" type="button" value="グラフ" />
  </div>
        <form action="#">
  <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
    <input class="mdl-textfield__input" type="text" id="card">
    <label class="mdl-textfield__label" for="card">csv</label>
  </div>
 
 
 </body>
</html>
 
 
var x=new Array();
var y=new Array();
var number;
var pic;
 
function sample(){
 
  $("#but").click(function(){
 
       pic=$("#card").val();
 
 
       paint(pic);
 
 
        }); 
 
 
 
 
 
}
 
function pol(col){
 
var str,data;
var s;
data="";
 
 
for(s=1;s<number;s++){
data=data+x[s]+","+y[s]+",";
}
s=number;
 
 
data=data+x[s]+","+y[s];
 
str="<polygon fill="+chop(col)+" points="+chop(data)+"/>";
 
return str; 
}
 
function chop(str){
 
var strx;
 
strx="\""+str+"\"";
 
return strx;
 
}
 
function paint(strx){
 
var d=strx.split("E");
 
number=d.length;
 
alert(number); 
 
for(s=0;s<number;s++){
var d2=d[s].split(",");
x[s+1]=d2[0];
y[s+1]=d2[1];        
}
 
 
var strx="";
strx="<svg width=\"700\" height=\"700\">";
strx=strx+pol("red");
strx=strx+"</svg>";
 
 
$("#memo").html(strx);
 
 
}