[OpenLayers-Commits] r5667 - sandbox/tschaub/scalebar/lib/OpenLayers/Control
commits at openlayers.org
commits at openlayers.org
Mon Jan 7 02:37:38 EST 2008
Author: tschaub
Date: 2008-01-07 02:37:37 -0500 (Mon, 07 Jan 2008)
New Revision: 5667
Modified:
sandbox/tschaub/scalebar/lib/OpenLayers/Control/ScaleBar.js
Log:
shuffle
Modified: sandbox/tschaub/scalebar/lib/OpenLayers/Control/ScaleBar.js
===================================================================
--- sandbox/tschaub/scalebar/lib/OpenLayers/Control/ScaleBar.js 2008-01-07 06:40:20 UTC (rev 5666)
+++ sandbox/tschaub/scalebar/lib/OpenLayers/Control/ScaleBar.js 2008-01-07 07:37:37 UTC (rev 5667)
@@ -217,17 +217,25 @@
draw: function() {
OpenLayers.Control.prototype.draw.apply(this, arguments);
// determine offsets for graphic elements
- this.xOffsetMarkerMajor = (this.styleValue('MarkerMajor', 'borderLeftWidth') +
- this.styleValue('MarkerMajor', 'width') +
- this.styleValue('MarkerMajor', 'borderRightWidth')) / 2;
- this.xOffsetMarkerMinor = (this.styleValue('MarkerMinor', 'borderLeftWidth') +
- this.styleValue('MarkerMinor', 'width') +
- this.styleValue('MarkerMinor', 'borderRightWidth')) / 2;
- this.xOffsetBar = (this.styleValue('Bar', 'borderLeftWidth') +
- this.styleValue('Bar', 'borderRightWidth')) / 2;
- this.xOffsetBarAlt = (this.styleValue('BarAlt', 'borderLeftWidth') +
- this.styleValue('BarAlt', 'borderRightWidth')) / 2;
- this.xOffsetNumbersBox = (this.styleValue('NumbersBox', 'width')) / 2;
+ this.dxMarkerMajor = (
+ this.styleValue('MarkerMajor', 'borderLeftWidth') +
+ this.styleValue('MarkerMajor', 'width') +
+ this.styleValue('MarkerMajor', 'borderRightWidth')
+ ) / 2;
+ this.dxMarkerMinor = (
+ this.styleValue('MarkerMinor', 'borderLeftWidth') +
+ this.styleValue('MarkerMinor', 'width') +
+ this.styleValue('MarkerMinor', 'borderRightWidth')
+ ) / 2;
+ this.dxBar = (
+ this.styleValue('Bar', 'borderLeftWidth') +
+ this.styleValue('Bar', 'borderRightWidth')
+ ) / 2;
+ this.dxBarAlt = (
+ this.styleValue('BarAlt', 'borderLeftWidth') +
+ this.styleValue('BarAlt', 'borderRightWidth')
+ ) / 2;
+ this.dxNumbersBox = this.styleValue('NumbersBox', 'width') / 2;
// set scale bar element height
var classNames = ['Bar', 'BarAlt', 'MarkerMajor', 'MarkerMinor'];
if(this.singleLine) {
@@ -237,9 +245,11 @@
}
var vertDisp = 0;
for(classIndex = 0; classIndex < classNames.length; ++classIndex) {
- var aClassName = classNames[classIndex];
- vertDisp = Math.max(vertDisp, this.styleValue(aClassName, 'top') +
- this.styleValue(aClassName, 'height'));
+ var cls = classNames[classIndex];
+ vertDisp = Math.max(
+ vertDisp,
+ this.styleValue(cls, 'top') + this.styleValue(cls, 'height')
+ );
}
this.element.style.height = vertDisp + 'px';
this.xOffsetSingleLine = this.styleValue('LabelBoxSingleLine', 'width') +
@@ -287,118 +297,75 @@
var marker, bar, numbersBox, xOffset;
var numDiv = this.divisions * this.subdivisions;
var alignmentOffset = {
- left: 0 + (this.singleLine ? 0 : this.xOffsetNumbersBox),
- center: (this.maxWidth / 2) - (numDiv *
- this.subProps.pixels / 2) -
- (this.singleLine ? this.xOffsetSingleLine / 2 : 0),
- right: this.maxWidth - (numDiv *
- this.subProps.pixels) -
- (this.singleLine ? this.xOffsetSingleLine : this.xOffsetNumbersBox)
+ left: 0 + (this.singleLine ? 0 : this.dxNumbersBox),
+ center: (this.maxWidth / 2) -
+ (numDiv * this.subProps.pixels / 2) -
+ (this.singleLine ? this.xOffsetSingleLine / 2 : 0),
+ right: this.maxWidth -
+ (numDiv *this.subProps.pixels) -
+ (this.singleLine ? this.xOffsetSingleLine : this.dxNumbersBox)
}
- var xPosition = 0 + alignmentOffset[this.align];
- var markerMeasure = 0;
- for(var divisionIndex = 0; divisionIndex < this.divisions; ++divisionIndex) {
- // set xPosition and markerMeasure to start of division
- xPosition = divisionIndex * this.subdivisions * this.subProps.pixels;
- xPosition += alignmentOffset[this.align];
- markerMeasure = (divisionIndex == 0) ?
- 0 : ((divisionIndex * this.subdivisions) *
- this.subProps.length).toFixed(this.subProps.dec);
+ var xPos, markerMeasure, divNum, cls;
+ for(var di=0; di<this.divisions; ++di) {
+ // set xPos and markerMeasure to start of division
+ xPos = di * this.subdivisions * this.subProps.pixels +
+ alignmentOffset[this.align];
// add major marker
- marker = document.createElement('div');
- marker.className = this.displayClass + 'MarkerMajor';
- marker.style.position = 'absolute';
- marker.style.overflow = 'hidden';
- marker.style.left = Math.round(xPosition - this.xOffsetMarkerMajor) + 'px';
- marker.appendChild(document.createTextNode(' '));
- this.graphicsContainer.appendChild(marker);
+ this.graphicsContainer.appendChild(this.createElement(
+ "MarkerMajor", " ", xPos - this.dxMarkerMajor
+ ));
// add major measure
if(!this.singleLine) {
- numbersBox = document.createElement('div');
- numbersBox.className = this.displayClass + 'NumbersBox';
- numbersBox.style.position = 'absolute';
- numbersBox.style.overflow = 'hidden';
- numbersBox.style.textAlign = 'center';
- if(this.showMinorMeasures) {
- numbersBox.style.left = Math.round(xPosition - this.xOffsetNumbersBox) + 'px';
- } else {
- numbersBox.style.left = Math.round(xPosition - this.xOffsetNumbersBox) + 'px';
- }
- numbersBox.appendChild(document.createTextNode(markerMeasure));
- this.numbersContainer.appendChild(numbersBox);
+ markerMeasure = (di == 0) ? 0 : ((di * this.subdivisions) *
+ this.subProps.length).toFixed(this.subProps.dec);
+ this.numbersContainer.appendChild(this.createElement(
+ "NumbersBox", markerMeasure, xPos - this.dxNumbersBox
+ ));
}
// create all subdivisions
- for(var subdivisionIndex = 0; subdivisionIndex < this.subdivisions; ++subdivisionIndex) {
- bar = document.createElement('div');
- bar.style.position = 'absolute';
- bar.style.overflow = 'hidden';
- bar.style.width = Math.round(this.subProps.pixels) + 'px';
- if((subdivisionIndex % 2) == 0) {
- bar.className = this.displayClass + 'Bar';
- bar.style.left = Math.round(xPosition - this.xOffsetBar) + 'px';
+ for(var si=0; si<this.subdivisions; ++si) {
+ if((si % 2) == 0) {
+ cls = "Bar";
+ left = xPos - this.dxBar;
} else {
- bar.className = this.displayClass + 'BarAlt';
- bar.style.left = Math.round(xPosition - this.xOffsetBarAlt) + 'px';
+ cls = "BarAlt";
+ left = xPos - this.dxBarAlt;
}
- bar.appendChild(document.createTextNode(' '));
- this.graphicsContainer.appendChild(bar);
+ this.graphicsContainer.appendChild(this.createElement(
+ cls, " ", left, this.subProps.pixels
+ ));
// add minor marker if not the last subdivision
- if(subdivisionIndex < (this.subdivisions - 1)) {
- // set xPosition and markerMeasure to end of subdivision
- xPosition = ((divisionIndex * this.subdivisions) +
- (subdivisionIndex + 1)) * this.subProps.pixels;
- xPosition += alignmentOffset[this.align];
- markerMeasure = (divisionIndex * this.subdivisions +
- subdivisionIndex + 1) * this.subProps.length;
- marker = document.createElement('div');
- marker.className = this.displayClass + 'MarkerMinor';
- marker.style.position = 'absolute';
- marker.style.overflow = 'hidden';
- marker.style.left = Math.round(xPosition - this.xOffsetMarkerMinor) + 'px';
- marker.appendChild(document.createTextNode(' '));
- this.graphicsContainer.appendChild(marker);
+ if(si < this.subdivisions - 1) {
+ // set xPos and markerMeasure to end of subdivision
+ divNum = (di * this.subdivisions) + si + 1;
+ xPos = divNum * this.subProps.pixels +
+ alignmentOffset[this.align];
+ this.graphicsContainer.appendChild(this.createElement(
+ "MarkerMinor", " ", xPos - this.dxMarkerMinor
+ ));
if(this.showMinorMeasures && !this.singleLine) {
// add corresponding measure
- numbersBox = document.createElement('div');
- numbersBox.className = this.displayClass + 'NumbersBox';
- numbersBox.style.position = 'absolute';
- numbersBox.style.overflow = 'hidden';
- numbersBox.style.textAlign = 'center';
- numbersBox.style.left = Math.round(xPosition - this.xOffsetNumbersBox) + 'px';
- numbersBox.appendChild(document.createTextNode(markerMeasure));
- this.numbersContainer.appendChild(numbersBox);
+ markerMeasure = divNum * this.subProps.length;
+ this.numbersContainer.appendChild(this.createElement(
+ "NumbersBox", markerMeasure, xPos - this.dxNumbersBox
+ ));
}
}
}
}
- // set xPosition and markerMeasure to end of divisions
- xPosition = numDiv * this.subProps.pixels;
- xPosition += alignmentOffset[this.align];
- markerMeasure = (numDiv * this.subProps.length).toFixed(this.subProps.dec);
+ // set xPos and markerMeasure to end of divisions
+ xPos = numDiv * this.subProps.pixels;
+ xPos += alignmentOffset[this.align];
// add the final major marker
- marker = document.createElement('div');
- marker.className = this.displayClass + 'MarkerMajor';
- marker.style.position = 'absolute';
- marker.style.overflow = 'hidden';
- marker.style.left = Math.round(xPosition - this.xOffsetMarkerMajor) + 'px';
- marker.appendChild(document.createTextNode(' '));
- this.graphicsContainer.appendChild(marker);
+ this.graphicsContainer.appendChild(this.createElement(
+ "MarkerMajor", " ", xPos - this.dxMarkerMajor
+ ));
// add final measure
if(!this.singleLine) {
- numbersBox = document.createElement('div');
- numbersBox.className = this.displayClass + 'NumbersBox';
- numbersBox.style.position = 'absolute';
- numbersBox.style.overflow = 'hidden';
- numbersBox.style.textAlign = 'center';
- if(this.showMinorMeasures) {
- numbersBox.style.left = Math.round(xPosition -
- this.xOffsetNumbersBox) + 'px';
- } else {
- numbersBox.style.left = Math.round(xPosition -
- this.xOffsetNumbersBox) + 'px';
- }
- numbersBox.appendChild(document.createTextNode(markerMeasure));
- this.numbersContainer.appendChild(numbersBox);
+ markerMeasure = (numDiv * this.subProps.length).toFixed(this.subProps.dec);
+ this.numbersContainer.appendChild(this.createElement(
+ "NumbersBox", markerMeasure, xPos - this.dxNumbersBox
+ ));
}
// add content to the label element
var labelBox = document.createElement('div');
@@ -407,8 +374,8 @@
if(this.singleLine) {
labelText = markerMeasure;
labelBox.className = this.displayClass + 'LabelBoxSingleLine';
- labelBox.style.left = Math.round(xPosition +
- this.styleValue('LabelBoxSingleLine', 'left')) + 'px';
+ labelBox.style.left = Math.round(
+ xPos + this.styleValue('LabelBoxSingleLine', 'left')) + 'px';
} else {
labelText = '';
labelBox.className = this.displayClass + 'LabelBox';
@@ -427,6 +394,36 @@
},
/**
+ * Method: createElement
+ * Create a scale bar element. These are absolutely positioned with
+ * hidden overflow and left offset.
+ *
+ * Parameters:
+ * cls - {String} Class name suffix.
+ * text - {String} Text for child node.
+ * left - {Float} Left offset.
+ * width - {Float} Optional width.
+ *
+ * Returns:
+ * {Element} A scale bar element.
+ */
+ createElement: function(cls, text, left, width) {
+ var element = document.createElement("div");
+ element.className = this.displayClass + cls;
+ OpenLayers.Util.extend(element.style, {
+ position: "absolute",
+ textAlign: "center",
+ overflow: "hidden",
+ left: Math.round(left) + "px"
+ });
+ element.appendChild(document.createTextNode(text));
+ if(width) {
+ element.style.width = Math.round(width) + "px";
+ }
+ return element;
+ },
+
+ /**
* Method: getComp
* Get comparison matrix.
*/
@@ -440,9 +437,9 @@
var pixelsPerDisplayUnit = OpenLayers.DOTS_PER_INCH *
system.inches[unitIndex] /
this.scale;
- var minSDDisplayLength = ((this.minWidth - this.xOffsetNumbersBox) /
+ var minSDDisplayLength = ((this.minWidth - this.dxNumbersBox) /
pixelsPerDisplayUnit) / numDiv;
- var maxSDDisplayLength = ((this.maxWidth - this.xOffsetNumbersBox) /
+ var maxSDDisplayLength = ((this.maxWidth - this.dxNumbersBox) /
pixelsPerDisplayUnit) / numDiv;
// add up scores for each marker (even if numbers aren't displayed)
for(var valueIndex = 0; valueIndex < numDiv; ++valueIndex) {
More information about the Commits
mailing list