¿Cómo ocultar código de celdas en ipython notebook visualizado con nbviewer?

Usaría hide_input_all de nbextensions (https://github.com/ipython-contrib/IPython-notebook-extensions ). He aquí cómo:

1. Averigüe dónde está su directorio IPython:

   from IPython.utils.path import get_ipython_dir
   print get_ipython_dir()
   

2. Descargue nbextensions y muévalo al directorio IPython.

3. Edite su personalizado.js archivo en algún lugar del directorio IPython (mine estaba en profile_default/static / custom ) para ser similar a el [22] custom.ejemplo.js en el directorio nbextensions.

4. Añade esta línea a custom.js :

   IPython.load_extensions('usability/hide_input_all')
   

El cuaderno IPython ahora tendrá un botón para alternar las celdas de código, sin importar el libro de trabajo.

La versión más reciente de IPython notebook ya no permite ejecutar javascript en celdas de markdown, por lo que agregar una nueva celda de markdown con el siguiente código javascript ya no funcionará para ocultar sus celdas de código (consulte este enlace)

Cambiar ~/.ipython / profile_default / static / custom / custom.js as below:

code_show=true;
function code_toggle() {
 if (code_show){
 $('div.input').hide();
 } else {
 $('div.input').show();
 }
 code_show = !code_show
}

$([IPython.events]).on("app_initialized.NotebookApp", function () {
  $("#view_menu").append("<li id=\"toggle_toolbar\" title=\"Show/Hide code cells\"><a href=\"javascript:code_toggle()\">Toggle Code Cells</a></li>")
});

Escribí un código que logra esto, y agrega un botón para alternar la visibilidad del código.

Lo siguiente va en una celda de código en la parte superior de un cuaderno:

from IPython.display import display
from IPython.display import HTML
import IPython.core.display as di # Example: di.display_html('<h3>%s:</h3>' % str, raw=True)

# This line will hide code by default when the notebook is exported as HTML
di.display_html('<script>jQuery(function() {if (jQuery("body.notebook_app").length == 0) { jQuery(".input_area").toggle(); jQuery(".prompt").toggle();}});</script>', raw=True)

# This line will add a button to toggle visibility of code blocks, for use with the HTML export version
di.display_html('''<button onclick="jQuery('.input_area').toggle(); jQuery('.prompt').toggle();">Toggle code</button>''', raw=True)

Puede ver un ejemplo de cómo se ve esto en NBviewer aquí.

Actualización: Esto tendrá un comportamiento divertido con las celdas Markdown en Jupyter, pero funciona bien en la versión de exportación HTML del cuaderno.

Para una mejor visualización con un documento impreso o un informe, necesitamos eliminar el botón también, y la capacidad de mostrar u ocultar ciertos bloques de código. Esto es lo que uso (simplemente copie y pegue esto en su primera celda):

# This is a cell to hide code snippets from displaying
# This must be at first cell!

from IPython.display import HTML

hide_me = ''
HTML('''<script>
code_show=true; 
function code_toggle() {
  if (code_show) {
    $('div.input').each(function(id) {
      el = $(this).find('.cm-variable:first');
      if (id == 0 || el.text() == 'hide_me') {
        $(this).hide();
      }
    });
    $('div.output_prompt').css('opacity', 0);
  } else {
    $('div.input').each(function(id) {
      $(this).show();
    });
    $('div.output_prompt').css('opacity', 1);
  }
  code_show = !code_show
} 
$( document ).ready(code_toggle);
</script>
<form action="javascript:code_toggle()"><input style="opacity:0" type="submit" value="Click here to toggle on/off the raw code."></form>''')

Luego en sus próximas celdas:

hide_me
print "this code will be hidden"

Y

print "this code will be shown"

Hay una buena solución proporcionada aquí eso funciona bien para cuadernos exportados a HTML. El sitio web incluso enlaces de vuelta aquí a este post, pero no veo la solución de Chris aquí! (Chris, ¿dónde estás?)

Esta es básicamente la misma solución que la respuesta aceptada de harshil, pero tiene la ventaja de ocultar el código toggle en el HTML exportado. También me gusta que este enfoque evita la necesidad de la función HTML de IPython.

Para implementar esto solución, agregue el siguiente código a una celda 'Raw NBConvert' en la parte superior de su notebook:

<script>
  function code_toggle() {
    if (code_shown){
      $('div.input').hide('500');
      $('#toggleButton').val('Show Code')
    } else {
      $('div.input').show('500');
      $('#toggleButton').val('Hide Code')
    }
    code_shown = !code_shown
  }

  $( document ).ready(function(){
    code_shown=false;
    $('div.input').hide()
  });
</script>
<form action="javascript:code_toggle()">
  <input type="submit" id="toggleButton" value="Show Code">
</form>

Luego simplemente exporte el cuaderno a HTML. Habrá un botón de alternancia en la parte superior de la libreta para mostrar u ocultar el código.

Chris también proporciona un ejemplo aquí.

Puedo verificar que esto funciona en Jupyter 5.0.0

Actualización : También es conveniente mostrar / ocultar los elementos div.prompt junto con los elementos div.input. Esto elimina el In [##]: y Out: [##] texto y reduce los márgenes a la izquierda.

Utilice las herramientas Runtools que extienden el cuaderno básico de IPython:

Https://github.com/ipython-contrib/IPython-notebook-extensions/wiki/Runtools

Esto renderizará una salida de notebook IPython. Sin embargo, notará que podrá ver el código de entrada. Puede copiar un cuaderno y luego agregar este código si es necesario para compartirlo con alguien que no necesite ver el código.

from IPython.display import HTML

HTML('''<script> $('div .input').hide()''')

Aquí hay otra solución sugerida por p3trus :

$([IPython.events]).on('notebook_loaded.Notebook', function(){
    IPython.toolbar.add_buttons_group([
        {
             'label'   : 'toggle input cells',
             'icon'    : 'icon-refresh', 
             'callback': function(){$('.input').slideToggle()}
        }
    ]);
});

Según lo descrito por p3trus: "[It] agrega un botón a la barra de herramientas del cuaderno ipython para ocultar/mostrar la celda del código de entrada. Para usarlo, tienes que poner la costumbre.js en su carpeta .ipython_<profile name>/static/custom/, donde es el perfil ipython en uso."

Mis propios comentarios: He verificado esta solución y funciona con IPython 3.1.0.

Esto ahora es posible directamente desde nbconvert a partir de la versión 5.2.1: el contenido se puede filtrar utilizando las opciones de exclusión del exportador de plantillas integradas. Por ejemplo:

jupyter nbconvert --to pdf --TemplateExporter.exclude_input=True my_notebook.ipynb

Excluirá las celdas de "código de entrada", es decir, el código en sí. Existen opciones similares para excluir solicitudes, celdas de rebaja o salidas, o ambas entradas y salidas.

(Estas opciones deben funcionar independientemente del formato de salida.)

(Papel) Imprimir o Guardar como HTML

Para aquellos de ustedes que deseen imprimir en papel las salidas de las respuestas anteriores por sí solas no parecen dar un resultado final agradable. Sin embargo, tomar el código de @Max Masnick y agregar lo siguiente permite imprimirlo en una página A4 completa.

from IPython.display import display
from IPython.display import HTML
import IPython.core.display as di

di.display_html('<script>jQuery(function() {if (jQuery("body.notebook_app").length == 0) { jQuery(".input_area").toggle(); jQuery(".prompt").toggle();}});</script>', raw=True)

CSS = """#notebook div.output_subarea {max-width:100%;}""" #changes output_subarea width to 100% (from 100% - 14ex)
HTML('<style>{}</style>'.format(CSS))

La razón de la sangría es que la sección del prompt eliminada por Max Masnick significa que todo se desplaza a la izquierda en la salida. Esto sin embargo no hizo nada para el ancho máximo de la salida que era restringido a max-width:100%-14ex;. Esto cambia el ancho máximo del output_subarea a max-width:100%;.

La solución aceptada también funciona en julia Jupyter / IJulia con las siguientes modificaciones:

display("text/html", """<script>
code_show=true; 
function code_toggle() {
 if (code_show){
 \$("div.input").hide();
 } else {
 \$("div.input").show();
 }
 code_show = !code_show
} 
\$( document ).ready(code_toggle);
</script>
<form action="javascript:code_toggle()"><input type="submit" value="Click here to toggle on/off the raw code."></form>""")

Nota en particular:

• utilice la función display
• escape el signo $ (visto de otro modo como una variable)

Con todas las soluciones anteriores a pesar de que está ocultando el código, todavía obtendrá la basura [<matplotlib.lines.Line2D at 0x128514278>] por encima de su figura que probablemente no desea.

Si realmente quieres deshacerte de la entrada en lugar de solo ocultarla, creo que la solución más limpia es guardar sus figuras en el disco en celdas ocultas, y luego incluir las imágenes en celdas de Markdown usando, por ejemplo, ![Caption](figure1.png).

Aquí es un buen artículo (el mismo @Ken publicado) sobre cómo pulir Jpuyter (el nuevo IPython) cuadernos para la presentación. Hay innumerables formas de extender Jupyter utilizando JS, HTML y CSS, incluida la capacidad de comunicarse con el núcleo python del notebook desde javascript. Hay decoradores mágicos para %%HTML y %%javascript así que puedes hacer algo como esto en una celda por sí mismo:

%%HTML
<script>
  function code_toggle() {
    if (code_shown){
      $('div.input').hide('500');
      $('#toggleButton').val('Show Code')
    } else {
      $('div.input').show('500');
      $('#toggleButton').val('Hide Code')
    }
    code_shown = !code_shown
  }

  $( document ).ready(function(){
    code_shown=false;
    $('div.input').hide()
  });
</script>
<form action="javascript:code_toggle()"><input type="submit" id="toggleButton" value="Show Code"></form>

También puedo confirmar que los métodos de Chris funcionan en jupyter 4.X. X.