Колба с динамическим графвизом и пример SVG - PullRequest
Новая
       16

Колба с динамическим графвизом и пример SVG

0 голосов
/ 26 июня 2018

Я пытаюсь создать изображение Graphviz, но вместо сохранения изображения и загрузки на веб-страницу, передайте его как SVG.

Это своего рода работа, вот пример: 

from flask import Flask
from graphviz import Graph


app = Flask(__name__)


@app.route('/svgtest')
def svgtest():
  chart_data = Graph()

  chart_data.node('H', 'Hello')
  chart_data.node('W', 'World')
  chart_data.edge('H', 'W')

  chart_output = chart_data.pipe(format='svg')

 return render_template('svgtest.html', chart_output=chart_output)

На моей странице HTML у меня есть 

<embed type="image/svg+xml" src={{ chart_output|safe }} />

Однако вывод не правильный

output example

Любая помощь была бы очень полезна, я начинаю разговаривать сам с собой, и даже это бесполезно.

Спасибо.

Ответы [ 2 ]

0 голосов
/ 29 октября 2018

Вы можете использовать svg просто так: 

{{ chart_output|safe }}

, а также вы можете использовать формат PNG: 

@app.route('/')
def svgtest():
    chart_data = Graph()

    chart_data.node('H', 'Hello')
    chart_data.node('W', 'World')
    chart_data.edge('H', 'W')


    chart_output = chart_data.pipe(format='png')
    chart_output = base64.b64encode(chart_output).decode('utf-8')

    return render_template('svgtest.html', chart_output=chart_output)

и HTML, как это: 

<img src="data:image/png;base64,{{chart_output|safe}}" />

Удачного кодирования!

0 голосов
/ 26 июня 2018

Атрибут src тега embed должен содержать URL-адрес для встраиваемого содержимого, а не само содержимое:

Элемент HTML <embed>встраивает внешний контент в указанную точку в документе.Это содержимое предоставляется внешним приложением ...

src URL-адрес внедряемого ресурса.

Если вы хотите использовать embed, вам следует предоставитьsvg (без HTML-шаблона) под своим собственным URL-адресом и используйте этот URL-адрес в атрибуте src тега embed.

Или вы можете вставить svg непосредственно в свой HTML-шаблон без embedтег.

...