2015-04-17 27 views
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); 

圖片證據

enter image description here

+0

在哪個瀏覽器中?在鉻這不會發生 –

+0

@FrederikWitte它發生在Chrome和IE 10 – Mathematics

回答

0

你可以嘗試指定筆畫的寬度:

屬性的代碼如下:

stroke-width="2" 

您可以將中風或元素本身。

+0

謝謝,但它仍然發生 – Mathematics

相關問題