मार्कडाउन में स्थानीय छवि कैसे प्रदर्शित करें


141

मैं मार्कडाउन में निम्नलिखित की कोशिश करता हूं, लेकिन लगता है कि काम नहीं करता है, किसी को पता है कि मार्कडाउन में स्थानीय छवि कैसे प्रदर्शित की जाए? मैं उसके लिए एक वेबसर्वर सेटअप नहीं करना चाहता। धन्यवाद

![image](files/Users/jzhang/Desktop/Isolated.png)

जवाबों:


108

मुझे संदेह है कि रास्ता सही नहीं है। जैसा कि user7412219 ubuntu ने बताया है और खिड़कियां अलग तरीके से डील करती हैं। अपने नोटबुक के रूप में उसी फ़ोल्डर में छवि डालने का प्रयास करें और उपयोग करें:

![alt text](Isolated.png "Title")

खिड़कियों पर डेस्कटॉप होना चाहिए: C: \ Users \ jzhang \ Desktop


5
"शीर्षक" क्या करता है?
एनआईकेसी केमेल

6
यदि आप छवि पर अपने माउस मँडरा करते हैं तो @niCkAMAM "शीर्षक" दिखाया जाता है। "ऑल्ट टेक्स्ट" वह है जो दिखाया जाता है, इसके बजाय, यदि छवि प्रदर्शित नहीं की जा सकती है।
क्रिस

2
"छवि को उसी फ़ाइल में रखने का प्रयास करें": क्या यह फ़ाइल -> फ़ोल्डर माना जाता है ?
पैट्रिक

60

निम्न दस्तावेज़ के बगल में एक सबफ़ोल्डर में एक छवि के सापेक्ष पथ के साथ काम करता है (वर्तमान में केवल एक विंडोज सिस्टम पर परीक्षण किया गया है):

![image info](./pictures/image.png)

1
IMHO सबसे अच्छा जवाब, वांछित तरीके से एक GitHub मार्कडाउन फ़ाइल के साथ काम करता है।
एरच कुएस्टर

सबसे अच्छा जवाब!
ज़हरा ताहेरी

21

सबसे अच्छा समाधान फ़ोल्डर के लिए एक पथ प्रदान करना है जहां एमडी दस्तावेज़ स्थित है।

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

दस्तावेज़ के समान स्तर पर एक फ़ोल्डर होना, जिसमें सभी चित्र शामिल हैं, सबसे साफ और सबसे सुरक्षित समाधान है। यह GitHub, स्थानीय, स्थानीय वेबसर्वर पर लोड होगा।

images_folder/img.jpg  < works


/images_folder/img.jpg  < this will work on webserver's only (please read the note!)

पूर्ण पथ का उपयोग करते हुए, छवि केवल इस तरह एक यूआरएल के साथ सुलभ होगी: http: //hostname.doesntmatter/image_folder/img.jpg


1
+1 के लिए "सबसे अच्छा समाधान फ़ोल्डर के लिए एक पथ प्रदान करना है जहां एमडी दस्तावेज़ स्थित है।" इसने मेरी स्थानीय मशीन पर छवियां दिखाईं।
मास्टरजो

17

क्रमशः :

  1. Images की तरह एक निर्देशिका बनाएँ और Markdown द्वारा प्रदान की जाएगी कि सभी छवियों को रखा।

  2. उदाहरण के लिए, example.png को Images में रखें

  3. Example.png लोड करने के लिए जो पहले इमेज डायरेक्टरी के तहत स्थित था ।

![title](Images/example1.png)

नोट : छवियाँ निर्देशिका को आपकी मार्कडाउन टेक्स्ट फ़ाइल की उसी निर्देशिका के अंतर्गत स्थित होना चाहिए जिसमें.mdएक्सटेंशन है।


उस "छवियाँ" फ़ोल्डर का पथ क्या है? क्या आपने इसे vscode में किसी भी कॉन्फिगर में जोड़ा है?
K_dev

1
@K_dev "चित्र" निर्देशिका को आपकी मार्कडाउन टेक्स्ट फ़ाइल की उसी निर्देशिका के अंतर्गत स्थित होना चाहिए जिसमें ".md" एक्सटेंशन है। मैंने vscode में कोई कॉन्फिगर नहीं जोड़ा।
nevzatseferoglu

14

मार्कडाउन फ़ाइल में एक छवि जोड़ने के लिए .md फ़ाइल और छवि एक ही डायरेक्टरी में होनी चाहिए। जैसा कि मेरे मामले में मेरी .md फ़ाइल doc फ़ोल्डर में थी इसलिए मैंने छवि को उसी फ़ोल्डर में स्थानांतरित कर दिया। उसके बाद .md फ़ाइल में निम्न सिंटैक्स लिखें

![alt text](filename)

पसंद ![Car Image](car.png)

इसने मेरे लिए काम किया है।


7

