2017-05-23 8 views
9

मेरा प्रश्न एक आत्म निहित नोटबुकइनलाइनिंग svg छवि

मैं मेरा एक नोटबुक में एक Markdown सेल एक बाहरी छवि फ़ाइल का संदर्भ देता है है प्रकाशित करने की इच्छा से संबंधित है

so far 

![](example.svg "Example") 

so good 

क्या एमडी सेल में फ़ाइल सामग्री को रेखांकित करना संभव है?

+0

यदि कक्ष HTML स्वीकार करते हैं तो मैं बस सेल सामग्री के अंदर फ़ाइल सामग्री की प्रतिलिपि बना सकता हूं। - '%% एचटीएमएल 'सेल जादू एक व्यावहारिक समाधान नहीं है क्योंकि मैं गारंटी नहीं दे सकता कि नोटबुक, वितरित होने पर, उसी निबेक्स्टेंशन तक पहुंच सकता है जिसे मैं शर्मनाक रूप से लंबे इनपुट सेल को छिपाने के लिए उपयोग करता हूं। - 'डिस्प्ले()' के आधार पर अन्य संभावनाएं एक कोड सेल से जुड़ी हैं जो या तो बाहरी संदर्भ या पूरी फ़ाइल सामग्री का खुलासा करती है ... - अनुमानित मार्कडाउन समाधान मुझे अपील कर रहा है क्योंकि एक ही सेल या तो असुरक्षित है (एसवीजी कोड दृश्यमान) या प्रस्तुत किया गया (केवल छवि दृश्यमान है)। – gboffi

उत्तर

3

यदि कोई दिलचस्पी है, तो यहां मैंने स्वयं निहित नोटबुक साझा करने के लिए किया है।

मेरे आधे पके हुए समाधान Markdown सेल विभाजित है और एक कोड सेल
display(HTML(open('example.svg').read()))
Markdown निर्देश ![](example.svg "Example") की जगह डालने के लिए किया गया था।

क्योंकि फ़ाइल सामग्री को आउटपुट सेल में संग्रहीत किया जाता है, इसलिए सहेजी गई नोटबुक को अपनी सभी सीमाओं के साथ nbviewer जैसी सेवा का उपयोग करके स्वयं निहित तरीके से साझा किया जा सकता है। अगर कोई मेरी नोटबुक डाउनलोड करना चुनता है, तो, मेरे एसवीजी कोड को भी डाउनलोड करता है, है ना?

OTOH, अगर मैं Microsoft Azure Notebooks की तरह एक सेवा का उपयोग करके शेयर (है कि, कम से कम वर्तमान, स्प्रिंग 2017, में "पूर्वावलोकन" अवतार मेरी नोटबुक के साथ बातचीत करने के लिए एक Microsoft खाते के साथ किसी को भी अनुमति देता है) किसी को भी है कि कोड को चलाने के लिए कोशिश कर रहा है सेल को चोट पहुंच जाएगी - हालांकि, HTTP के माध्यम से दी गई फ़ाइल को इंगित करने वाले मार्कडाउन छवि निर्देश का उपयोग करके क्रॉस होस्टेड समाधान को कार्यान्वित करना संभव है। लेकिन इस पार होस्टिंग क्या मैं पहले उदाहरण में से बचने के लिए ... मेरे मत पूछो क्यों कोशिश कर रहा था है: -। (...

0

Markdown एचटीएमएल की अनुमति देता है Markdown सीधे सेल में यह डालने का प्रयास करें ...

<svg height="100" width="100"> 
    <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" /> 
</svg> 
+0

यह वर्तमान जुपीटर नोटबुक कोड (अन्य HTML करता है, लेकिन एसवीजी नहीं) के साथ काम नहीं करता है। – cco

2

हाँ, यह jupyter नोटबुक में एसवीजी छवि शामिल करने के लिए संभव है

  1. markdown वाक्यविन्यास का उपयोग करना:।

![Alt text](https://mirrors.creativecommons.org/presskit/logos/cc.logo.svg)

  1. एचटीएमएल का उपयोग करना:

<img style="float: right;" src="https://mirrors.creativecommons.org/presskit/logos/cc.logo.svg">

मैं Jupyter नोटबुक सर्वर संस्करण 4.3.1

4

इस विधि नहीं करता है पर इन विकल्पों की कोशिश की एक इंटरनेट कनेक्शन की आवश्यकता नहीं है ...

  1. बेस 64-<svg> मार्कअप एन्कोड (उदाहरण के लिए। base64encode.org पर svg पेस्ट करें)
  2. URL64-एन्कोडेड स्ट्रिंग (जैसे।urlencoder.org पर पेस्ट base64 स्ट्रिंग)
  3. ![alt text](data:image/svg+xml,<paste_your_svg_string_here> "title")

में जिसके परिणामस्वरूप स्ट्रिंग रखो परिणाम एक स्ट्रिंग निम्नलिखित है कि एक Jupyter नोटबुक Markdown सेल में डाला जा सकता करने के समान होगा ...

![svg image](data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22100%22%20height%3D%22100%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2240%22%20stroke%3D%22black%22%20stroke-width%3D%223%22%20fill%3D%22red%22%20/%3E%3C/svg%3E%0A)

+1

एक स्वीकार्य उत्तर विवरण मैं आपके द्वारा केवल स्केच किए गए चरणों को कैसे कर सकता हूं। – gboffi

+0

मेरी राय में एक स्वीकार्य उत्तर, विवरण मैं आपके द्वारा केवल स्केच किए गए चरणों को कैसे कर सकता हूं। – gboffi

+0

@gboffi कृपया सही उत्तर के रूप में चिह्नित करें यदि यह आपकी मूल समस्या को संतुष्ट करता है या इस उत्तर को और स्पष्ट करने के तरीके पर सलाह देता है। धन्यवाद। –