如何在使用django构建的主页上显示jupyter笔记本?

时间:2017-08-12 18:29:09

标签: html django jupyter-notebook ipython-notebook django-1.11

环境:

Python 3.6
Django 1.11

我将.ipynb文件保存为.html,因为我想实现此html以在我的主页上显示它(尚未在线)。

我在我的主页上使用Bootstrap 4.0 beta作为样式。我有一个导航栏继承到这个项目的任何html文件,它完全正常。

但是当我不继承导航栏时,jupyter笔记本的HTML文件才能正确显示。如果我尝试继承,则导航栏不再显示正确。

我的计划是建立自己的博客,我发布markdown文件(当我不包括Python或R代码时)或jupyter笔记本或rmarkdown笔记本。

RMarkdown或Jupyter笔记本都可以转换为html,markdown或pdf。但是,尝试过前2,它不起作用。如果在浏览器中打开,它们会完全显示,众所周知。但当然我想保持已经实现的导航。

所以我希望你能给我一个如何做到这一点的暗示;我还是初学者,尤其是Django。但我尝试了很多东西:

  1. 我首先准备好了我的主页并使用了Django app zinnia。我可以使用可用的结果发布RMarkdown,但不能发布Jupyter笔记本(因为同样的问题)。
  2. 我尝试转换成Markdown并在百日草中使用它,但结果更糟。
  3. 试图操纵笔记本的html文件,但这并没有改变任何东西。
  4. 尝试在终端中使用nbconvert手动转换(我认为这是相同的转换方法,因为没有区别)
  5. 从头开始构建新页面(这次使用bootstrap 4,而我首先使用3)。但同样的问题仍然存在。
  6. 唯一有效的方法是省略导航栏或省略样式。但显然其他人已经找到了完美的解决方案,因为网上有很多页面可以很好地实现jupyter笔记本。

    我有一个base.html,其中创建了导航栏并加载了引导样式。所有其他html文件都继承自此文件:

    {% extends 'base.html' %}
    {% block content %}
    
    (here is the individual html content or the html code of the jupyter notebook)
    
    {% endblock %}
    

    编辑: 我刚刚发现了这个:https://nipunbatra.github.io/blog/2017/Jupyter-powered-blog.html

    看起来这个人在遇到同样的问题时找到了办法,但我无法理解一切。

    如果您有提示,请告诉我。对于遇到同样问题的所有人,也许您可​​以使用该博客文章中的信息解决问题。

1 个答案:

答案 0 :(得分:0)

虽然我没有完美的解决方案,但我认为这只是花一些时间清理前端外观的问题。我对js等不满意,但是在后端我做了几件事。

  • nbconvertbasic模板一起使用,如您的博客中所述
  • 在Django中使用FileField模型上传此图片
  • 为此创建视图;可能是列表和详细信息视图

要计算的左侧为:

  • 创建一个模板,以获取基本的html文件并按照样式表进行修饰

正如我所说,我已经完成了前三个步骤,但是输出却很丑陋。您也可以尝试使用ipypublish进行HTML转换。对我而言,Jupyter拥有一个博客很有趣,但是我找不到有关他们如何或是否使用笔记本来制作笔记本的任何文档...