एक स्थानीय छवि को मेरे द्वारा इस तरह से जोड़ने का काम किया: ![alt text](file://IMG_20181123_115829.jpg)

file://उपसर्ग के बिना यह काम नहीं करता था (Win10, नोटपैड ++ मार्कडाउन व्यूअर ++ एडऑन के साथ)

संपादित करें: मुझे पता चला कि यह html टैग के साथ भी काम करता है, और यह बेहतर है: <img src="file://IMG_20181123_115829.jpg" alt="alt text" width="200"/>

Edit2: एटम एडिटर में यह केवलfile:// उपसर्ग के बिना काम करता है । क्या झंझट है।


3

मेरे ज्ञान के लिए, लिनक्स पर VSCode के लिए, स्थानीय छवि को सामान्य रूप से केवल तभी प्रदर्शित किया जा सकता है जब आप छवि को अपनी .mdपोस्ट फ़ाइल के समान फ़ोल्डर में डालते हैं ।
यानी केवल ![](image.jpg)या ![](./image.jpg)काम करेगा।
यहां तक ​​कि निरपेक्ष मार्ग ![](/home/bala/image.jpg)भी काम नहीं करता है।


3

संपादित:

मेरे लिए काम करना (स्थानीय छवि के लिए)

![system schema](doc/systemDiagram.jpg)

 tree
 ├── doc
     └── jobsSystemSchema.jpg
 ├── README.md

मार्कडाउन फ़ाइल README.md, डॉक डायरेक्टरी के समान स्तर पर है।

आपके मामले में, आपकी मार्कडाउन फ़ाइल निर्देशिका फ़ाइलों के समान स्तर पर होनी चाहिए।

मेरे लिए काम करना (कच्चे रास्ते के साथ पूर्ण यूआरएल)

![system schema](https://server/group/jobs/raw/master/doc/systemDiagram.jpg)

मेरे लिए काम नहीं कर रहा है (बूँद पथ के साथ यूआरएल)

![system schema](https://server/group/jobs/blob/master/doc/systemDiagram.jpg)

मुझे लगता है कि आपका url मान्य नहीं है: https के बाद एक स्लैश गायब है। थोड़ी देर, शायद। :)
फन्डर

धन्यवाद @Funder, मैं url को सही करता हूं, यह एक मिस टाइपिंग था। 😉
Lingjing फ्रांस

2

पहले से प्रदर्शित नहीं की गई स्थानीय छवि के लिए एक और संभावना छवि संदर्भ के अनजाने संकेत है - पहले रिक्त स्थान ![alt text](file)

यह इसे 'इमेज इन्क्लूजन' के बजाय 'कोड ब्लॉक' बनाता है। बस प्रमुख स्थानों को हटा दें।


1

मुझे आर मार्केडाउन में चित्र सम्मिलित करने में समस्या है। यदि मैं संपूर्ण URL करता हूं: C:/Users/Me/Desktop/Project/images/image.pngयह काम करता है। अन्यथा, मुझे मार्कडाउन को या तो उसी डायरेक्टरी में रखना होगा, जैसा कि चित्र या पूर्वज डायरेक्टरी में है। ऐसा प्रतीत होता है कि छवियों को संदर्भित करते समय घोषित बुनाई निर्देशिका को अनदेखा किया जाता है।


यह प्रश्न का उत्तर प्रदान नहीं करता है। आप इसी तरह के प्रश्नों की खोज कर सकते हैं , या उत्तर खोजने के लिए पृष्ठ के दाईं ओर संबंधित और जुड़े प्रश्नों को देख सकते हैं। यदि आपके पास संबंधित लेकिन अलग प्रश्न है, तो एक नया प्रश्न पूछें , और संदर्भ प्रदान करने में मदद करने के लिए इस पर एक लिंक शामिल करें। देखें: प्रश्न पूछें, उत्तर प्राप्त करें, कोई ध्यान भंग न करें
शांतेश्वर Inde

0

या तो छवि को उसी फ़ोल्डर में रखें जैसे मार्कडाउन फ़ाइल या छवि के सापेक्ष पथ का उपयोग करें।



0

में Jupyter नोटबुक Markdown , तो आप उपयोग कर सकते हैं

<img src="RelPathofFolder/File" style="width:800px;height:300px;">

पठनीयता में मदद करने के लिए त्वरित संपादन (और टाइपो फिक्स) किया, सही लिंक होना चाहिए, लेकिन मामले में जाँच के लायक है :)
डैनियल ब्रोच

1
प्रो: <img >टैग के साथ एचटीएमएल अनुकूलन जोड़ा
सुमंत लाजर 10

0

आपके टूल के आधार पर - आप HTML को मार्कडाउन में भी इंजेक्ट कर सकते हैं।

<img src="./img/Isolated.png">

यह मान लेता है कि आपकी फ़ोल्डर संरचना है:

 ├── img
     └── Isolated.jpg
 ├── README.md

-2

वेब सर्वर सेट करने की आवश्यकता नहीं है

मैंने अपनी स्थानीय छवि को टिप्पणी के अनुभाग में अपलोड करने की कोशिश की और जनरेट किए गए URL को केवल कॉपी और पेस्ट किया। मेरे लिए काम किया 😊

यहां छवि विवरण दर्ज करें


-3

मुझे एक समाधान मिला:

क) उदाहरण इंटरनेट:

![image info e.g. Alt](URL Internet to Images.jpg "Image Description")

b) उदाहरण स्थानीय छवि:

![image Info](file:///<Path to your File><image>.jpg "Image Description")
![image Info](file:///C:/Users/<name>/Pictures/<image>.jpg "Image Description")

TurboByte

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.