आईवी 10 में लाइन चलने पर एसवीजी लाइन मार्कर अपडेट नहीं हो रहे हैं?

Question

मेरे पास लाइन मार्करों के साथ कुछ एसवीजी लाइनें हैं, और मेरे पास एक स्क्रिप्ट है जो उन पंक्तियों को चारों ओर ले जाती है। यह IE9 समेत सभी ब्राउज़रों पर ठीक काम करता है।

हालांकि, मैंने अभी आईई 10 पर कोशिश की है, और लाइन चालक लाइन के पीछे पीछे छोड़ देते हैं।

इस का एक उदाहरण यहां देखा जा सकता: http://jsfiddle.net/swYRK/8/

मैं दोनों विंडोज 7 और 8

किसी को भी यह कोशिश की है पता है क्या हो रहा है? क्या यह एक आईई 10 बग है, या लाइन और मार्करों को स्थानांतरित करने का कोई और तरीका है?

- 

(वास्तविक आवेदन नोट बहुत प्रदर्शन संवेदनशील है, इसलिए मैं बहुत ज्यादा हर फ्रेम लाइनों को फिर से बनाने की तरह कुछ कर रही से बचने के लिए, जबकि मैं उन्हें ले जाते हैं, या कुछ और चाहते हैं।) संपादित करें: इस एक असली आईई 10 बग की तरह लगता है। मुझे एक open issue in the IE bug tracker मिला है (जिसके लिए एक Microsoft खाता भी देखने की आवश्यकता है, जो इसे Google को दिखाई नहीं देता है। हैलो?), जिसे मैंने जानकारी दी है। आईई ने अभी तक इस मुद्दे को स्वीकार नहीं किया है।

यदि कोई अन्य काम-आसपास है जो लोग सोच सकते हैं, तो यह सुनना बहुत अच्छा होगा। अंत मार्करों को पूरी तरह से हटाकर, इसे प्रस्तुत करना, और फिर उन्हें फिर से जोड़ना-ish (दृश्य चमकती दिखाता है), लेकिन दुर्भाग्य से my application में स्वीकार्य नहीं होगा।

Answer 1

यह करने का यह एक त्वरित तरीका है, जो अच्छी तरह से काम करता है। मैंने किसी भी झटके या प्रदर्शन संबंधी मुद्दों पर ध्यान नहीं दिया है।

सीधे शब्दों में svg नोड फिर से जोड़ यह मूल स्थान है में:

if (navigator.appVersion.indexOf("MSIE 10") != -1) { 
    svgNode.parentNode.insertBefore(svgNode, svgNode); 
} 

बेशक

, आप किसी भी ब्राउज़र पसंद के सूँघने इस्तेमाल कर सकते हैं ..

Answer 2

आप इस हैक की कोशिश कर सकते हैं:

$("#button4").click(function() { 
$("#line1")[0].setAttributeNS(null, "x1", 50); 
$("#line1")[0].setAttributeNS(null, "y1", 50); 
$("#line1")[0].setAttributeNS(null, "x2", 150); 
$("#line1")[0].setAttributeNS(null, "y2", 50); 
var oldAttValueDisplay = $("#line1")[0].getAttributeNS(null, "display"); 
$("#line1")[0].setAttributeNS(null, "display", "none"); 
setTimeout(function() {$("#line1")[0].setAttributeNS(null, "display", oldAttValueDisplay);}, 0); 
// static: setTimeout(function() {$("#line1")[0].setAttributeNS(null, "display", "block");}, 0);  

});

Answer 3

मैं अद्भुत जवाब पर एक छोटे से विस्तृत करना चाहते हैं @ChristianLund द्वारा दिए गए और मैं इसे कैसे सफलतापूर्वक इस्तेमाल किया मेरी कोड

मेरी बल एनीमेशन में में, मैं एक tick समारोह है कि इस तरह दिखता है:

force.on("tick", function() { 
    ... 
}); 

मैं भी link वेरिएबल के अंदर मेरी ग्राफ लिंक के सभी पकड़ इतनी तरह परिभाषित,: जादू ईसाई द्वारा सुझाए गए लागू करने के लिए,

var link = svg.selectAll(".link").data(links).enter() ... 

अब, मैं अपने tick की शुरुआत में इस लाइन को जोड़ दिया है समारोह:

force.on("tick", function() { 
    link.each(function() {this.parentNode.insertBefore(this, this); }); 
    ... 
}); 

यह आईई 10 समस्याओं को ठीक करने लगता है ...बेशक यह केवल आईई 10

Answer 4

यानी 10/11 में, मैंने पाया कि लाइन मार्कर-स्टार्ट/मार्कर-एंड एट्रिब्यूट के साथ नहीं चलती है, मैंने आपके उदाहरण में उन एट्रिब्यूट को हटाने का प्रयास किया है , और यह काम करता है। इसलिए विचार x/y सेट करने से पहले एट्रिब्यूट को हटा देता है, फिर सभी नौकरियों के बाद एट्रिब्यूट को रीसेट करें।