रैफेल

Question

द्वारा उत्पन्न एक एसवीजी को कैसे सहेजने के लिए रैफेल द्वारा एसवीजी फ़ाइल के रूप में उत्पन्न एसवीजी को सहेजने का कोई तरीका है। ध्यान दें कि इसे केवल क्रोम में काम करने की आवश्यकता है।

Answer 1

stef commented के रूप में, ब्लॉबबिल्डर एपीआई बहिष्कृत है। इसके बजाए, use the Blob API।

बिल्डिंग Andreas' answer पर, यहाँ है कि कैसे मैं जल्दी से काम करने के लिए मिल गया:

svgString = r.toSVG(); 
a = document.createElement('a'); 
a.download = 'mySvg.svg'; 
a.type = 'image/svg+xml'; 
blob = new Blob([svgString], {"type": "image/svg+xml"}); 
a.href = (window.URL || webkitURL).createObjectURL(blob); 
a.click(); 

Answer 2

मैं Raphael.Export का उपयोग करके एक समाधान के साथ आया, जो मुझे एक वैध svg/xml स्ट्रिंग (कुछ ऐसा जो मुझे डीओएम ऑब्जेक्ट के आंतरिक HTML से प्राप्त नहीं कर सका जो svg रखता है) और ब्लोबबिल्डर बनाने के लिए एक लिंक के लिए यूआरएल जो फ़ाइल को सहेजने के अंत में एक क्लिक ईवेंट को फायर करेगा।

svgString = @paper.toSVG(); 
a = document.createElement('a'); 
a.download = 'mySvg.svg'; 
a.type = 'image/svg+xml'; 
bb = new(window.BlobBuilder || WebKitBlobBuilder); 
bb.append(svgString); 
blob = bb.getBlob('image/svg+xml'); 
a.href = (window.URL || webkitURL).createObjectURL(blob); 
a.click(); 

Answer 3

आप Rapahel.Export का उपयोग नहीं करना चाहते, तो आप सीधे, डोम से svg प्राप्त कर सकते हैं उस तरह :

var svgString = document.getElementById('holder').innerHTML; 
a = document.createElement('a'); 
a.download = 'mySvg.svg'; 
a.type = 'image/svg+xml'; 
blob = new Blob([svgString], {"type": "image/svg+xml"}); 
a.href = (window.URL || webkitURL).createObjectURL(blob); 
a.click(); 

"धारक" div जहां भरी हुई है की आईडी है राफेल: आर = राफेल ("धारक"); नोट मुझे लगता है कि यह पुराने ब्राउज़र कि svg

Answer 4

प्रबंधन नहीं करती है हिस्सा है जहाँ आप ब्लॉब को बचाने के लिए पर काम नहीं करेगा, मैं https://github.com/eligrey/FileSaver.js/

या https://www.npmjs.com/package/angular-file-saver आप AngularJS

उपयोग कर रहे हैं की सलाह देते हैं