Browse Source

Merge remote-tracking branch 'origin/develop' into develop

codeClimate
Alex de Mulder 8 years ago
parent
commit
1d2488b582
8 changed files with 28 additions and 72 deletions
  1. +3
    -0
      HISTORY.md
  2. +11
    -7
      docs/graph2d/index.html
  3. +3
    -13
      lib/timeline/DataStep.js
  4. +3
    -3
      lib/timeline/component/DataAxis.js
  5. +2
    -1
      lib/timeline/component/Legend.js
  6. +2
    -34
      lib/timeline/component/LineGraph.js
  7. +2
    -14
      lib/timeline/component/graph2d_types/bar.js
  8. +2
    -0
      lib/timeline/optionsGraph2d.js

+ 3
- 0
HISTORY.md View File

@ -9,6 +9,9 @@ http://visjs.org
- Altered edges for arrows and added the arrowStrikethrough option. - Altered edges for arrows and added the arrowStrikethrough option.
- Improved the hierarchical layout algorithm by adding a condensing method to remove whitespace. - Improved the hierarchical layout algorithm by adding a condensing method to remove whitespace.
### Graph2d
- Fixes #1557: Fix default axis formatting function.
## 2016-01-08, version 4.12.0 ## 2016-01-08, version 4.12.0

+ 11
- 7
docs/graph2d/index.html View File

