স্থানীয় মেশিন থেকে বা ওয়েব উত্স থেকে, কীভাবে জুপিটার নোটবুকে চিত্র বা ছবি এম্বেড করবেন?

Question

আমি একটি জুপিটার নোটবুকে চিত্র অন্তর্ভুক্ত করতে চাই।

আমি যদি নিম্নলিখিতটি করে থাকি তবে এটি কার্যকর হয়:

from IPython.display import Image
Image("img/picture.png")

তবে আমি ছবিগুলি একটি মার্কডাউন সেলটিতে অন্তর্ভুক্ত করতে চাই এবং নীচের কোডটি 404 ত্রুটি দেয়:

![title]("img/picture.png")

আমিও চেষ্টা করেছি

![texte]("http://localhost:8888/img/picture.png")

তবে আমি এখনও একই ত্রুটি পেয়েছি:

404 GET /notebooks/%22/home/user/folder/img/picture.png%22 (127.0.0.1) 2.74ms referer=http://localhost:8888/notebooks/notebook.ipynb

Answer 1

আপনার অবশ্যই মার্কডাউনতে চিত্রের নামের চারপাশে উদ্ধৃতি চিহ্নগুলি ব্যবহার করবেন না!

আপনি যদি সতর্কতার সাথে আপনার ত্রুটি বার্তাটি পড়েন তবে আপনি %22লিঙ্কটির দুটি অংশ দেখতে পাবেন । এটি এইচটিএমএল এনকোডেড উদ্ধৃতি চিহ্ন।

আপনি লাইন পরিবর্তন করতে হবে

![title]("img/picture.png")

প্রতি

![title](img/picture.png)

হালনাগাদ

ধারণা করা হয়, আপনার নিম্নলিখিত ফাইলের কাঠামো রয়েছে এবং যে jupyter notebookডিরেক্টরিতে ফাইলটি example.ipynb(<- চিত্রের জন্য মার্কডাউন রয়েছে) সংরক্ষণ করা হয় সেখানে আপনি কমান্ডটি চালান :

/
+-- example.ipynb
+-- img
    +-- picture.png

Comments

আমার জন্য, এইচটিএমএল হিসাবে নোটবুক ডাউনলোড করার সময় এটি কাজ করে না। এটি একটি ভাঙা চিত্রের লিঙ্কটি দেখায়। IPython.display.Imageপ্রত্যাশিত হিসাবে কাজ ব্যবহার ।

— joelostblom

@cheflo উপরের সিনট্যাক্সটি এইচটিএমএল ফাইলটিতে চিত্র এম্বেড করে না । আপনি যদি এইচটিএমএল ফাইলের উত্সকোডটি দেখেন তবে <img src = "img / picture.png" Alt = "শিরোনাম"> এর মতো একটি এন্ট্রি পাবেন। ছবিটি দেখতে আপনাকে imgএইচটিএমএল ফাইলের সাথে সম্পর্কিত ফোল্ডারে এটি অনুলিপি করতে হবে।

— সেবাস্তিয়ান স্টিগলার

আমি সন্দেহ করেছি যে বিষয়টি ছিল, স্পষ্ট করার জন্য ধন্যবাদ। আমি ভেবেছিলাম যে দুটি পদ্ধতির মধ্যে এই পার্থক্যটি অপ্রত্যাশিত এবং কমপক্ষে আমার পক্ষে, কোনটি বেছে নেওয়ার সিদ্ধান্ত নিয়েছে তাই আমি এতে মনোযোগ আনতে চাই।

— joelostblom

মার্কডাউনয়ের মাধ্যমে এটি করার সময়, নিশ্চিত করুন যে চিত্র ফাইলটি সেই একই ডিরেক্টরিতে রয়েছে যেখানে আপনার নোটবুকটি পড়েছে, কিছু অদ্ভুত কারণে (আমার ক্ষেত্রে), জিউপিটার-নোটবুক পুরো পথে কাজ করতে রাজি ছিল না ... ![title](picture.png)

— অরুণ কুমার খাত্ত্রি

