Commits

anatoly techtonik committed d7c51ea

Resize canvas according to current screen size with JavaScript.

  • Participants
  • Parent commits c99a768

Comments (0)

Files changed (1)

File graphs/index.html

     clear:both;
 }
 
-/* [ ] resize with JavaScript to 70% or depending on
-       width/height screen ratio */
 .canvas {
     float: left;
-    width: 640px;
     margin-left: 2%;
-    min-width: 20em;
     border: 1px solid #AAA;
 }
 
         var graph;
         var canvas = jQuery('.canvas');
 
+        /* [x] set canvas width to 65% of window size */
+        canvas.attr("width", window.innerWidth * 0.65);
+        canvas.attr("height", window.innerHeight * 0.8);
+
+        textarea.css("width", window.innerWidth * 0.25);
+        textarea.css("height", window.innerHeight * 0.8 - 4); // padding:4
+
         function refresh() {
           graph = new Graph();
           graph.loadJSON( textarea.val() );
   <body>
 
 <div class="content">
-  <canvas class="canvas" width="640" height="480"></canvas>
+  <canvas class="canvas"></canvas>
   
   <div class="graphtext">
     <textarea id="graphtext" rows="30">