我正在使用带有ionic framework的d3.js进行手机游戏。
然而，屏幕没有重新绘制 - 仅限于镀铬。 Safari和Canary（42.0.23）还可以，但Chrome（40.0.22）和移动Android浏览器都坏了。
D3和离子的CSS之间似乎有些冲突，去掉离子和d3现在运行正常。
之前我遇到过svg版本的问题，但现在我只是使用d3 DOM渲染器，但同样的问题。 我想知道是什么原因引起的，是否需要修改离子或d3？因为它在Canary中可以，但我可以等待更新来修复它，但移动铬破坏的事实更令人担忧。
手动调整chrome中的窗口大小会强制重新绘制，然后我可以看到游戏。 但是，尝试these type of techniques to trigger a repaint from JS并不起作用。
哪些CSS属性可能导致重绘被抑制？我想这是应用于身体或html标签的东西，它打破了重绘和d3。
游戏的演示在这里：
http://chatu.meteor.com/pairs/ant1
以及有关离子家伙的错误报告的截图/详细信息。 https://github.com/driftyco/ionic/issues/3159
离子似乎将这种css应用于身体：
element.style {
}
body, .ionic-body {
-webkit-touch-callout: none;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none;
text-size-adjust: none;
-webkit-tap-highlight-color: transparent;
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
margin: 0;
padding: 0;
color: #000;
word-wrap: break-word;
font-size: 14px;
font-family: "Helvetica Neue","Roboto",sans-serif;
line-height: 20px;
text-rendering: optimizeLegibility;
-webkit-backface-visibility: hidden;
-webkit-user-drag: none;
}
body {
margin: 0;
line-height: 1;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, i, u, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, fieldset, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
font: inherit;
font-size: 100%;
}