@ অরুনকুমারখাত্ত্রি - একই বিষয়টি ছিল, কেবলমাত্র নোটবুকের জন্য কাজ করেছিল - আমার ক্ষেত্রে:! [শিরোনাম] (

— ../

Answer 2

জুপিটার নোটবুকগুলিতে একটি ছবি পোস্ট করার বিভিন্ন উপায় রয়েছে:

এইচটিএমএলের মাধ্যমে:

from IPython.display import Image
from IPython.core.display import HTML 
Image(url= "http://my_site.com/my_picture.jpg")

আপনি আবার আকার পরিবর্তন করতে এইচটিএমএল ট্যাগ ব্যবহার করার ক্ষমতা বজায় রাখেন, ইত্যাদি ...

Image(url= "http://my_site.com/my_picture.jpg", width=100, height=100)

আপনি স্থানীয়ভাবে সঞ্চিত চিত্রগুলি আপেক্ষিক বা পরম পথের মাধ্যমেও প্রদর্শন করতে পারেন।

PATH = "/Users/reblochonMasque/Documents/Drawings/"
Image(filename = PATH + "My_picture.jpg", width=100, height=100)

ইমেজটি এটির প্রদর্শন সেটিংসের চেয়ে আরও প্রশস্ত: ধন্যবাদ

unconfined=Trueচিত্রটির সর্বাধিক প্রস্থের সীমাবদ্ধতা অক্ষম করতে ব্যবহার করুন

from IPython.core.display import Image, display
display(Image('https://i.ytimg.com/vi/j22DmsZEv30/maxresdefault.jpg', width=1900, unconfined=True))

বা মার্কডাউনের মাধ্যমে:

• নিশ্চিত করুন যে ঘরটি একটি মার্কডাউন সেল, এবং কোনও কোড সেল নয়, মন্তব্যে @ 游 凯 thanks ধন্যবাদ)
• দয়া করে মনে রাখবেন যে কয়েকটি সিস্টেমে, মার্কডাউন ফাইলের নামগুলিতে সাদা স্থানের অনুমতি দেয় না। মন্তব্যগুলিতে @ কফি টেবিলস্প্রেসো এবং @ জেব্রালামিকে ধন্যবাদ জানাই)
  (ম্যাকোসগুলিতে, যতক্ষণ আপনি মার্কডাউন সেলে থাকবেন আপনি এটি পছন্দ করবেন: ![title](../image 1.png)এবং সাদা স্থান সম্পর্কে চিন্তা করবেন না)।

একটি ওয়েব চিত্রের জন্য:

![Image of Yaktocat](https://octodex.github.com/images/yaktocat.png)

@ ক্রিশ্চিয়ানোমিটার হিসাবে দেখানো হয়েছে এই কোটগুলি ""বা ''ইউআরএল-এর আশেপাশের কোনওটি ব্যবহার না করার জন্য মনোযোগ প্রদান করা ।

বা স্থানীয় একটি:

![title](img/picture.png)

@ সেবাস্তিয়ান দ্বারা প্রদর্শিত

Comments

এটি সত্য যে, চিত্রটি পুনরায় আকার দেওয়ার সম্ভাবনা আকর্ষণীয় is তবে ভবিষ্যতের রেন্ডারিংয়ের জন্য, মার্কডাউন আমার পক্ষে ভাল।

— Ger

আপনি মার্কডাউন হয়ে নিখুঁত পথ দিয়ে কোনও স্থানীয়কে রাখতে পারেন? আমি চেষ্টা করেছি কিন্তু মনে হচ্ছে এটি কাজ করে না। সম্পাদনা করুন: ফায়ারফক্স (এবং ক্রোম) সুরক্ষার জন্য স্থানীয় ফাইলগুলিতে অ্যাক্সেসের অনুমতি দেয় না

— সিপ্রিয়ান টোমাইগা

@ সুইমবাইক্রান আপনার সঠিক কোষটি নির্বাচন করা উচিত। আপনার বর্তমান সেল টাইপ কোড

— youkaichao

আন্ডাররেটেড উত্তর। খুব পুঙ্খানুপুঙ্খ

— নাথান

মার্কডাউন সংস্করণ ফাইল সমস্যায় দৌড়ে থাকা কারও জন্য ফাইলের নাম ফাঁকা করার অনুমতি দেয় না

— কফি টবেল এস্প্রেসো

Answer 3

বিকল্পভাবে, আপনি একটি সরল এইচটিএমএল ব্যবহার করতে পারেন <img src>, যা আপনাকে উচ্চতা এবং প্রস্থ পরিবর্তন করতে দেয় এবং এখনও মার্কডাউন ইন্টারপ্রেটার দ্বারা পড়া হয়:

<img src="subdirectory/MyImage.png" width=60 height=60 />

Comments

গ্রেট! আউটপুট আকারের উপর আমাদের নিয়ন্ত্রণ থাকায় আমি এই উত্তরটি বেশি পছন্দ করি! উদাহরণস্বরূপ এটি জরুরী নোটবুকটি স্থির এইচটিএমএল পৃষ্ঠাগুলি হিসাবে প্রকাশের জন্য পেলিকান সরঞ্জামটি ব্যবহার করার সময় গুরুত্বপূর্ণ।

— 19:38

এইচটিএমএলকে কমা দরকার নেই - কেবল আপনার বৈশিষ্ট্যের মধ্যে একটি স্থান রাখুন - এবং সমস্ত বৈশিষ্ট্যের মানগুলির উদ্যানের উদ্বোধন করার পরামর্শ দেওয়া হয়, যেমন width="60"।

— কলিন 21

পবিত্র sh * টি। এটি দুর্দান্ত দুর্দান্ত

— টেসারাকটার

হ্যাঁ এটি দারুণ :) তবে ... চিত্রটি পিডিএফ সংস্করণে হারিয়ে গেছে। খুব খারাপ.

