update sphinx pages

erdogant · Aug 1, 2022 · 93be3e9 · 93be3e9
1 parent 0e90753
commit 93be3e9
Show file tree

Hide file tree

Showing 8 changed files with 133 additions and 17 deletions.
diff --git a/docs/pages/doctrees/Core Functionalities.doctree b/docs/pages/doctrees/Core Functionalities.doctree
diff --git a/docs/pages/doctrees/d3graph.d3graph.doctree b/docs/pages/doctrees/d3graph.d3graph.doctree
diff --git a/docs/pages/doctrees/environment.pickle b/docs/pages/doctrees/environment.pickle
diff --git a/docs/pages/html/Core Functionalities.html b/docs/pages/html/Core Functionalities.html
@@ -71,6 +71,7 @@
 <li class="toctree-l2"><a class="reference internal" href="#hover-over-text">Hover over text</a></li>
 <li class="toctree-l2"><a class="reference internal" href="#node-color">Node color</a></li>
 <li class="toctree-l2"><a class="reference internal" href="#node-color-on-clustering">Node color on clustering</a></li>
+<li class="toctree-l2"><a class="reference internal" href="#node-edge-color-on-clustering">Node edge color on clustering</a></li>
 <li class="toctree-l2"><a class="reference internal" href="#node-size">Node size</a></li>
 <li class="toctree-l2"><a class="reference internal" href="#node-edge-size">Node edge size</a></li>
 <li class="toctree-l2"><a class="reference internal" href="#node-edge-color">Node edge color</a></li>
@@ -79,6 +80,7 @@
 </li>
 <li class="toctree-l1"><a class="reference internal" href="#edge-properties">Edge properties</a><ul>
 <li class="toctree-l2"><a class="reference internal" href="#customize-edge-properties">Customize edge_properties</a></li>
+<li class="toctree-l2"><a class="reference internal" href="#id1">Customize edge_properties</a></li>
 <li class="toctree-l2"><a class="reference internal" href="#customize-all-edges">Customize all edges</a></li>
 </ul>
 </li>
@@ -286,8 +288,10 @@ <h2>Hover over text<a class="headerlink" href="#hover-over-text" title="Permalin
 
 <span class="c1"># Set node properties</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">set_node_properties</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="n">label</span><span class="p">,</span> <span class="n">hover</span><span class="o">=</span><span class="n">hover</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">label</span><span class="p">)</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
 
-<span class="c1"># Plot</span>
+<span class="c1"># If you want thinner lines</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">set_node_properties</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="n">label</span><span class="p">,</span> <span class="n">hover</span><span class="o">=</span><span class="n">hover</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="n">label</span><span class="p">,</span> <span class="n">minmax</span><span class="o">=</span><span class="p">[</span><span class="mf">0.1</span><span class="p">,</span> <span class="mi">25</span><span class="p">])</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
 </pre></div>
 </div>
@@ -309,6 +313,17 @@ <h2>Node color on clustering<a class="headerlink" href="#node-color-on-clusterin
 <div class="highlight-python notranslate"><div class="highlight"><pre><span></span><span class="c1"># Set node properties</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">set_node_properties</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="n">df</span><span class="p">[</span><span class="s1">&#39;label&#39;</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span> <span class="n">color</span><span class="o">=</span><span class="s1">&#39;cluster&#39;</span><span class="p">)</span>
 
+<span class="c1"># Plot</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
+</pre></div>
+</div>
+</section>
+<section id="node-edge-color-on-clustering">
+<h2>Node edge color on clustering<a class="headerlink" href="#node-edge-color-on-clustering" title="Permalink to this heading"></a></h2>
+<p>We can also change the node color on the clustering.</p>
+<div class="highlight-python notranslate"><div class="highlight"><pre><span></span><span class="c1"># Set node properties</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">set_node_properties</span><span class="p">(</span><span class="n">label</span><span class="o">=</span><span class="n">df</span><span class="p">[</span><span class="s1">&#39;label&#39;</span><span class="p">]</span><span class="o">.</span><span class="n">values</span><span class="p">,</span> <span class="n">edge_color</span><span class="o">=</span><span class="s1">&#39;cluster&#39;</span><span class="p">)</span>
+
 <span class="c1"># Plot</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
 </pre></div>
@@ -370,10 +385,13 @@ <h2>Customize the properties of one specific node<a class="headerlink" href="#cu
 
 <span class="c1"># Customize the properties of one specific node</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">][</span><span class="s1">&#39;label&#39;</span><span class="p">]</span><span class="o">=</span><span class="s1">&#39;Penny Hofstadter&#39;</span>
-<span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">][</span><span class="s1">&#39;color&#39;</span><span class="p">]</span><span class="o">=</span><span class="s1">&#39;#ffc0cb&#39;</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">][</span><span class="s1">&#39;color&#39;</span><span class="p">]</span><span class="o">=</span><span class="s1">&#39;#ffc0cb&#39;</span> <span class="c1"># Pink</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">][</span><span class="s1">&#39;size&#39;</span><span class="p">]</span><span class="o">=</span><span class="mi">20</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">][</span><span class="s1">&#39;edge_size&#39;</span><span class="p">]</span><span class="o">=</span><span class="mi">5</span>
-<span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">][</span><span class="s1">&#39;edge_color&#39;</span><span class="p">]</span><span class="o">=</span><span class="s1">&#39;#000000&#39;</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">][</span><span class="s1">&#39;edge_color&#39;</span><span class="p">]</span><span class="o">=</span><span class="s1">&#39;#0000ff&#39;</span> <span class="c1"># Blue</span>
+
+<span class="c1"># Customize a specific edge property</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">edge_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">,</span> <span class="s1">&#39;Leonard&#39;</span><span class="p">][</span><span class="s1">&#39;color&#39;</span><span class="p">]</span><span class="o">=</span><span class="s1">&#39;#FF0000&#39;</span> <span class="c1"># red</span>
 
 <span class="c1"># Print</span>
 <span class="nb">print</span><span class="p">(</span><span class="n">d3</span><span class="o">.</span><span class="n">node_properties</span><span class="p">[</span><span class="s1">&#39;Penny&#39;</span><span class="p">])</span>
@@ -405,6 +423,10 @@ <h1>Edge properties<a class="headerlink" href="#edge-properties" title="Permalin
 </ol>
 </li>
 <li><ol class="arabic simple" start="4">
+<li><p>color</p></li>
+</ol>
+</li>
+<li><ol class="arabic simple" start="5">
 <li><p>directed</p></li>
 </ol>
 </li>
@@ -428,14 +450,43 @@ <h2>Customize edge_properties<a class="headerlink" href="#customize-edge-propert
 <span class="c1"># (&#39;Sheldon&#39;, &#39;Leonard&#39;): {&#39;weight&#39;: 3.0,&#39;weight_scaled&#39;: 7.3333, &#39;color&#39;: &#39;#000000&#39;}}</span>
 <span class="c1"># ...</span>
 
+<span class="c1"># Set to directed edges</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">set_edge_properties</span><span class="p">(</span><span class="n">directed</span><span class="o">=</span><span class="kc">True</span><span class="p">)</span>
+
 <span class="c1"># Customize the properties of one specific edge</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">edge_properties</span><span class="p">[(</span><span class="s1">&#39;Sheldon&#39;</span><span class="p">,</span> <span class="s1">&#39;Howard&#39;</span><span class="p">)][</span><span class="s1">&#39;weight&#39;</span><span class="p">]</span><span class="o">=</span><span class="mi">10</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">edge_properties</span><span class="p">[(</span><span class="s1">&#39;Penny&#39;</span><span class="p">,</span> <span class="s1">&#39;Leonard&#39;</span><span class="p">)][</span><span class="s1">&#39;color&#39;</span><span class="p">]</span><span class="o">=</span><span class="s1">&#39;#ff0000&#39;</span>
 
 <span class="c1"># Plot</span>
 <span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
 </pre></div>
 </div>
 </section>
+<section id="id1">
+<h2>Customize edge_properties<a class="headerlink" href="#id1" title="Permalink to this heading"></a></h2>
+<div class="highlight-python notranslate"><div class="highlight"><pre><span></span><span class="c1"># Import library</span>
+<span class="kn">from</span> <span class="nn">d3graph</span> <span class="kn">import</span> <span class="n">d3graph</span>
+<span class="c1"># Initialization</span>
+<span class="n">d3</span> <span class="o">=</span> <span class="n">d3graph</span><span class="p">()</span>
+<span class="c1"># Load karate example</span>
+<span class="n">adjmat</span> <span class="o">=</span> <span class="n">d3</span><span class="o">.</span><span class="n">import_example</span><span class="p">(</span><span class="s1">&#39;bigbang&#39;</span><span class="p">)</span>
+<span class="c1"># Process the adjacency matrix</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">graph</span><span class="p">(</span><span class="n">adjmat</span><span class="p">)</span>
+
+<span class="c1"># Set to minmax scaler</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">set_edge_properties</span><span class="p">(</span><span class="n">directed</span><span class="o">=</span><span class="kc">True</span><span class="p">,</span> <span class="n">minmax</span><span class="o">=</span><span class="p">[</span><span class="mi">1</span><span class="p">,</span> <span class="mi">20</span><span class="p">],</span> <span class="n">scaler</span><span class="o">=</span><span class="s1">&#39;minmax&#39;</span><span class="p">)</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
+
+<span class="c1"># Set to zscore scaler (default)</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">set_edge_properties</span><span class="p">(</span><span class="n">directed</span><span class="o">=</span><span class="kc">True</span><span class="p">,</span> <span class="n">minmax</span><span class="o">=</span><span class="p">[</span><span class="mi">1</span><span class="p">,</span> <span class="mi">20</span><span class="p">],</span> <span class="n">scaler</span><span class="o">=</span><span class="s1">&#39;zscore&#39;</span><span class="p">)</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
+
+<span class="c1"># Set to no scaler (default)</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">set_edge_properties</span><span class="p">(</span><span class="n">directed</span><span class="o">=</span><span class="kc">True</span><span class="p">,</span> <span class="n">minmax</span><span class="o">=</span><span class="p">[</span><span class="mi">1</span><span class="p">,</span> <span class="mi">20</span><span class="p">],</span> <span class="n">scaler</span><span class="o">=</span><span class="kc">None</span><span class="p">)</span>
+<span class="n">d3</span><span class="o">.</span><span class="n">show</span><span class="p">()</span>
+</pre></div>
+</div>
+</section>
 <section id="customize-all-edges">
 <h2>Customize all edges<a class="headerlink" href="#customize-all-edges" title="Permalink to this heading"></a></h2>
 <div class="highlight-python notranslate"><div class="highlight"><pre><span></span><span class="c1"># Set edge properties with a edge distance</span>

diff --git a/docs/pages/html/_sources/Core Functionalities.rst.txt b/docs/pages/html/_sources/Core Functionalities.rst.txt
@@ -173,8 +173,10 @@ Getting more information when hovering over a node can be easily done using the
 
 	# Set node properties
 	d3.set_node_properties(label=label, hover=hover, color=label)
+	d3.show()
 
-	# Plot
+	# If you want thinner lines
+	d3.set_node_properties(label=label, hover=hover, color=label, minmax=[0.1, 25])
 	d3.show()
 
 .. raw:: html
@@ -199,6 +201,7 @@ Lets change the **node colors** from the *karate* example using the label inform
 
    <iframe src="https://erdogant.github.io/docs/d3graph/d3graph/karate_label_color.html" height="700px" width="850px", frameBorder="0"></iframe>
 
+
 Node color on clustering
 --------------------------
 
@@ -213,6 +216,21 @@ We can also change the node color on the clustering.
 	d3.show()
 
 
+Node edge color on clustering
+-----------------------------
+
+We can also change the node color on the clustering.
+
+.. code:: python
+
+	# Set node properties
+	d3.set_node_properties(label=df['label'].values, edge_color='cluster')
+
+	# Plot
+	d3.show()
+
+
+
 Node size
 -----------------------
 
@@ -294,10 +312,13 @@ Customize the properties of one specific node
 
 	# Customize the properties of one specific node
 	d3.node_properties['Penny']['label']='Penny Hofstadter'
-	d3.node_properties['Penny']['color']='#ffc0cb'
+	d3.node_properties['Penny']['color']='#ffc0cb' # Pink
 	d3.node_properties['Penny']['size']=20
 	d3.node_properties['Penny']['edge_size']=5
-	d3.node_properties['Penny']['edge_color']='#000000'
+	d3.node_properties['Penny']['edge_color']='#0000ff' # Blue
+
+	# Customize a specific edge property
+	d3.edge_properties['Penny', 'Leonard']['color']='#FF0000' # red
 	
 	# Print
 	print(d3.node_properties['Penny'])
@@ -324,7 +345,8 @@ Edge network properties can also be changed for the edges:
 	* 1. weight
 	* 2. edge_distance
 	* 3. edge_distance_minmax
-	* 4. directed
+	* 4. color
+	* 5. directed
 
 
 Customize edge_properties
@@ -348,13 +370,44 @@ Customize edge_properties
 	# ('Sheldon', 'Leonard'): {'weight': 3.0,'weight_scaled': 7.3333, 'color': '#000000'}}
 	# ...
   
+	# Set to directed edges
+	d3.set_edge_properties(directed=True)
+
 	# Customize the properties of one specific edge
 	d3.edge_properties[('Sheldon', 'Howard')]['weight']=10
+	d3.edge_properties[('Penny', 'Leonard')]['color']='#ff0000'
 	
 	# Plot
 	d3.show()
 
 
+Customize edge_properties
+-----------------------------------------------
+
+.. code:: python
+
+	# Import library
+	from d3graph import d3graph
+	# Initialization
+	d3 = d3graph()
+	# Load karate example
+	adjmat = d3.import_example('bigbang')
+	# Process the adjacency matrix
+	d3.graph(adjmat)
+  
+	# Set to minmax scaler
+	d3.set_edge_properties(directed=True, minmax=[1, 20], scaler='minmax')
+	d3.show()
+
+	# Set to zscore scaler (default)
+	d3.set_edge_properties(directed=True, minmax=[1, 20], scaler='zscore')
+	d3.show()
+
+	# Set to no scaler (default)
+	d3.set_edge_properties(directed=True, minmax=[1, 20], scaler=None)
+	d3.show()
+
+
 Customize all edges
 -----------------------------------------------