Enable to render png image on GitHub viewer

Author: domitry

lib/nyaplot/exportable.rb

@@ -3,14 +3,16 @@ module Nyaplot
   # !! Classes to include PlotBase should have #to_json. !!
   # 
   module Exportable
+    PATH_NYAPLOT = "https://cdn.rawgit.com/domitry/Nyaplotjs/bb48705474f7878c0a83f267675e019658421b52/release/nyaplot"
+    
     def raise_display_failed
       raise "This method works only on IRuby. Use #export_html or install IRuby."
     end
 
     # generate static html file
     # @return [String] generated html
-    def generate_html(to_png=false)
-      path = File.expand_path("../templates/iruby.erb", __FILE__)
+    def generate_html(temp_path)
+      path = File.expand_path(temp_path, __FILE__)
       id = SecureRandom.uuid
       model = to_json
       template = File.read(path)
@@ -20,8 +22,7 @@ def generate_html(to_png=false)
     # export static html file
     def export_html(path="./plot.html", to_png=false)
       path = File.expand_path(path, Dir::pwd)
-      body = generate_html(to_png)
-      
+      body = generate_html("../templates/iruby.erb")
       temp_path = File.expand_path("../templates/static_html.erb", __FILE__)
       template = File.read(temp_path)
       num = File.write(path, ERB.new(template).result(binding))
@@ -30,14 +31,14 @@ def export_html(path="./plot.html", to_png=false)
 
     def to_png
       raise_display_failed unless defined? IRuby
-      html = generate_html(true)
+      html = generate_html("../templates/to_png.erb")
       IRuby.display html, mime: 'text/html'
     end
 
     # show plot automatically on IRuby notebook
     def to_iruby
       raise_display_failed unless defined? IRuby
-      html = generate_html
+      html = generate_html("../templates/iruby.erb")
       ['text/html', html]
     end
 

lib/nyaplot/templates/iruby.erb

@@ -1,14 +1,10 @@
 <div id='vis-<%= id %>'></div>
 <script>
  require.config({paths: {
-   Nyaplot: "https://cdn.rawgit.com/domitry/Nyaplotjs/a885e2d919adeb6919bf256fd078ea36b052f2e7/release/nyaplot"
+   Nyaplot: "<%= PATH_NYAPLOT %>"
  }});
 
  require(["Nyaplot"], function(Nyaplot){
-   <% if to_png == true  %>
-   Nyaplot.core.to_png('#vis-<%= id %>', <%= model %>);
-   <% else %>
    Nyaplot.core.parse('#vis-<%= id %>', <%= model %>);
-   <% end  %>
  });
 </script>

lib/nyaplot/templates/to_png.erb

@@ -0,0 +1,40 @@
+<div id='vis-<%= id %>'></div>
+<script>
+ require.config({paths: {
+   Nyaplot: "<%= PATH_NYAPLOT %>"
+ }});
+
+ require(["Nyaplot"], function(Nyaplot){
+   var vis_id = "vis-<%= id %>";
+   var pr = Nyaplot.core.to_png('#'+vis_id, <%= model %>);
+
+   function searchCell(uuid){
+     var n = IPython.notebook.ncells();
+     for(var i=0; i<n; i++){
+       var cell = IPython.notebook.get_cell(i);
+       var outputs = cell.output_area.outputs.filter(function(out){
+         var html = out.data["text/html"];
+         if(typeof html == "undefined")return false;
+         if(html.includes(uuid))return true;
+         return false;
+       });
+       if(outputs.length>0)return cell;
+     }
+     return null;
+   }
+
+   if(typeof window.IPython != "undefined"){
+     pr.then(function(selection){
+       try{
+         var html = selection.node().outerHTML;
+         var cell = searchCell(vis_id);
+         if(cell == null)throw new Error("The cell whose id is " + vis_id + " not found.");
+         cell.output_area.outputs[0].data["text/html"] = html;
+       }
+       catch(e){
+         console.warn("Maybe the front-end API of Jupyter has changed.\nmessage:" + e.message);
+       }
+     });
+   }
+ });
+</script>