@ -434,7 +434,7 @@ var options = {
<td class="greenField indent">barChart.sideBySide</td> <td class="greenField indent">barChart.sideBySide</td>
<td>Boolean</td> <td>Boolean</td>
<td>false</td> <td>false</td>
<td>If two datapoints of a barchart overlap, they are drawn over eachother by default. If sideBySide is set to true, they will be drawn side by side.
<td>If two datapoints of a barchart overlap, they are drawn over eachother by default. If sideBySide is set to true, they will be drawn side by side, within the same width as a single bar..
See <a href="../../examples/graph2d/10_barsSideBySide.html">example 10</a> for more information. See <a href="../../examples/graph2d/10_barsSideBySide.html">example 10</a> for more information.
When using groups, see <a href="../../examples/graph2d/11_barsSideBySideGroups.html">example 11</a>. When using groups, see <a href="../../examples/graph2d/11_barsSideBySideGroups.html">example 11</a>.
</td> </td>
@ -445,7 +445,12 @@ var options = {
<td>50</td> <td>50</td>
<td>The width of the bars.</td> <td>The width of the bars.</td>
</tr> </tr>
<tr parent="barChart" class="hidden">
<td class="greenField indent">barChart.minWidth</td>
<td>Number</td>
<td></td>
<td>The minimum width of the bars in pixels: by default the bars get smaller while zooming out to prevent overlap, this value is the minimum width of the bar. Default behavior (when minWidth is not set) is 10% of the bar width.</td>
</tr>
<tr class='toggle collapsible' onclick="toggleTable('g2dOptions','dataAxis', this);"> <tr class='toggle collapsible' onclick="toggleTable('g2dOptions','dataAxis', this);">
<td><span parent="dataAxis" class="right-caret"></span> dataAxis</td> <td><span parent="dataAxis" class="right-caret"></span> dataAxis</td>
<td>Object</td> <td>Object</td>
@ -470,12 +475,11 @@ var options = {
<td>Function</td> <td>Function</td>
<td></td> <td></td>
<td>Insert a custom function on how to format the label. The function will receive a numeric value and has to return a string. Default function is: <td>Insert a custom function on how to format the label. The function will receive a numeric value and has to return a string. Default function is:
<pre class="code">
<pre class="prettyprint lang-js">
function (value) { function (value) {
return value;
}
</pre>
which does nothing to it.</td>
return ''+value.toPrecision(3);
}</pre>
</td>
</tr> </tr>
<tr parent="dataAxis" class="hidden"> <tr parent="dataAxis" class="hidden">
<td class="indent2">dataAxis.left.range.min</td> <td class="indent2">dataAxis.left.range.min</td>

+ 3
- 13
lib/timeline/DataStep.js View File

@ -190,21 +190,11 @@ DataStep.prototype.previous = function() {
DataStep.prototype.getCurrent = function() { DataStep.prototype.getCurrent = function() {
// prevent round-off errors when close to zero // prevent round-off errors when close to zero
var current = (Math.abs(this.current) < this.step / 2) ? 0 : this.current; var current = (Math.abs(this.current) < this.step / 2) ? 0 : this.current;
var returnValue = current.toPrecision(5);
var returnValue = current;
if (typeof this.formattingFunction === 'function') { if (typeof this.formattingFunction === 'function') {
returnValue = this.formattingFunction(current);
return this.formattingFunction(current);
} }
if (typeof returnValue === 'number') {
return '' + returnValue;
}
else if (typeof returnValue === 'string') {
return returnValue;
}
else {
return current.toPrecision(5);
}
return '' + returnValue.toPrecision(3);
}; };
/** /**

+ 3
- 3
lib/timeline/component/DataAxis.js View File

@ -19,7 +19,7 @@ function DataAxis (body, options, svg, linegraphOptions) {
orientation: 'left', // supported: 'left', 'right' orientation: 'left', // supported: 'left', 'right'
showMinorLabels: true, showMinorLabels: true,
showMajorLabels: true, showMajorLabels: true,
icons: true,
icons: false,
majorLinesOffset: 7, majorLinesOffset: 7,
minorLinesOffset: 4, minorLinesOffset: 4,
labelOffsetX: 10, labelOffsetX: 10,
@ -30,12 +30,12 @@ function DataAxis (body, options, svg, linegraphOptions) {
alignZeros: true, alignZeros: true,
left:{ left:{
range: {min:undefined,max:undefined}, range: {min:undefined,max:undefined},
format: function (value) {return value;},
format: function (value) {return ''+value.toPrecision(3);},
title: {text:undefined,style:undefined} title: {text:undefined,style:undefined}
}, },
right:{ right:{
range: {min:undefined,max:undefined}, range: {min:undefined,max:undefined},
format: function (value) {return value;},
format: function (value) {return ''+value.toPrecision(3);},
title: {text:undefined,style:undefined} title: {text:undefined,style:undefined}
} }
}; };

+ 2
- 1
lib/timeline/component/Legend.js View File

@ -8,7 +8,7 @@ var Component = require('./Component');
function Legend(body, options, side, linegraphOptions) { function Legend(body, options, side, linegraphOptions) {
this.body = body; this.body = body;
this.defaultOptions = { this.defaultOptions = {
enabled: true,
enabled: false,
icons: true, icons: true,
iconSize: 20, iconSize: 20,
iconSpacing: 6, iconSpacing: 6,
@ -21,6 +21,7 @@ function Legend(body, options, side, linegraphOptions) {
position: 'top-left' // top/bottom - left,center,right position: 'top-left' // top/bottom - left,center,right
} }
} }
this.side = side; this.side = side;
this.options = util.extend({},this.defaultOptions); this.options = util.extend({},this.defaultOptions);
this.linegraphOptions = linegraphOptions; this.linegraphOptions = linegraphOptions;

+ 2
- 34
lib/timeline/component/LineGraph.js View File

@ -50,40 +50,8 @@ function LineGraph(body, options) {
size: 6, size: 6,
style: 'square' // square, circle style: 'square' // square, circle
}, },
dataAxis: {
showMinorLabels: true,
showMajorLabels: true,
icons: false,
width: '40px',
visible: true,
alignZeros: true,
left: {
range: {min: undefined, max: undefined},
format: function (value) {
return value;
},
title: {text: undefined, style: undefined}
},
right: {
range: {min: undefined, max: undefined},
format: function (value) {
return value;
},
title: {text: undefined, style: undefined}
}
},
legend: {
enabled: false,
icons: true,
left: {
visible: true,
position: 'top-left' // top/bottom - left,right
},
right: {
visible: true,
position: 'top-right' // top/bottom - left,right
}
},
dataAxis: {}, //Defaults are done on DataAxis level
legend: {}, //Defaults are done on Legend level
groups: { groups: {
visibility: {} visibility: {}
} }

+ 2
- 14
lib/timeline/component/graph2d_types/bar.js View File

@ -94,7 +94,7 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
// plot barchart // plot barchart
for (i = 0; i < combinedData.length; i++) { for (i = 0; i < combinedData.length; i++) {
group = framework.groups[combinedData[i].groupId]; group = framework.groups[combinedData[i].groupId];
var minWidth = 0.1 * group.options.barChart.width;
var minWidth = group.options.barChart.minWidth != undefined ? group.options.barChart.minWidth : 0.1 * group.options.barChart.width;
key = combinedData[i].screen_x; key = combinedData[i].screen_x;
var heightOffset = 0; var heightOffset = 0;
@ -102,9 +102,6 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
if (i + 1 < combinedData.length) { if (i + 1 < combinedData.length) {
coreDistance = Math.abs(combinedData[i + 1].screen_x - key); coreDistance = Math.abs(combinedData[i + 1].screen_x - key);
} }
if (i > 0) {
coreDistance = Math.min(coreDistance, Math.abs(combinedData[i - 1].screen_x - key));
}
drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth); drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth);
} }
else { else {
@ -113,9 +110,6 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
if (nextKey < combinedData.length) { if (nextKey < combinedData.length) {
coreDistance = Math.abs(combinedData[nextKey].screen_x - key); coreDistance = Math.abs(combinedData[nextKey].screen_x - key);
} }
if (prevKey > 0) {
coreDistance = Math.min(coreDistance, Math.abs(combinedData[prevKey].screen_x - key));
}
drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth); drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth);
intersections[key].resolved += 1; intersections[key].resolved += 1;
@ -132,12 +126,6 @@ Bargraph.draw = function (groupIds, processedGroupData, framework) {
else if (group.options.barChart.sideBySide === true) { else if (group.options.barChart.sideBySide === true) {
drawData.width = drawData.width / intersections[key].amount; drawData.width = drawData.width / intersections[key].amount;
drawData.offset += (intersections[key].resolved) * drawData.width - (0.5 * drawData.width * (intersections[key].amount + 1)); drawData.offset += (intersections[key].resolved) * drawData.width - (0.5 * drawData.width * (intersections[key].amount + 1));
if (group.options.barChart.align === 'left') {
drawData.offset -= 0.5 * drawData.width;
}
else if (group.options.barChart.align === 'right') {
drawData.offset += 0.5 * drawData.width;
}
} }
} }
DOMutil.drawBar(combinedData[i].screen_x + drawData.offset, combinedData[i].screen_y - heightOffset, drawData.width, group.zeroPosition - combinedData[i].screen_y, group.className + ' vis-bar', framework.svgElements, framework.svg, group.style); DOMutil.drawBar(combinedData[i].screen_x + drawData.offset, combinedData[i].screen_y - heightOffset, drawData.width, group.zeroPosition - combinedData[i].screen_y, group.className + ' vis-bar', framework.svgElements, framework.svg, group.style);
@ -201,7 +189,7 @@ Bargraph._getDataIntersections = function (intersections, combinedData) {
Bargraph._getSafeDrawData = function (coreDistance, group, minWidth) { Bargraph._getSafeDrawData = function (coreDistance, group, minWidth) {
var width, offset; var width, offset;
if (coreDistance < group.options.barChart.width && coreDistance > 0) { if (coreDistance < group.options.barChart.width && coreDistance > 0) {
width = coreDistance < minWidth ? minWidth : coreDistance;
width = coreDistance < minWidth ? minWidth : coreDistance
offset = 0; // recalculate offset with the new width; offset = 0; // recalculate offset with the new width;
if (group.options.barChart.align === 'left') { if (group.options.barChart.align === 'left') {

+ 2
- 0
lib/timeline/optionsGraph2d.js View File

@ -40,6 +40,7 @@ let allOptions = {
style: {string:['line','bar','points']}, // line, bar style: {string:['line','bar','points']}, // line, bar
barChart: { barChart: {
width: {number}, width: {number},
minWidth: {number},
sideBySide: {boolean}, sideBySide: {boolean},
align: {string:['left','center','right']}, align: {string:['left','center','right']},
__type__: {object} __type__: {object}
@ -179,6 +180,7 @@ let configureOptions = {
style: ['line','bar','points'], // line, bar style: ['line','bar','points'], // line, bar
barChart: { barChart: {
width: [50,5,100,5], width: [50,5,100,5],
minWidth: [50,5,100,5],
sideBySide: false, sideBySide: false,
align: ['left','center','right'] // left, center, right align: ['left','center','right'] // left, center, right
}, },

Loading…
Cancel
Save