Skip to content
This repository was archived by the owner on Apr 5, 2025. It is now read-only.

Commit f4a39a3

Browse files
dgrechkadgrechka
committed
padding control via attribute
1 parent afc011a commit f4a39a3

File tree

2 files changed

+90
-3
lines changed

2 files changed

+90
-3
lines changed

‎samples/Visible region control.html

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<meta http-equiv="X-UA-Compatible" content="IE=10; IE=Edge" />
5+
<title>Polyline by Figure</title>
6+
<link rel="stylesheet" type="text/css" href="../dist/idd.css" />
7+
<link rel="stylesheet" type="text/css" href="../src/css/IDDTheme.css" />
8+
9+
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
10+
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
11+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
12+
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/3.1.2/rx.lite.min.js"></script>
13+
<script src="https://cdnjs.cloudflare.com/ajax/libs/svg.js/2.4.0/svg.js"></script>
14+
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.js"></script>
15+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>
16+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js"></script>
17+
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-min.js"></script>
18+
<script src="../dist/idd_knockout.js"></script>
19+
20+
<script type="text/javascript">
21+
$(document).ready(function () {
22+
var plot1 = InteractiveDataDisplay.asPlot($("#figure1"));
23+
var plot2 = InteractiveDataDisplay.asPlot($("#figure2"));
24+
//var plot3 = InteractiveDataDisplay.asPlot($("#figure3"));
25+
});
26+
</script>
27+
</head>
28+
29+
<body>
30+
<div style="display: inline-grid">
31+
32+
<h3>Default visible region</h3>
33+
<div id="figure1" data-idd-plot="figure" style="width: 400px; height: 300px; float:left"
34+
data-idd-navigation-enabled="false" data-idd-legend-enabled="true">
35+
36+
<div id="grid1" data-idd-plot='grid' data-idd-placement='center' data-idd-style='stroke: DarkGray; thickness: 1px;'
37+
data-idd-xaxis='bottom_axis1' data-idd-yaxis='left_axis1'></div>
38+
39+
<div data-idd-plot="polyline" data-idd-style="stroke: red; thickness: 3" id="red line">
40+
x y
41+
0 0
42+
1 1
43+
2 2
44+
</div>
45+
<div data-idd-plot="polyline" data-idd-style="stroke: green; thickness: 3" id="green line">
46+
x y
47+
0 1
48+
1 0
49+
2 2
50+
</div>
51+
52+
<div id="bottom_axis1" data-idd-axis="numeric" data-idd-placement="bottom" style="position: relative;"></div>
53+
<div id="left_axis1" data-idd-axis="numeric" data-idd-placement="left" style="position: relative;"></div>
54+
</div>
55+
56+
<h3>Zero padding</h3>
57+
<div id="figure2" data-idd-plot="figure" style="width: 400px; height: 300px; float:left"
58+
data-idd-navigation-enabled="false" data-idd-legend-enabled="true" data-idd-padding="0">
59+
60+
<div id="grid2" data-idd-plot='grid' data-idd-placement='center' data-idd-style='stroke: DarkGray; thickness: 1px;'
61+
data-idd-xaxis='bottom_axis2' data-idd-yaxis='left_axis2'></div>
62+
63+
<div data-idd-plot="polyline" data-idd-style="stroke: red; thickness: 3" id="red line">
64+
x y
65+
0 0
66+
1 1
67+
2 2
68+
</div>
69+
<div data-idd-plot="polyline" data-idd-style="stroke: green; thickness: 3" id="green line">
70+
x y
71+
0 1
72+
1 0
73+
2 2
74+
</div>
75+
76+
<div id="bottom_axis2" data-idd-axis="numeric" data-idd-placement="bottom" style="position: relative;"></div>
77+
<div id="left_axis2" data-idd-axis="numeric" data-idd-placement="left" style="position: relative;"></div>
78+
</div>
79+
</div>
80+
81+
82+
</body>
83+
</html>

‎src/idd/idd.base.js

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -186,7 +186,7 @@ var _initializeInteractiveDataDisplay = function () { // determines settings dep
186186
jqDiv = div;
187187
div = div[0];
188188
} else
189-
throw "Invalid input parameter! It should be div of id of div of jQuery of div";
189+
throw "Invalid input parameter! It should be div or id of div or jQuery of single div";
190190

191191
if (div.plot !== undefined)
192192
return div.plot;
@@ -269,8 +269,8 @@ var _initializeInteractiveDataDisplay = function () { // determines settings dep
269269
var _isFlatRenderingOn = false;
270270
var _width, _height;
271271
var _name = "";
272-
var _order = 0;
273-
var _padding = InteractiveDataDisplay.Padding;
272+
var _order = 0;
273+
var _padding = InteractiveDataDisplay.Padding; //extra padding in pixels which is added to padding computed by the plots
274274
// Contains user-readable titles for data series of a plot. They should be used in tooltips and legends.
275275
var _titles = {};
276276
// The flag is set in setVisibleRegion when it is called at me as a bound plot to notify that another plot is changed his visible.
@@ -294,6 +294,10 @@ var _initializeInteractiveDataDisplay = function () { // determines settings dep
294294
div.removeAttr("data-idd-Y-log");
295295
_yDataTransform = InteractiveDataDisplay.logTransform;
296296
}
297+
if(div.attr("data-idd-padding")) {
298+
_padding = Number(div.attr("data-idd-padding"))
299+
div.removeAttr("data-idd-padding");
300+
}
297301
div[0].plot = this; // adding a reference to the initialized DOM object of the plot, pointing to the plot instance.
298302

299303
// Disables user selection for this element:

0 commit comments

Comments
 (0)