0
出於某種原因,我的直腸在某些隨機時間後有時會失去一些中風,有時甚至是50秒,不能真正想到任何原因,可能會有幫助嗎?SVG Rect在一段時間後失去中風
這裏是小提琴 - http://jsfiddle.net/nhe613kt/368/
一些代碼
$(window).resize(OwResize);
function OwResize() {
$("#myConta").height($(window).innerHeight() - ($(window).innerHeight()/40));
}
var sideRectW = window.innerWidth/20,
sideRectH = $(window).innerHeight()/20,
width = $(window).innerWidth() - ($(window).innerWidth()/50),
height = $(window).innerHeight() - ($(window).innerHeight()/40),
boxW = (width - sideRectW)/4,
boxH = (height - sideRectH)/4,
boxSize = boxW + boxH,
xPos1 = sideRectW,
xPos2 = boxW + sideRectW,
xPos3 = (boxW * 2) + sideRectW,
xPos4 = (boxW * 3) + sideRectW,
yPos1 = 0,
yPos2 = boxH,
yPos3 = boxH * 2,
yPos4 = boxH * 3;
var CreateRect = function (x, y, boxColor, boxId) {
svgContainer.append("rect")
.attr("x", x)
.attr("y", y)
.attr("id", "rectBox" + boxId)
.attr("width", boxW)
.attr("height", boxH)
.attr("fill", boxColor)
.attr("stroke", "black")
.attr("class", "hover_group")
.attr("onclick", "alert('haha');");
};
var CreateRectWithLength = function (x, y, w, h, boxColor) {
svgContainer.append("rect")
.attr("x", x)
.attr("y", y)
.attr("width", w)
.attr("height", h)
.attr("fill", boxColor);
};
var CreateText = function (x, y, text, textColor, size) {
svgContainer.append("text")
.attr("x", x)
.attr("y", y)
.attr("fill", textColor)
.attr("font-size", size)
.text(text);
};
var CreateText90 = function (x, y, text, textColor, size) {
svgContainer.append("text")
.attr("x", x)
.attr("y", y)
.attr("fill", textColor)
.attr("font-size", size)
.attr("transform", "rotate(-90," + x + 20 + ", " + y + ")")
.text(text);
};
var svgContainer = d3.select("#myConta")
.append("svg")
.attr("id", "myContasvg")
.attr("width", "100%")
.attr("height", "100%")
.attr("preserveAspectRatio", "none")
.attr("viewBox", "0 0 " + width+ " " + height)
.attr("fill", "#2E2E2E")
.attr("float", "right")
.append("g");
CreateRectWithLength(0, 0, sideRectW, window.innerHeight, "Black");
CreateRectWithLength(0, height - sideRectH, width, sideRectH, "Black");
CreateText90(0, yPos3, "Sales", "white", 16);
CreateText(xPos3, height - sideRectH/5, "Profit", "white", 16);
CreateText(sideRectW/2, yPos1 + (boxH/2), "3", "white", 12);
CreateText(sideRectW/2, yPos2 + (boxH/2), "2", "white", 12);
CreateText(sideRectW/2, yPos3 + (boxH/2), "1", "white", 12);
CreateText(sideRectW/2, yPos4 + (boxH/2), "0", "white", 12);
CreateText(xPos1 + (boxW/2), height - sideRectH/2, "0", "white", 12);
CreateText(xPos2 + (boxW/2), height - sideRectH/2, "1", "white", 12);
CreateText(xPos3 + (boxW/2), height - sideRectH/2, "2", "white", 12);
CreateText(xPos4 + (boxW/2), height - sideRectH/2, "3", "white", 12);
CreateRect(xPos1, yPos1, "#C0FC3E", 03);
CreateRect(xPos1, yPos2, "#60FC60", 02);
CreateRect(xPos1, yPos3, "#64FE2E", 01);
CreateRect(xPos1, yPos4, "#00FF00", 00);
CreateRect(xPos2, yPos1, "#F6FF33", 13);
CreateRect(xPos2, yPos2, "#AFFC3B", 12);
CreateRect(xPos2, yPos3, "#00FF00", 11);
CreateRect(xPos2, yPos4, "#64FE2E", 10);
CreateRect(xPos3, yPos1, "#FDB500", 23);
CreateRect(xPos3, yPos2, "#8DB723", 22);
CreateRect(xPos3, yPos3, "#AFFC3B", 21);
CreateRect(xPos3, yPos4, "#60FC60", 20);
CreateRect(xPos4, yPos1, "red", 33);
CreateRect(xPos4, yPos2, "#FDB500", 32);
CreateRect(xPos4, yPos3, "#F6FF33", 31);
CreateRect(xPos4, yPos4, "#C0FC3E", 30);
圖片證據
在哪個瀏覽器中?在鉻這不會發生 –
@FrederikWitte它發生在Chrome和IE 10 – Mathematics