-<div>
- <script>
- $(window).resize(function () { provenance_sizing_fixup("<%= divId %>") } );
- </script>
+<%= content_for :css do %>
+/* Need separate style for each instance of svg div because javascript will manipulate the properties. */
+#<%= divId %> {
+ padding-left: 3px;
+ overflow: auto;
+ border: solid;
+ border-width: 1px;
+ border-color: gray;
+ position: absolute;
+ left: 25px;
+ right: 25px;
+}
+path:hover {
+stroke-width: 5;
+}
+path {
+stroke-linecap: round;
+}
+<% end %>
+
+<%= content_for :js do %>
+ $(window).on('load', function() {
+ $(window).on('load resize scroll', function () { graph_zoom("<%= divId %>","<%=svgId %>", 1) } );
+ });
+<% end %>
+
+<div id="_<%= divId %>_container">
<div style="text-align: right">
- <a href="#"><span class="icon-zoom-out" onclick="graph_zoom('<%= divId %>', '<%= svgId %>', .9)"></span></a>
- <a href="#"><span class="icon-zoom-in" onclick="graph_zoom('<%= divId %>', '<%= svgId %>', 1./.9)"></span></a>
+ <a style="cursor: pointer"><span class="glyphicon glyphicon-zoom-out" onclick="graph_zoom('<%= divId %>', '<%= svgId %>', .9)"></span></a>
+ <a style="cursor: pointer"><span class="glyphicon glyphicon-zoom-in" onclick="graph_zoom('<%= divId %>', '<%= svgId %>', 1./.9)"></span></a>
</div>
- <div id="<%= divId %>">
+ <div id="<%= divId %>" class="smart-scroll">
+ <span id="_<%= divId %>_center" style="padding-left: 0px"></span>
<%= raw(svg) %>
</div>
</div>