— বাবু

Answer 4

আমি জানি এটি পুরোপুরি প্রাসঙ্গিক নয়, তবে যেহেতু আপনি ' বৃহত্তর ছবিতে কীভাবে চিত্র প্রদর্শন করবেন ' অনুসন্ধান করার সময় এই উত্তরটি প্রথমবারের মতো স্থান পেয়েছে , দয়া করে এই উত্তরটিও বিবেচনা করুন।

আপনি নিম্নলিখিত হিসাবে একটি চিত্র দেখাতে matplotlib ব্যবহার করতে পারেন।

import matplotlib.pyplot as plt
import matplotlib.image as mpimg
image = mpimg.imread("your_image.png")
plt.imshow(image)
plt.show()

Answer 5

আমি অবাক হয়েছি এখানে কেউ এইচটিএমএল সেল ম্যাজিক বিকল্পটি উল্লেখ করেনি। দস্তাবেজগুলি থেকে (আইপিথন তবে বৃহস্পতির ক্ষেত্রে একই)

%% এইচটিএমএল

Render the cell as a block of HTML

Answer 6

এইচটিএমএল ব্যবহার করে অন্য উত্তরগুলি ছাড়াও (মার্কডাউন বা %%HTMLজাদু ব্যবহার করে :

যদি আপনাকে চিত্রের উচ্চতা নির্দিষ্ট করতে হয় তবে এটি কাজ করবে না:

<img src="image.png" height=50> <-- will not work

এর কারণ হল জপিটারে সিএসএস স্টাইলিং ট্যাগগুলির height: autoজন্য প্রতি ডিফল্ট ব্যবহার করে img, যা এইচটিএমএল উচ্চতার বৈশিষ্ট্যকে ওভাররাইড করে। heightপরিবর্তে আপনার সিএসএস বৈশিষ্ট্যটি ওভাররাইট করা দরকার :

<img src="image.png" style="height:50px"> <-- works

Answer 7

চিত্রটি জুপিটার নোটবুকে সরাসরি .োকান।

দ্রষ্টব্য: আপনার কম্পিউটারে চিত্রের স্থানীয় কপি থাকা উচিত

আপনি জুপিটার নোটবুকে ছবিটি sertোকাতে পারেন। এইভাবে আপনাকে ফোল্ডারে চিত্রটি আলাদাভাবে রাখার দরকার নেই।

পদক্ষেপ:

1. এতে ঘরে রূপান্তর করুন markdown:

   • নির্বাচিত ঘরে
     OR টিপে এম টিপুন
     
   • মেনু বার থেকে, সেল> সেল টাইপ> মার্কডাউন থেকে।
     ( দ্রষ্টব্য: সেলটিকে মার্কডাউনে রূপান্তর করা গুরুত্বপূর্ণ, অন্যথায় পদক্ষেপ 2 এ "চিত্র সন্নিবেশ করুন" বিকল্পটি সক্রিয় হবে না)

2. এখন মেনু বারে যান এবং সম্পাদনা -> চিত্র সন্নিবেশ নির্বাচন করুন।

3. আপনার ডিস্ক থেকে চিত্র নির্বাচন করুন এবং আপলোড করুন।

4. Ctrl+ Enterবা Shift+ টিপুন Enter।

এটি চিত্রটি নোটবুকের অংশ হিসাবে তৈরি করবে এবং আপনাকে ডিরেক্টরি বা গিথুবগুলিতে আপলোড করার দরকার নেই। আমি মনে করি এটি দেখতে আরও পরিষ্কার এবং ভাঙা URL ইস্যুতে প্রবণ নয়।

Comments

আমাকে

— বাঁচিয়েছে

ডিভস দ্বারা যুক্ত করা আরও একটি কার্যকর কার্যকারিতা Jupyter। একটি অসুবিধা লক্ষণীয়, ক্ষেত্রে যখন এটি গুরুত্বপূর্ণ: এটি কোডটিতে চিত্রটি অন্তর্ভুক্ত করবে IPyNB Jason, সুতরাং এটি কোডটি পুনর্বিবেচনা বন্ধুত্বপূর্ণ হিসাবে নয় (উদাহরণস্বরূপ পরিদর্শন করার সময় diff) নয়।

— ওলাদ-

Answer 8

আপনি মার্কডাউন দিয়ে এটি কীভাবে করতে পারেন তা এখানে:

![Image of Yaktocat](https://octodex.github.com/images/yaktocat.png)

Comments

কিছু কারণে, মার্কডাউনের মাধ্যমে চিত্রগুলি প্রদর্শন করা আমার পক্ষে কাজ করে না ... আপনি কি সিনট্যাক্সটি সঠিক ক্রিশ্চিয়ানমিটারের বিষয়ে নিশ্চিত?

— রেবলোকন মসজিদ

হ্যাঁ, এটি আবার পরীক্ষা করে দেখুন। আপনি কি নিশ্চিত যে সেলটি মার্কডাউনে সেট করেছেন? এছাড়াও, আপনি আইপিথন / জুপিটারের কোন সংস্করণ ব্যবহার করছেন? মাইন বলেছেন: "নোটবুক সার্ভারের সংস্করণটি .4.০.৪ এবং এটি চলছে: পাইথন ২.7.৮ (ডিফল্ট, জুন 30 2014, 16:08:48) [এমএসসি ভি.1500 64 বিট (এএমডি 64)]" এখানে একটি ফলাফল সঙ্গে স্ক্রীনশট: i.imgur.com/4ISJFDE.png

— cristianmtr

পাথ সম্পর্কে সাবধান থাকুন, স্থানীয়ভাবে যা কাজ করে তা অনলাইনে কাজ করে না, .e। imgs \ pic.png স্থানীয়ভাবে কাজ করে, অনলাইনে এটি 1: কেস সেনসিটিভ (Pic.png) 2: ব্যাকস্ল্যাচ এবং স্ল্যাশ এক নয় ...: / -

— বুদ্ধিমান-অবকাঠামো

পাইথন 3.8 এ দুর্দান্ত কাজ করে। ধন্যবাদ

— জামেস্কেপবেল

ফাইল

— নামটিতে মার্কডাউন করার

Answer 9

1. সেল মোডটি মার্কডাউনে সেট করুন
2. আপনার চিত্রটি ঘরে টেনে এনে ছেড়ে দিন। নিম্নলিখিত কমান্ড তৈরি করা হবে:

![image.png](attachment:image.png)

3. সেলটি চালান / চালান এবং চিত্রটি প্রদর্শিত হবে।

চিত্রটি আসলে আইপিনব নোটবুকটিতে এম্বেড করা আছে এবং আপনার আলাদা ফাইলের সাথে গোলমাল করার দরকার নেই। এটি দুর্ভাগ্যক্রমে এখনও জুপিটার-ল্যাব (বনাম 1.1.4) এর সাথে কাজ করছে না।

সম্পাদনা করুন: JupyterLab সংস্করণ 1.2.6 এ কাজ করে

Comments

হ্যাঁ ব্যাট আমি যখন HTML টি এম্বেড হিসাবে ডাউনলোড করতে চাই তখন আমি ত্রুটিটি পাই "এনবি কনভার্ট ব্যর্থ: অনুপস্থিত সংযুক্তি: imagen.png"। ¿কেন?

— এফিউयो

ক্লিপবোর্ড থেকে একটি চিত্র Markdown

— আটকানোও

Answer 10

আপনি যদি জুপিটার নোটবুক এপিআই ব্যবহার করতে চান (এবং আইপিথন আর নয়), আমি আইপিউজেটস জুপিটারের সাব-প্রকল্পটি পাই । আপনার একটি Imageউইজেট আছে ডক্ট্রিং উল্লেখ করে যে আপনার কাছে একটি valueপ্যারামিটার যা বাইট। সুতরাং আপনি এটি করতে পারেন:

import requests
from ipywidgets import Image

Image(value=requests.get('https://octodex.github.com/images/yaktocat.png').content)

আমি সম্মত, মার্কডাউন স্টাইলটি ব্যবহার করা সহজ। তবে এটি আপনাকে চিত্র প্রদর্শন নোটবুক এপিআই দেখায়। আপনি পরামিতি widthএবং heightপরামিতিগুলির সাহায্যে চিত্রটিকে পুনরায় আকার দিতে পারেন ।

Comments

এর valueমধ্যেই মনে হয় বিকল্পটির নতুন নামকরণ করা dataহয়েছিল। স্থানীয়ভাবে সঞ্চিত চিত্রের জন্য কোডটি Image(data=open(filename_png, 'rb').read())আমার জন্য কাজ করেছিল।

— jottbe

Answer 11

এখানে জন্য একটি সমাধান পাওয়া যাবে Jupyter এবং Python3 :

আমি আমার ছবিগুলি নামক ফোল্ডারে ফেলেছি ImageTest। আমার ডিরেক্টরিটি হ'ল:

C:\Users\MyPcName\ImageTest\image.png

চিত্রটি দেখানোর জন্য আমি এই প্রকাশটি ব্যবহার করেছি:

![title](/notebooks/ImageTest/image.png "ShowMyImage")

এছাড়াও /এবং জন্য নজর রাখুন\

Comments

এটি কেবল আমার জন্য কাজ করে। ধন্যবাদ! "শোমাই আইমেজ" কবজির মতো কাজ করে!

— প্রানজেল

Answer 12

এটি মার্কডাউন সেলটিতে আমার জন্য কাজ করে। এটির কোনও চিত্র বা কোনও সাধারণ ফাইল হলে কোনওভাবেই আমি বিশেষভাবে উল্লেখ করার দরকার নেই।

![](files/picture.png)

Comments

সেবাস্তিয়ান স্টিলারের উত্তর থেকে এটি কীভাবে আলাদা?

— আইনেট

কেবল হাইলাইট করতে চেয়েছিলাম যে এটি স্কোয়ার বন্ধনীটির মধ্যে শিরোনাম না রেখে এটি আমার পক্ষে কাজ করেছে। কিছুই আলাদা না।

— প্রণব পণ্ডিত

Answer 13

একটি জিনিস আমি পেয়েছি হ'ল আপনার চিত্রের পথটি অবশ্যই নোটবুক যেখানেই লোড হয়েছিল সেখান থেকে অবশ্যই সম্পর্কিত relative আপনি যদি কোনও আলাদা ডিরেক্টরিতে সিডি করেন, যেমন চিত্রগুলি আপনার মার্কডাউন পথটি এখনও মূল লোডিং ডিরেক্টরিটির সাথে সম্পর্কিত।

Answer 14

সম্মত, আমার একই সমস্যা ছিল এবং এটিই কাজ করেছিল এবং কী করেনি:

WORKED: <img src="Docs/pinoutDOIT32devkitv1.png" width="800"/>
*DOES NOT WORK: <img src="/Docs/pinoutDOIT32devkitv1.png" width="800"/>
DOES NOT WORK: <img src="./Docs/pinoutDOIT32devkitv1.png" width="800"/>*

Answer 15

উপরের অনেকগুলি উত্তর একটি ফাইল ব্যবহার করে বা পাইথন কোড সহ কোনও চিত্র এম্বেড করার উপায় দেয়, তবে কেবলমাত্র মার্কডাউন এবং বেস 64 ব্যবহার করে জুপিটার নোটবুকে একটি চিত্র এম্বেড করার উপায় রয়েছে!

ব্রাউজারে কোনও চিত্র দেখতে, আপনি data:image/png;base64,**image data here**একটি বেস 64-এনকোডেড পিএনজি চিত্রের জন্য, অথবা data:image/jpg;base64,**image data here**বেস 64-এনকোডেড জেপিজি চিত্রের জন্য লিঙ্কটি দেখতে পারেন । একটি উত্তর লিঙ্ক এই উত্তর শেষে পাওয়া যাবে।

একটি markdown পৃষ্ঠাতে এই এম্বেড করতে, কেবল ফাইল উত্তর হিসাবে একটি অনুরূপ কনস্ট্রাক্ট ব্যবহার করেন, কিন্তু একটি করুন Base64- পরিবর্তে সংযোগ আছে: ![**description**](data:image/**type**;base64,**base64 data**)। এখন আপনার চিত্রটি আপনার বৃহত্তর নোটবুক ফাইলটিতে এম্বেড হয়েছে!

উদাহরণ লিঙ্ক: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAD9JREFUGJW1jzEOADAIAqHx/1+mE4ltNXEpI3eJQknCIGsiHSLJB+aO/06PxOo/x2wBgKR2jCeEy0rOO6MDdzYQJRcVkl1NggAAAABJRU5ErkJggg==

মার্কডাউন উদাহরণ: ![smile](data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAD9JREFUGJW1jzEOADAIAqHx/1+mE4ltNXEpI3eJQknCIGsiHSLJB+aO/06PxOo/x2wBgKR2jCeEy0rOO6MDdzYQJRcVkl1NggAAAABJRU5ErkJggg==)