Python 将叶贴图插入jinja模板_Python_Html_Flask_Jinja2_Folium

Python 将叶贴图插入jinja模板

python html flask

Python 将叶贴图插入jinja模板,python,html,flask,jinja2,folium,Python,Html,Flask,Jinja2,Folium,我想在jinja模板中插入follium映射 run.py from flask import Flask, render_template app = Flask(__name__) @app.route('/') def index(): start_coords = (46.9540700, 142.7360300) folium_map = folium.Map(location=start_coords, zoom_start=14) folium_ma

我想在jinja模板中插入follium映射

run.py

from flask import Flask, render_template

app = Flask(__name__)



@app.route('/')
def index():
    start_coords = (46.9540700, 142.7360300)
    folium_map = folium.Map(location=start_coords, zoom_start=14)
    folium_map.save()
    return render_template('index.html', folium_map=folium_map)


    if __name__ == '__main__':
    app.run(debug=True)

from flask import Flask, render_template
import folium

app = Flask(__name__)

@app.route('/')
def index():
    start_coords = (46.9540700, 142.7360300)
    folium_map = folium.Map(location=start_coords, zoom_start=14)
    folium_map.save('templates/map.html')
    return render_template('index.html')

if __name__ == '__main__':
    app.run(debug=True)

模板/index.html-烧瓶的jinja模板

{% extends "layout.html" %}
{% block title %}Test{% endblock %}
{% block head %}
{{ super() }}
{% endblock %}
{% block body %}
**<div><!--Folium map here-->{{ folium_map }}</div>**
{% endblock %}

{%extends“layout.html”%}
{%block title%}测试{%endblock%}
{%block head%}
{{super（）}}
{%endblock%}
{%block body%}
**{{folium_map}}**
{%endblock%}

我的站点显示当前行：

<folium.folium.Map object at 0x00000000069D5DA0>

但我需要在这个div块中生成方法follium_map.save（'map.html'）的map

我该怎么做？

您可以使用

folium\u map.save（'templates/map.html'）

保存生成的html。然后您可以使用jinja2来

{%include“map.html”%}

。生成的HTML在包装时不渲染一个映射，如“强”> div <强>标签，如果需要封装，请考虑使用./p> 文件结构

myapp
├── run.py
└── templates
    ├── index.html
    └── layout.html

run.py

from flask import Flask, render_template

app = Flask(__name__)



@app.route('/')
def index():
    start_coords = (46.9540700, 142.7360300)
    folium_map = folium.Map(location=start_coords, zoom_start=14)
    folium_map.save()
    return render_template('index.html', folium_map=folium_map)


    if __name__ == '__main__':
    app.run(debug=True)

from flask import Flask, render_template
import folium

app = Flask(__name__)

@app.route('/')
def index():
    start_coords = (46.9540700, 142.7360300)
    folium_map = folium.Map(location=start_coords, zoom_start=14)
    folium_map.save('templates/map.html')
    return render_template('index.html')

if __name__ == '__main__':
    app.run(debug=True)

layout.html

<!DOCTYPE HTML>
<head>
  <title>{% block title %}{% endblock %}</title>
</head>
<body>
  <header>{% block head %}{% endblock %}</header>
  {% block body %}{% endblock %}
</body>
</html>

{% extends "layout.html" %}
{% block title %} Test {% endblock %}
{% block head %} {{ super() }} {% endblock %}
{% block body %}
    {% include "map.html" %}
{% endblock %}

使用iframe和render_模板的不同解决方案

<iframe class="map", src="/get_map" width="1100" height="600"></iframe>

在呈现httpd（在AWS beanstalk上）/flask之前，如果没有复制到随机文件名，调试环境将无法获取folium html模板的新实例。缓存控制是不需要的，但它是我试验得出的解决方案的一部分。显然，此解决方案不是线程安全的

也许它就是解决方案。首先，我们在templates文件夹中将一个文件夹映射保存为html文件。然后我们创建一个Flask路由来呈现另一个html文件。在该html文件上，我们创建一个iframe元素来调用我们的映射

以下是文件结构：

proectApp
├── app.py
└── templates
    ├── index.html
    └── map.html

将从myapp.py自动创建对开本地图文件（map.html）。在app.py上，我将创建两条主路径：第一条是主路径，它将呈现index.html&创建map.html。然后，另一个是渲染folium map（map.html）。代码如下：

app.py

from flask import Flask, render_template

app = Flask(__name__)



@app.route('/')
def index():
    start_coords = (46.9540700, 142.7360300)
    folium_map = folium.Map(location=start_coords, zoom_start=14)
    folium_map.save()
    return render_template('index.html', folium_map=folium_map)


    if __name__ == '__main__':
    app.run(debug=True)

from flask import Flask, render_template
import folium

app = Flask(__name__)

@app.route('/')
def index():
    start_coords = (46.9540700, 142.7360300)
    folium_map = folium.Map(location=start_coords, zoom_start=14)
    folium_map.save('templates/map.html')
    return render_template('index.html')

if __name__ == '__main__':
    app.run(debug=True)

从烧瓶导入烧瓶，渲染\u模板
进口叶
app=烧瓶（名称）
@应用程序路径（“/”）
def index（）：
起始坐标=（-6.1753924106.8271528）
叶面图=叶面图(
位置=启动坐标，
缩放开始=17
)
folium_map.save（'templates/map.html'）
返回渲染模板（'index.html'）
@应用程序路径（“/map”）
def map（）：
返回渲染模板（'7\u map.html'）
如果uuuu name uuuuuu='\uuuuuuu main\uuuuuuu'：
app.run（debug=True）

index.html

<!DOCTYPE HTML>
<head>
  <title>{% block title %}{% endblock %}</title>
</head>
<body>
  <header>{% block head %}{% endblock %}</header>
  {% block body %}{% endblock %}
</body>
</html>

{% extends "layout.html" %}
{% block title %} Test {% endblock %}
{% block head %} {{ super() }} {% endblock %}
{% block body %}
    {% include "map.html" %}
{% endblock %}


叶状图
根据您所做的操作，在烧瓶上渲染对页，您可能只想使用：。谢谢！在找到你的答案之前，我一直在努力做到这一点。我希望添加一个javascript函数，将坐标数据返回给python。有没有一种方法可以将JS添加到folium生成的html中？在本例中，我认为可以在调用render\u template
之前修改map.html或layout.html。。。或者，您可以生成一个临时布局文件，并使用index.html的extends
块中的变量引用它。谢谢，在调用render\u template之前修改map.html已成功！您需要将return render\u template（'7\u map.html'）
更改为return render\u template（'map.html'）
，否则会出现jinja2.exceptions.TemplateNotFound:7\u map.html
错误。