Question

我看到这个question关于如何在Jupyter笔记本中可视化张量流图。我发现这个答案来自this示例，只有一个修改（tensor.tensor_content = bytes("<stripped %d bytes>"%size, 'utf-8')被tensor.tensor_content = "<stripped %d bytes>"%size替换）。但是，如果我尝试在tensorflow_inception_graph.pb上重新运行，则可视化效果不起作用：iframe为白色且没有显示节点。

如果你向我解释我做错了什么，我将非常感激。这里有一个简单的例子来重现这个问题。

导入：

%matplotlib inline
%config InlineBackend.figure_format = 'retina'

import tensorflow as tf
import numpy as np

from IPython.display import clear_output, Image, display, HTML

创建图表：

graph = tf.Graph()
sess = tf.InteractiveSession(graph=graph)

x = tf.placeholder(tf.float32, shape=[None, 25, 25, 3], name='x')
y_true = tf.placeholder(tf.float32, shape=[None, 10], name='y_true')
y_true_cls = tf.argmax(y_true, dimension=1, name='y_true_cls')

print graph.get_operations()

输出：

[<tensorflow.python.framework.ops.Operation at 0x115902850>,
 <tensorflow.python.framework.ops.Operation at 0x115902690>,
 <tensorflow.python.framework.ops.Operation at 0x115902b10>,
 <tensorflow.python.framework.ops.Operation at 0x1159029d0>]

可视化功能：

def strip_consts(graph_def, max_const_size=32):
    """Strip large constant values from graph_def."""
    strip_def = tf.GraphDef()
    for n0 in graph_def.node:
        n = strip_def.node.add() 
        n.MergeFrom(n0)
        if n.op == 'Const':
            tensor = n.attr['value'].tensor
            size = len(tensor.tensor_content)
            if size > max_const_size:
                tensor.tensor_content = bytes("<stripped %d bytes>"%size, "utf-8")
    return strip_def

def show_graph(graph_def, max_const_size=32):
    """Visualize TensorFlow graph."""
    if hasattr(graph_def, 'as_graph_def'):
        graph_def = graph_def.as_graph_def()
    strip_def = strip_consts(graph_def, max_const_size=max_const_size)
    code = """
        <script>
          function load() {{
            document.getElementById("{id}").pbtxt = {data};
          }}
        </script>
        <link rel="import" href="https://tensorboard.appspot.com/tf-graph-basic.build.html" onload=load()>
        <div style="height:600px">
          <tf-graph-basic id="{id}"></tf-graph-basic>
        </div>
    """.format(data=repr(str(strip_def)), id='graph'+str(np.random.rand()))

    iframe = """
        <iframe seamless style="width:1200px;height:620px;border:0" srcdoc="{}"></iframe>
    """.format(code.replace('"', '&quot;'))
    display(HTML(iframe))

结果：

UPD 我尝试了一个更简单的例子：

tf.reset_default_graph()
x = tf.ones((), name="x")
y = tf.ones((), name="y")
z = tf.add(x, y, name="z")
show_graph()

但它仍然无法奏效。我怀疑这个问题与生成的Javascript / HTML代码有关：

    <script>
      function load() {
        document.getElementById(&quot;graph0.746875762596&quot;).pbtxt = 'node {\n  name: &quot;x&quot;\n  op: &quot;Const&quot;\n  attr {\n    key: &quot;dtype&quot;\n    value {\n      type: DT_FLOAT\n    }\n  }\n  attr {\n    key: &quot;value&quot;\n    value {\n      tensor {\n        dtype: DT_FLOAT\n        tensor_shape {\n        }\n        float_val: 1.0\n      }\n    }\n  }\n}\nnode {\n  name: &quot;y&quot;\n  op: &quot;Const&quot;\n  attr {\n    key: &quot;dtype&quot;\n    value {\n      type: DT_FLOAT\n    }\n  }\n  attr {\n    key: &quot;value&quot;\n    value {\n      tensor {\n        dtype: DT_FLOAT\n        tensor_shape {\n        }\n        float_val: 1.0\n      }\n    }\n  }\n}\nnode {\n  name: &quot;z&quot;\n  op: &quot;Add&quot;\n  input: &quot;x&quot;\n  input: &quot;y&quot;\n  attr {\n    key: &quot;T&quot;\n    value {\n      type: DT_FLOAT\n    }\n  }\n}\n';
      }
    </script>
    <link rel=&quot;import&quot; href=&quot;https://tensorboard.appspot.com/tf-graph-basic.build.html&quot; onload=load()>
    <div style=&quot;height:600px&quot;>
      <tf-graph-basic id=&quot;graph0.746875762596&quot;></tf-graph-basic>
    </div>

也许有&quot和'的某些内容？

Answer 1

失败背后的原因是导入（<link rel="import" ...）only supported under Chrome Firefox在deprecated和Safari失败，在WebComponents定义到来之前，其他人无法采用。所以，你最好在Chrome中运行Jupyter。

如果您反对Chrome，那就有好消息了。您可以使用Polyfill（一段在不支持该功能的Web浏览器上实现功能的代码）来使其工作：

<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.3.3/platform.js"></script>

我已经在Firefox和Safari中对它进行了测试，但它确实有效，但并不完美。加载Polypill有点慢，图形画布减少到一英寸宽（我不知道为什么，TensorBoard内部）。然后我意识到platform.js已经here但是新实现包含了新的错误（未处理的事件和XML解析）。

以下是修改后的代码：

# TensorFlow Graph visualizer code
import numpy as np
from IPython.display import clear_output, Image, display, HTML

def strip_consts(graph_def, max_const_size=32):
    """Strip large constant values from graph_def."""
    strip_def = tf.GraphDef()
    for n0 in graph_def.node:
        n = strip_def.node.add() 
        n.MergeFrom(n0)
        if n.op == 'Const':
            tensor = n.attr['value'].tensor
            size = len(tensor.tensor_content)
            if size > max_const_size:
                tensor.tensor_content = "<stripped %d bytes>"%size
    return strip_def

def show_graph(graph_def, max_const_size=32):
    """Visualize TensorFlow graph."""
    if hasattr(graph_def, 'as_graph_def'):
        graph_def = graph_def.as_graph_def()
    strip_def = strip_consts(graph_def, max_const_size=max_const_size)
    code = """
        <script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.3.3/platform.js"></script>
        <script>
          function load() {{
            document.getElementById("{id}").pbtxt = {data};
          }}
        </script>
        <link rel="import" href="https://tensorboard.appspot.com/tf-graph-basic.build.html" onload=load()>
        <div style="height:600px">
          <tf-graph-basic id="{id}"></tf-graph-basic>
        </div>
    """.format(data=repr(str(strip_def)), id='graph'+str(np.random.rand()))

    iframe = """
        <iframe seamless style="width:1200px;height:620px;border:0" srcdoc="{}"></iframe>
    """.format(code.replace('"', '&quot;'))
    display(HTML(iframe))

请注意，code = """块的开头只添加了一行。必须在那里，因为Polyfill要求它。

可以找到原始源代码Supplier。您可以要求他在Google内部发展它以涵盖除Chrome之外的其他浏览器，但我认为它不会发生。

Answer 2

这是我使用right now

的版本

你应该可以这样做：

在Jupyter中可视化TensorFlow图并不起作用

2 个答案: