D3.js এর পাইথনের সমতুল্য


110

ইন্টারেক্টিভ গ্রাফ ভিজুয়ালাইজেশন করতে পারে এমন কোনও পাইথন লাইব্রেরি কি কেউ সুপারিশ করতে পারে?

আমি বিশেষত d3.js এর মতো কিছু চাই তবে pythonআদর্শভাবে এটি 3 ডিও হতে পারে।

আমি তাকিয়েছি:

  • নেটওয়ার্কএক্স - এটি কেবল Matplotlibপ্লট করে এবং সেগুলি 2D বলে মনে হয়। d3.jsচার্জ নোডের মতো টানানোর মতো কোনও ধরণের ইন্টারেক্টিভিটি আমি দেখিনি ।
  • গ্রাফ-সরঞ্জাম - এটি কেবল 2 ডি প্লট করে এবং খুব ধীর ইন্টারেক্টিভ গ্রাফ রয়েছে।

1
আপনি যদি ব্রাউজার ভিত্তিক সংস্করণটি সন্ধান করেন তবে আপনি নেটওয়ার্কএক্সে একটি গ্রাফ তৈরি করতে এবং তারপরে d3.js এ ম্যানিপুলেট করতে চান।
ক্রটিভিটিয়া

@ ক্রেটিভিটিয়া ঠিক আছে .... আমি কীভাবে আদর্শভাবে এটি করব: গ্রাফ ডেটা (পাইথনের এপিআই কলগুলির মাধ্যমে) -> পাইথন (মেশিন লার্নিং স্টাফ) -> জ্যাঙ্গো / কিছু + ডি 3.জেএস (ভিজ্যুয়ালাইজেশন) -> সুন্দর ছবি এবং ওয়েবসাইট :)
আইরিওওন ভন কাউফ

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

উত্তর:


74

আপনি d3py পাইথন মডিউলটি ব্যবহার করতে পারেন যা d3.js স্ক্রিপ্ট এম্বেড করে এক্সএমএল পৃষ্ঠা তৈরি করে। উদাহরণ স্বরূপ :

import d3py
import networkx as nx

import logging
logging.basicConfig(level=logging.DEBUG)

G = nx.Graph()
G.add_edge(1,2)
G.add_edge(1,3)
G.add_edge(3,2)
G.add_edge(3,4)
G.add_edge(4,2)

# use 'with' if you are writing a script and want to serve this up forever
with d3py.NetworkXFigure(G, width=500, height=500) as p:
    p += d3py.ForceLayout()
    p.show()

আমার জন্য কাজ করেছেন, তবে আমাকে লাইনটির একটি সম্পাদনা করতে হয়েছিল with d3py.NetworkXFigure(G, width=500, height=500, host="localhost") as p:। আমি গিথুব (এসএএএ: 4e92a90f4003370bc086e0f57b19fca1bd4e8fba)
এক্সবিতে

7
দুর্ভাগ্যক্রমে d3py সক্রিয়ভাবে আর বিকশিত হচ্ছে না - ভিনসেন্ট হ'ল আধুনিক সমতুল্য (Vega / d3.js এর কাছে পাইথন ইন্টারফেস) তবে নীচে সাইকোমিডিয়া'র উত্তর (জেসন থেকে রফতানি নেটওয়ার্ক এবং তারপরে d3.js রেন্ডার করা) সবচেয়ে পরিষ্কার হতে পারে।
A.Wan

2
D3py এবং ভিনসেন্টের উত্তরসূরি - altair-viz.github.io ব্যবহার করে দেখুন । এছাড়াও stackoverflow.com/a/49695472/179014 দেখুন ।
asmaier

43

প্লটলি ইন্টারেক্টিভ 2 ডি এবং 3 ডি গ্রাফিং সমর্থন করে। গ্রাফ D3.js সঙ্গে অনুষ্ঠিত হয় এবং একটি সঙ্গে তৈরি করা যেতে পারে পাইথন এপিআই , matplotlib , পাইথন জন্য ggplot , সমুদ্রজাত , prettyplotlib এবং পান্ডাস । আপনি জুম করতে পারেন, প্যান করতে পারেন, টগল টগল চালু এবং বন্ধ করতে পারেন এবং হোভারের ডেটা দেখতে পারেন। প্লটগুলি এইচটিএমএল, অ্যাপ্লিকেশন, ড্যাশবোর্ড এবং আইপিথন নোটবুকগুলিতে এম্বেড করা যেতে পারে। নীচে একটি ইন্টারেক্টিভিটি দেখায় একটি তাপমাত্রা গ্রাফ রয়েছে । আরও উদাহরণের জন্য আইপিথন নোটবুকের টিউটোরিয়ালগুলির গ্যালারী দেখুন ।

এখানে চিত্র বর্ণনা লিখুন



ডক্স সমর্থিত চক্রান্ত ধরনের এবং কোড স্নিপেট উদাহরণ প্রদান করে।



এখানে চিত্র বর্ণনা লিখুন

বিশেষত আপনার প্রশ্নের জন্য, আপনি নেটওয়ার্কএক্সএক্স থেকে ইন্টারেক্টিভ প্লটও তৈরি করতে পারেন ।

এখানে চিত্র বর্ণনা লিখুন

পাইথনের সাহায্যে 3 ডি প্লট করার জন্য আপনি 3 ডি স্ক্যাটার, লাইন এবং পৃষ্ঠের প্লটগুলি একইভাবে ইন্টারেক্টিভ করতে পারেন। প্লটগুলি ওয়েবজিএল দিয়ে রেন্ডার করা হয়। উদাহরণস্বরূপ, ইউকে অদলবদলের হারের একটি 3D গ্রাফ দেখুন ।



এখানে চিত্র বর্ণনা লিখুন

প্রকাশ: আমি প্লটলি দলে রয়েছি।


9
পরিষ্কারভাবে প্রশ্নটি প্রান্তগুলি দ্বারা সংযুক্ত নোডগুলির অর্থে গ্রাফগুলিতে লক্ষ্য করে । এই উত্তরটি অকারণে চক্রান্তের অন্যান্য ভিজ্যুয়ালাইজেশন ক্ষমতা অন্তর্ভুক্ত করে।
লুটজ বুচ

@ মাতিও-সানচেজ এটি অত্যন্ত দুর্ভাগ্যজনক যে প্লটলি কর্পোরেট ক্লায়েন্টদের উপর নজর দেওয়ার জন্য সমস্ত একাডেমিক এবং স্বতন্ত্র সাবস্ক্রিপশন বন্ধ করার সিদ্ধান্ত নিয়েছে
আন্দ্রেউসিও

20

আপনি ভিনসেন্টের দিকে তাকিয়েছেন? ভিনসেন্ট পাইথন ডেটা অবজেক্ট নিয়ে যায় এবং সেগুলিকে ভেগা ভিজ্যুয়ালাইজেশন ব্যাকরণে রূপান্তর করে। ভেগা একটি উচ্চ-স্তরের চাক্ষুষ সরঞ্জাম যা ডি 3 এর শীর্ষে নির্মিত top ডি 3 পিসির তুলনায় ভিনসেন্ট রেপোটি সম্প্রতি আপডেট হয়েছে। যদিও উদাহরণগুলি সমস্ত স্থির ডি 3।

অধিক তথ্য:


আইপিথনে গ্রাফগুলি দেখা যায়, কেবল এই কোডটি যুক্ত করুন

vincent.core.initialize_notebook()

বা JSON এ আউটপুট যেখানে আপনি Vega অনলাইন সম্পাদক ( http://trifacta.github.io/vega/editor/ ) এ JSON আউটপুট গ্রাফ দেখতে পারেন বা স্থানীয়ভাবে তাদের পাইথন সার্ভারে দেখতে পারেন can উপরের পাইপির লিঙ্কটিতে দেখার আরও তথ্য পাওয়া যাবে।

কখন তা নিশ্চিত নয়, তবে পান্ড প্যাকেজটির কোনও সময়ে ডি 3 সংহত হওয়া উচিত। http://pandas.pydata.org/developers.html

বোকেহ একটি পাইথন ভিজ্যুয়ালাইজেশন লাইব্রেরি যা ইন্টারেক্টিভ ভিজুয়ালাইজেশন সমর্থন করে। এর প্রাথমিক আউটপুট ব্যাকএন্ডটি এইচটিএমএল 5 ক্যানভাস এবং ক্লায়েন্ট / সার্ভার মডেল ব্যবহার করে।

উদাহরণ: http://continuumio.github.io/bokehjs/


2
ভিনসেন্ট বেরিয়ে যাচ্ছেন - দেখে মনে হচ্ছে কিছু প্রতিস্থাপন রয়েছে তবে আমি নিশ্চিত নই যে তারা আইপথনের সাথে কতটা ঘনিষ্ঠভাবে আবদ্ধ হবে তারা ..
naught101

19

একটি রেসিপি যা আমি ব্যবহার করেছি (এখানে বর্ণিত হয়েছে: জিইএক্সএফ-এ কো-ডিরেক্টর নেটওয়ার্ক ডেটা ফাইল এবং স্ক্র্যাপারউইকি এবং নেটওয়ার্কেক্সের মাধ্যমে ওপেন কর্পোরেশন ডেটা থেকে জেএসওএন ) নিম্নলিখিত হিসাবে চলে:

  • ব্যবহার করে একটি নেটওয়ার্ক উপস্থাপনা উৎপন্ন networkx
  • নেটওয়ার্কটি একটি JSON ফাইল হিসাবে রফতানি করুন
  • যে JSON d3.js এ আমদানি করুন । ( Networkx উভয় গাছ এবং গ্রাফ / নেটওয়ার্ক উপস্থাপনা যে রপ্তানি করতে পারেন d3.js আমদানি করতে পারেন)।

Networkx তাদেরকে JSON রপ্তানিকারক আকারে:

from networkx.readwrite import json_graph
import json
print json.dumps(json_graph.node_link_data(G))

বিকল্পভাবে আপনি নেটওয়ার্কটি একটি GEXF XML ফাইল হিসাবে রফতানি করতে পারেন এবং তারপরে এই প্রতিনিধিত্বটি সিগমা.জেএস জাভাস্ক্রিপ্ট ভিজ্যুয়ালাইজেশন লাইব্রেরিতে আমদানি করতে পারেন ।

from xml.etree.cElementTree import tostring
writer=gf.GEXFWriter(encoding='utf-8',prettyprint=True,version='1.1draft')
writer.add_graph(G)
print tostring(writer.xml)


7

যারা সুপারিশ জন্য pyd3 , এটা কোনো সক্রিয় উন্নয়ন এবং আপনি পয়েন্ট বয়সী ভিনসেন্ট । ভিনসেন্টও এখন আর সক্রিয় বিকাশের অধীনে নেই এবং এলিডি ব্যবহারের পরামর্শ দেয় ।

সুতরাং আপনি যদি পাইথোনিক ডি 3 চান, তবে বৈদ্যুতিন ব্যবহার করুন।



5

পরীক্ষা করে দেখুন পাইথন-nvd3 । এটি এনভিডি 3 এর জন্য পাইথনের মোড়ক। D3.py এর চেয়ে শীতল দেখায় এবং আরও চার্ট বিকল্প রয়েছে।


4

আমি এমপিএলডি 3 ব্যবহার করার পরামর্শ দিচ্ছি যা ডি 3 জে জাভাস্ক্রিপ্ট ভিজ্যুয়ালাইজেশনের সাথে পাইথনের ম্যাটপ্ল্লোলিবের সংমিশ্রণ করে।

ইনস্টলেশন এবং ব্যবহার সত্যিই সহজ এবং এতে কিছু দুর্দান্ত প্লাগইন এবং ইন্টারেক্টিভ স্টাফ রয়েছে।

http://mpld3.github.io/


3

প্লটলি আপনার জন্য কিছু দুর্দান্ত স্টাফ করতে পারেএখানে চিত্র বর্ণনা লিখুন

https://plot.ly/

আপনার আন্ত: ইন্টারেক্টিভ গ্রাফগুলি তৈরি করে যা আপনার ব্যক্তিগত সার্ভার বা ওয়েবসাইটটির অফ লাইন এপিআই ব্যবহার করে HTML পৃষ্ঠাগুলি সহ সহজেই এম্বেড করা যায়।

আপডেট: আমি এর 3 ডি প্লটিং ক্ষমতা সম্পর্কে নিশ্চিত নই, 2 ডি গ্রাফের জন্য দুর্দান্ত ধন্যবাদ Thanks


2
নোট করুন যে এটি চার্ট ভিজ্যুয়ালাইজেশন ... প্রশ্নটি গ্রাফ ভিজুয়ালাইজেশনের অনুরোধ করে । (আমি এই শব্দগুচ্ছগুলি সাধারণত
বিভ্রান্তিকর

2

আপনি এখানে নিজের মতো করে ডেটা সিরিয়ালাইজ করতে এবং এটি D3.js এ ভিজ্যুয়ালাইজ করতেও বেছে নিতে পারেন: ডি 3 ফোর্স ডাইরেক্টেড নেটওয়ার্ক ডায়াগ্রাম তৈরি করতে পাইথন এবং পান্ডাস ব্যবহার করুন (এটি খুব সুন্দর নোটবুকও নিয়ে আসে !)

এখানে আক্ষেপ আপনি এই বিন্যাসে আপনার গ্রাফ তথ্য সিরিয়ালাইজ করুন:

import json
json_data = {
  "nodes":[
    {"name":"Myriel","group":1},
    {"name":"Napoleon","group":1},
    {"name":"Mlle.Baptistine","group":1},
    {"name":"Mme.Magloire","group":1},
    {"name":"CountessdeLo","group":1},
  ],
  "links":[
    {"source":1,"target":0,"value":1},
    {"source":2,"target":0,"value":8},
    {"source":3,"target":0,"value":10},
    {"source":3,"target":2,"value":6},
    {"source":4,"target":0,"value":1},
    {"source":5,"target":0,"value":1},
  ]
}
filename_out = 'graph_data.json'
json_out = open(filename_out,'w')
json_out.write(json_data)
json_out.close()

তারপরে আপনি d3.js দিয়ে ডেটা লোড করুন:

d3.json("pcap_export.json", drawGraph);

রুটিনের জন্য drawGraphআমি আপনাকে লিঙ্কটি উল্লেখ করি, তবে।


আমি এখন এটি সম্পাদনা করেছি, তবে আমি ড্রগ্রাফ রুটিনকে অন্তর্ভুক্ত করি নি যা নিজেই ড্রলিংকস এবং ড্রনোডস বলে। এটি কেবল খুব জটিল হবে এবং উপাদানগুলি কেবলমাত্র এইচটিএমএল ফাইলের প্রসঙ্গেই বোঝায়।
লুৎজ বুচ

1

নেটওয়ার্কএক্স থেকে জাভাস্ক্রিপ্টের একটি আকর্ষণীয় বন্দর রয়েছে যা আপনি যা করতে পারেন তা করতে পারে। Http://felix-kling.de/JSNetworkX/ দেখুন


এটি কাজ করতে পারে .... আপনি আমাকে ডকুমেন্টেশন রেফার করতে পারেন দয়া করে? অজগর থেকে এই জাভাস্ক্রিপ্ট লাইব্রেরিতে কীভাবে আমি কোনও গ্রাফ আউটপুট দেব ...? আমি প্রথমে পাইথনে এটি তৈরি করতে চাই ... বা আমি কীভাবে এটি লোড করব?
আইরিওওন ভন কাউফ

আমি আসলে কখনই জেএসনেটওয়ার্কএক্স ব্যবহার করি নি তাই এটি কীভাবে কাজ করে তা আমি নিশ্চিত নই।
আরিক

@ আইরিওভাওনকাউফ: ইনপুটটি পাইথনের মতোই, উদাহরণস্বরূপ তালিকাগুলির তালিকা বা ডিক্টের একটি ডিক। আপনি পাইথনে গ্রাফটি তৈরি করতে পারেন, এটি তালিকার তালিকায় রূপান্তর করতে এবং এটি JSON এ রূপান্তর করতে পারেন।
ফেলিক্স ক্লিং

হ্যাঁ, অবশ্যই সহজ। এখানে উদাহরণ সহজ এবং সুন্দর আছেন: felix-kling.de/JSNetworkX/examples
Aric

1

দেখা:

সেখানে কি কোনও ভাল ইন্টারেক্টিভ 3 ডি গ্রাফ লাইব্রেরি রয়েছে?

গৃহীত উত্তরটি নীচের প্রোগ্রামটির পরামর্শ দেয়, যা স্পষ্টতই অজগর বেঁধে রেখেছে: http://ubiversitylab.net/ubigraph/

সম্পাদন করা

আমি নেটওয়ার্কএক্স এর ইন্টারেক্টিভিটি সম্পর্কে নিশ্চিত নই, তবে আপনি অবশ্যই 3 ডি গ্রাফ তৈরি করতে পারেন। গ্যালারিতে কমপক্ষে একটি উদাহরণ রয়েছে:

http://networkx.lanl.gov/examples/drawing/edge_colormap.html

এবং 'উদাহরণ' এর আরও একটি উদাহরণ। এটির অবশ্য আপনার দরকার আছে মায়াবী।

http://networkx.lanl.gov/examples/3d_drawing/mayavi2_spring.html


0

পাইথন ব্যবহার করে স্বয়ংক্রিয়ভাবে D3.js নেটওয়ার্ক ডায়াগ্রাম উত্পন্ন করার একটি ভাল উদাহরণ পেয়েছি: http://brandonrose.org/ner2sna

দুর্দান্ত জিনিসটি হ'ল আপনি স্বয়ংক্রিয়ভাবে উত্পাদিত এইচটিএমএল এবং জেএস দিয়ে শেষ করেন এবং একটি আইফ্রেমের সাথে একটি নোটবুকে ইন্টারেক্টিভ ডি 3 চার্টটি এম্বেড করতে পারেন


0

লাইব্রেরিটি d3graphপাইথনের মধ্য থেকে একটি জোর-নির্দেশিত ডি 3-গ্রাফ তৈরি করবে। আপনি প্রান্তের ওজনের উপর ভিত্তি করে নেটওয়ার্কটি "ব্রেক" করতে পারেন এবং আরও তথ্যের জন্য নোডের উপরে ঘুরে বেড়াতে পারেন। নোডে ডাবল ক্লিক নোড এবং এর সাথে সংযুক্ত প্রান্তগুলিতে ফোকাস করবে।

pip install d3graph

উদাহরণ:

source = ['node A','node F','node B','node B','node B','node A','node C','node Z']
target = ['node F','node B','node J','node F','node F','node M','node M','node A']
weight = [5.56, 0.5, 0.64, 0.23, 0.9,3.28,0.5,0.45]

# Import library
from d3graph import d3graph, vec2adjmat

# Convert to adjacency matrix
adjmat = vec2adjmat(source, target, weight=weight)
print(adjmat)
# target  node A  node B  node F  node J  node M  node C  node Z
# source                                                        
# node A    0.00     0.0    5.56    0.00    3.28     0.0     0.0
# node B    0.00     0.0    1.13    0.64    0.00     0.0     0.0
# node F    0.00     0.5    0.00    0.00    0.00     0.0     0.0
# node J    0.00     0.0    0.00    0.00    0.00     0.0     0.0
# node M    0.00     0.0    0.00    0.00    0.00     0.0     0.0
# node C    0.00     0.0    0.00    0.00    0.50     0.0     0.0
# node Z    0.45     0.0    0.00    0.00    0.00     0.0     0.0

# Example A: simple interactive network
out = d3graph(adjmat)

# Example B: Color nodes
out = d3graph(adjmat, node_color=adjmat.columns.values)

# Example C: include node size
node_size = [10,20,10,10,15,10,5]
out = d3graph(adjmat, node_color=adjmat.columns.values, node_size=node_size)

# Example D: include node-edge-size
out = d3graph(adjmat, node_color=adjmat.columns.values, node_size=node_size, node_size_edge=node_size[::-1], cmap='Set2')

# Example E: include node-edge color
out = d3graph(adjmat, node_color=adjmat.columns.values, node_size=node_size, node_size_edge=node_size[::-1], node_color_edge='#00FFFF')

# Example F: Change colormap
out = d3graph(adjmat, node_color=adjmat.columns.values, node_size=node_size, node_size_edge=node_size[::-1], node_color_edge='#00FFFF', cmap='Set2')

# Example H: Include directed links. Arrows are set from source -> target
out = d3graph(adjmat, node_color=adjmat.columns.values, node_size=node_size, node_size_edge=node_size[::-1], node_color_edge='#00FFFF', cmap='Set2', directed=True)

ডি 3গ্রাফের উদাহরণ

টাইটানিক-কেস থেকে ইন্টারেক্টিভ উদাহরণটি এখানে পাওয়া যাবে: https://erdogant.github.io/docs/d3 راف/titanic_example/index.html https://erdogant.github.io/hnet/pages/html/Use%20Cases .html

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.