VML z-index 问题 我试图做一个圆环的效果,将一个<v:oval的圆放置在两个报表中间!我试图将一个 <v:oval 显示在由 <v:shape 和<v:Rect 生成的饼状报表下 但是我设置z-index 为-1 则在最底下,设置为正数则显示在最上层望各位不吝赐教! 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 z-index只对绝对定位管用。在加上position:absolute;把这两个饼图 设置的都是position:absolute; 问题已解决! 我在最上层的饼状报表上加了一个和它样式一样的iframe并且隐藏它!谢谢MuBeiBei 热心回答! 结贴给分! function SVGRenderer() { this.svgRoot = null;}SVGRenderer.svgNamespace = 'http://www.w3.org/2000/svg';SVGRenderer.prototype.init = function(elem) { this.container = elem; this.container.style.MozUserSelect = 'none'; var container_all = document.getElementsByTagName("svg"); if (container_all.length !=0) { this.svgRoot = container_all[0]; } else { this.svgRoot = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "svg"); this.svgRoot.style.position = 'absolute'; this.container.appendChild(this.svgRoot); } }SVGRenderer.prototype.addArrowColor = function(color) { var elem = this.container.ownerDocument.getElementById(color); if(elem) { return; } var defs = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "defs"); this.svgRoot.appendChild(defs); var er = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "er"); er.setAttributeNS(null, 'id', color); er.setAttributeNS(null, 'viewBox', '0 0 30 30'); er.setAttributeNS(null, 'refX', 0); er.setAttributeNS(null, 'refY', "15px"); er.setAttributeNS(null, 'erUnits', 'strokeWidth'); er.setAttributeNS(null, 'erWidth', "9px"); er.setAttributeNS(null, 'erHeight', "30px"); er.setAttributeNS(null, 'orient',"auto"); defs.appendChild(er); var path = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "path"); path.setAttributeNS(null, 'd',"M 0 0 L 30 15 L 0 30 Z"); path.setAttributeNS(null, 'fill',color); path.setAttributeNS(null, 'stroke',color); path.setAttributeNS(null, 'stroke-width',"1px"); er.appendChild(path); }SVGRenderer.prototype.drawArrow = function(left, top, left1, top1,color){ top +=9; this.addArrowColor(color); var svg; svg = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, 'line'); svg.style.position = 'absolute'; svg.setAttributeNS(null, 'x1', left + "px"); svg.setAttributeNS(null, 'y1', top + "px"); svg.setAttributeNS(null, 'x2', left1 + "px"); svg.setAttributeNS(null, 'y2', top1 + "px"); svg.setAttributeNS(null, 'stroke', color); svg.setAttributeNS(null, 'stroke-width', "1px"); svg.setAttributeNS(null, 'fill', color); svg.setAttributeNS(null, 'er-end', "url(#"+color+")"); this.svgRoot.appendChild(svg); return svg; }SVGRenderer.prototype.remove = function(shape) { shape.parentNode.removeChild(shape); }SVGRenderer.prototype.move = function(shape, left, top) { if (shape.tagName == 'line') { var deltaX = shape.getBBox().width; var deltaY = shape.getBBox().height; shape.style.position = 'absolute'; shape.setAttributeNS(null, 'x1', left); shape.setAttributeNS(null, 'y1', top); shape.setAttributeNS(null, 'x2', left + deltaX); shape.setAttributeNS(null, 'y2', top + deltaY); } }function VMLRenderer() { }VMLRenderer.prototype.init = function(elem) { this.container = elem; this.container.style.overflow = 'hidden'; // Add VML includes and namespace elem.ownerDocument.namespaces.add("v", "urn:schemas-microsoft-com:vml"); var style = elem.ownerDocument.createStyleSheet(); style.addRule('v\\:*', "behavior: url(#default#VML);"); }VMLRenderer.prototype.drawArrow = function(left,top,left1,top1,color) { var line = this.container.ownerDocument.createElement('v:line'); line.style.position = 'absolute'; line.setAttribute('from', left + 'px,' + top + 'px'); line.setAttribute('to', left1 + 'px,' + top1 + 'px'); line.setAttribute('strokecolor',color); var arrow = this.container.ownerDocument.createElement('v:stroke'); arrow.setAttribute('Endarrow', "Classic"); line.appendChild(arrow); this.container.appendChild(line); return line; }VMLRenderer.prototype.remove = function(shape) { shape.removeNode(true); }VMLRenderer.prototype.move = function(shape, left, top) { if (shape.tagName == 'line') { shape.style.marginLeft = left; shape.style.marginTop = top; } else { shape.style.left = left; shape.style.top = top; } }VMLRenderer.prototype.resize = function(shape, fromX, fromY, toX, toY) { var deltaX = toX - fromX; var deltaY = toY - fromY; if (shape.tagName == 'line') { shape.setAttribute('to', toX + 'px,' + toY + 'px'); } else { if (deltaX < 0) { shape.style.left = toX + 'px'; shape.style.width = -deltaX + 'px'; } else { shape.style.width = deltaX + 'px'; } if (deltaY < 0) { shape.style.top = toY + 'px'; shape.style.height = -deltaY + 'px'; } else { shape.style.height = deltaY + 'px'; } }}function FlowGraphic(elem){ if(!elem) { elem = document.body; } ie = navigator.appVersion.match(/MSIE (\d\.\d)/); opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1); if ((!ie) || (opera)) { this.render = new SVGRenderer(); } else { this.render = new VMLRenderer(); } this.render.init(elem); this.container = elem; }FlowGraphic.prototype.drawArrow = function(x1,y1,x2,y2,color) { color = color||"black"; return this.render.drawArrow(x1,y1,x2,y2,color); }FlowGraphic.prototype.drawExceptionLine = function(x1,y1,x2,y2) { return this.drawArrow(x1,y1,x2,y2,"red"); }FlowGraphic.prototype.drawLine = function(x1,y1,x2,y2) { return this.drawArrow(x1,y1,x2,y2); } extjs2中treepanel父节点展开时以选中的子节点都变为未选中了 window.showModalDialog提交表单后自动关闭问题 急需帮忙~关于js 请问jquery 如何hide table 里面的 <span>? 一个简单的小例子 怎么实现 表单提交时框架集的问题 两个问题,请进: 提一小问题! 请问如何暂时屏蔽掉鼠标左键的单击 关于google地图开发中标记用的的图标的问题 谁能帮我看看我这个站的导航菜单,不兼容FF 如何把这种js代码放入单独的文件中
设置的都是position:absolute;
{
this.svgRoot = null;
}SVGRenderer.svgNamespace = 'http://www.w3.org/2000/svg';SVGRenderer.prototype.init = function(elem)
{
this.container = elem; this.container.style.MozUserSelect = 'none'; var container_all = document.getElementsByTagName("svg");
if (container_all.length !=0)
{ this.svgRoot = container_all[0];
}
else
{
this.svgRoot = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "svg");
this.svgRoot.style.position = 'absolute';
this.container.appendChild(this.svgRoot);
} }
SVGRenderer.prototype.addArrowColor = function(color)
{
var elem = this.container.ownerDocument.getElementById(color); if(elem)
{
return;
} var defs = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "defs");
this.svgRoot.appendChild(defs);
var er = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "er");
er.setAttributeNS(null, 'id', color);
er.setAttributeNS(null, 'viewBox', '0 0 30 30');
er.setAttributeNS(null, 'refX', 0);
er.setAttributeNS(null, 'refY', "15px");
er.setAttributeNS(null, 'erUnits', 'strokeWidth');
er.setAttributeNS(null, 'erWidth', "9px");
er.setAttributeNS(null, 'erHeight', "30px");
er.setAttributeNS(null, 'orient',"auto"); defs.appendChild(er); var path = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, "path");
path.setAttributeNS(null, 'd',"M 0 0 L 30 15 L 0 30 Z");
path.setAttributeNS(null, 'fill',color);
path.setAttributeNS(null, 'stroke',color);
path.setAttributeNS(null, 'stroke-width',"1px");
er.appendChild(path);
}SVGRenderer.prototype.drawArrow = function(left, top, left1, top1,color)
{
top +=9; this.addArrowColor(color);
var svg;
svg = this.container.ownerDocument.createElementNS(SVGRenderer.svgNamespace, 'line'); svg.style.position = 'absolute'; svg.setAttributeNS(null, 'x1', left + "px");
svg.setAttributeNS(null, 'y1', top + "px");
svg.setAttributeNS(null, 'x2', left1 + "px");
svg.setAttributeNS(null, 'y2', top1 + "px"); svg.setAttributeNS(null, 'stroke', color);
svg.setAttributeNS(null, 'stroke-width', "1px");
svg.setAttributeNS(null, 'fill', color);
svg.setAttributeNS(null, 'er-end', "url(#"+color+")");
this.svgRoot.appendChild(svg); return svg; }
SVGRenderer.prototype.remove = function(shape)
{
shape.parentNode.removeChild(shape);
}
SVGRenderer.prototype.move = function(shape, left, top)
{
if (shape.tagName == 'line')
{
var deltaX = shape.getBBox().width;
var deltaY = shape.getBBox().height;
shape.style.position = 'absolute';
shape.setAttributeNS(null, 'x1', left);
shape.setAttributeNS(null, 'y1', top);
shape.setAttributeNS(null, 'x2', left + deltaX);
shape.setAttributeNS(null, 'y2', top + deltaY);
}
}function VMLRenderer()
{
}
VMLRenderer.prototype.init = function(elem)
{
this.container = elem;
this.container.style.overflow = 'hidden';
// Add VML includes and namespace
elem.ownerDocument.namespaces.add("v", "urn:schemas-microsoft-com:vml"); var style = elem.ownerDocument.createStyleSheet();
style.addRule('v\\:*', "behavior: url(#default#VML);");
}VMLRenderer.prototype.drawArrow = function(left,top,left1,top1,color)
{
var line = this.container.ownerDocument.createElement('v:line'); line.style.position = 'absolute';
line.setAttribute('from', left + 'px,' + top + 'px');
line.setAttribute('to', left1 + 'px,' + top1 + 'px');
line.setAttribute('strokecolor',color); var arrow = this.container.ownerDocument.createElement('v:stroke');
arrow.setAttribute('Endarrow', "Classic");
line.appendChild(arrow);
this.container.appendChild(line); return line;
}
VMLRenderer.prototype.remove = function(shape)
{
shape.removeNode(true);
}
VMLRenderer.prototype.move = function(shape, left, top)
{
if (shape.tagName == 'line')
{
shape.style.marginLeft = left;
shape.style.marginTop = top;
}
else
{
shape.style.left = left;
shape.style.top = top;
}
}
VMLRenderer.prototype.resize = function(shape, fromX, fromY, toX, toY)
{
var deltaX = toX - fromX;
var deltaY = toY - fromY; if (shape.tagName == 'line')
{
shape.setAttribute('to', toX + 'px,' + toY + 'px');
}
else
{
if (deltaX < 0)
{
shape.style.left = toX + 'px';
shape.style.width = -deltaX + 'px';
}
else
{
shape.style.width = deltaX + 'px';
}
if (deltaY < 0)
{
shape.style.top = toY + 'px';
shape.style.height = -deltaY + 'px';
}
else
{
shape.style.height = deltaY + 'px';
}
}
}function FlowGraphic(elem)
{
if(!elem)
{
elem = document.body;
}
ie = navigator.appVersion.match(/MSIE (\d\.\d)/);
opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1); if ((!ie) || (opera))
{
this.render = new SVGRenderer();
}
else
{
this.render = new VMLRenderer();
}
this.render.init(elem);
this.container = elem;
}FlowGraphic.prototype.drawArrow = function(x1,y1,x2,y2,color)
{
color = color||"black";
return this.render.drawArrow(x1,y1,x2,y2,color);
}
FlowGraphic.prototype.drawExceptionLine = function(x1,y1,x2,y2)
{
return this.drawArrow(x1,y1,x2,y2,"red");
}
FlowGraphic.prototype.drawLine = function(x1,y1,x2,y2)
{
return this.drawArrow(x1,y1,x2,y2);
}