67 lines
2.3 KiB
Django/Jinja
67 lines
2.3 KiB
Django/Jinja
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title>{{ title }}</title>
|
|
<script
|
|
src="https://code.jquery.com/jquery-3.5.1.min.js"
|
|
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
|
|
crossorigin="anonymous"></script>
|
|
|
|
<meta charset="utf-8">
|
|
|
|
{{ resources }}
|
|
|
|
<style>
|
|
{% include 'styles.css' %}
|
|
</style>
|
|
|
|
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/d3-flame-graph@4.0.6/dist/d3-flamegraph.css">
|
|
|
|
<script
|
|
src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"
|
|
integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU="
|
|
crossorigin="anonymous"></script>
|
|
<script type="text/javascript" src="https://d3js.org/d3.v4.min.js"></script>
|
|
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/d3-flame-graph@4.0.6/dist/d3-flamegraph.min.js"></script>
|
|
|
|
</head>
|
|
<body>
|
|
<div id="help_dialog" class="dialog">
|
|
<div class="dialog_area">
|
|
<span class="dialog_close">×</span>
|
|
<p> <b>Main plot (upper left):</b> pan with click+mouse movement, zoom in/out with the mouse
|
|
wheel, hover on sample clusters to see backtraces. Select samples with the rectangular
|
|
selection tool or by clicking on them. Select holding shift to add or ctrl+shift to
|
|
remove samples to or from the selection. Different tools can be enabled/disabled from
|
|
the toolbox.</p>
|
|
<p><b>Flame graph (upper right):</b> click on specific items to zoom in.</p>
|
|
<p><b>Sample table (lower right):</b> select processes to filter in the Flame graph.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="top_right">
|
|
<button id="help_button" class="help" text-align="right">HELP</button>
|
|
</div>
|
|
<div class="left"> {{ plot_div.graph }} </div>
|
|
<div class="middle_right">
|
|
<div id="flame"/>
|
|
</div>
|
|
|
|
<div class="bottom_right">
|
|
<div style="display: flex; justify-content: space-around">
|
|
<div>
|
|
<label for="regex">Filter by regex:</label>
|
|
<input type="text" id="regex" oninput="update_selections()"/>
|
|
</div>
|
|
<div>
|
|
Invert callstack <input type="checkbox" id="inverted_checkbox" onclick="update_selections()">
|
|
</div>
|
|
</div>
|
|
{{ plot_div.table }}
|
|
</div>
|
|
|
|
<script>{% include 'main.js' %}</script>
|
|
{{ plot_script }}
|
|
</body>
|
|
</html>
|