DjangoBB LoFi version

Полная версия: Питоном такое можно сделать?

Начало » Web » Питоном такое можно сделать?

kvadrat

Сен. 5, 2012 22:19:30

https://github.com/mbostock/d3/wiki/Gallery

upd
вот это например http://networkx.lanl.gov/ справа от окошка с кодо фигня из точек и связей - она интерактивная, за точки можно дергать - она будет реагировать. но оно же на питоне написано? это ведь не ява скрипт. то есть на питоновских библиотеках можно сделать что то на уровне, как в первой ссылке?ну я конечно про браузер говорю

fata1ex

Сен. 6, 2012 00:09:34

Вы создаете уже не первую тему и никак не хотите понять, что язык программирования - инструмент, решающий определенные задачи. Для “интерактивной фигни” используется JS, HTML5 и CSS. Python не для этого.

kvadrat

Сен. 6, 2012 08:50:32

вот это http://networkx.lanl.gov/ сделано по средствам использования чего? слева я вижу питоновский код

fata1ex, вас никто не заставляет отвечать мне. если мои посты вызывают в вас раздражение, или какие-то другие не комфортные ощущения, просто не отвечайте

FishHook

Сен. 6, 2012 09:00:45

kvadrat
вот это http://networkx.lanl.gov/ сделано по средствам использования чего? слева я вижу питоновский код

fata1ex, вас никто не заставляет отвечать мне. если мои посты вызывают в вас раздражение, или какие-то другие не комфортные ощущения, просто не отвечайте

Где тут код питона?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <title>Overview &mdash; NetworkX 1.7 documentation</title>
    
    <link rel="stylesheet" href="_static/networkx.css" type="text/css" />
    <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
    <link rel="stylesheet" href="_static/force/force.css" type="text/css" />
    
    <script type="text/javascript">
      var DOCUMENTATION_OPTIONS = {
        URL_ROOT:    '',
        VERSION:     '1.7',
        COLLAPSE_INDEX: false,
        FILE_SUFFIX: '.html',
        HAS_SOURCE:  false
      };
    </script>
    <script type="text/javascript" src="_static/jquery.js"></script>
    <script type="text/javascript" src="_static/underscore.js"></script>
    <script type="text/javascript" src="_static/doctools.js"></script>
    <script type="text/javascript" src="_static/force/d3js/d3.min.js"></script>
    <script type="text/javascript" src="_static/force/d3js/d3.geom.min.js"></script>
    <script type="text/javascript" src="_static/force/d3js/d3.layout.min.js"></script>
    <link rel="search" type="application/opensearchdescription+xml"
          title="Search within NetworkX 1.7 documentation"
          href="_static/opensearch.xml"/>
    <link rel="top" title="NetworkX 1.7 documentation" href="#" /> 
  </head>
  <body>
<div style="color: black;background-color: white; font-size: 3.2em; text-align: left; padding: 15px 10px 10px 15px">
NetworkX
</div>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="genindex.html" title="General Index"
             accesskey="I">index</a></li>
        <li class="right" >
          <a href="py-modindex.html" title="Python Module Index"
             >modules</a> |</li>
        <li><a href="#">NetworkX Home </a> |&nbsp;</li>
        <li><a href="download.html">Download </a> |&nbsp;</li>
        <li><a href="http://networkx.lanl.gov/trac">Developer Zone</a>|&nbsp;</li>
        <li><a href="contents.html">Documentation </a>|&nbsp;</li>
        <li><a href="http://networkx.lanl.gov/trac/blog">Blog</a> &raquo;</li>
 
      </ul>
    </div>
      <div class="sphinxsidebar">
        <div class="sphinxsidebarwrapper"><h3>Download</h3>
<p>Current version: <b>1.7</b></p>
<p>Get NetworkX from the <a href="http://pypi.python.org/pypi/networkx">Python Package
Index</a>, or install it with:</p>
<pre>easy_install networkx</pre>
<h3>Questions? Suggestions?</h3>
<p>Join the <a href="http://groups.google.com/group/networkx-discuss">Google group</a>:</p>
<form action="http://groups.google.com/group/networkx-discuss/boxsubscribe"
      style="padding-left: 1em">
  <input type="text" name="email" value="your@email"/>
  <input type="submit" name="sub" value="Subscribe" />
</form>
<p>You can also open a
<a href="http://networkx.lanl.gov/trac/newticket">ticket</a>
 at the <a href="http://networkx.lanl.gov/trac">NetworkX Developer Zone</a>.</p>
<div id="searchbox" style="display: none">
  <h3>Quick search</h3>
    <form class="search" action="search.html" method="get">
      <input type="text" name="q" />
      <input type="submit" value="Go" />
      <input type="hidden" name="check_keywords" value="yes" />
      <input type="hidden" name="area" value="default" />
    </form>
    <p class="searchtip" style="font-size: 90%">
    Enter search terms or a module, class or function name.
    </p>
</div>
<script type="text/javascript">$('#searchbox').show(0);</script>
        </div>
      </div>
    <div class="document">
      <div class="documentwrapper">
        <div class="bodywrapper">
          <div class="body">
            
<h2>High productivity software for complex networks</a></h2>
<blockquote>
<p>NetworkX is a Python language software package for the creation, manipulation, and
study of the structure, dynamics, and functions of complex networks.</p>
</blockquote>
<h2>Quick Example</h2>
<table align="center" style="margin-left: 20px"><tr>
    <td width="50%">
<div class="highlight-python"><div class="highlight"><pre><span class="gp">&gt;&gt;&gt; </span><span class="k">import</span> <span class="nn">networkx</span> <span class="k">as</span> <span class="nn">nx</span>
<span class="gp">&gt;&gt;&gt; </span><span class="n">G</span><span class="o">=</span><span class="n">nx</span><span class="o">.</span><span class="n">Graph</span><span class="p">()</span>
<span class="gp">&gt;&gt;&gt; </span><span class="n">G</span><span class="o">.</span><span class="n">add_node</span><span class="p">(</span><span class="s">&quot;spam&quot;</span><span class="p">)</span>
<span class="gp">&gt;&gt;&gt; </span><span class="n">G</span><span class="o">.</span><span class="n">add_edge</span><span class="p">(</span><span class="mf">1</span><span class="p">,</span><span class="mf">2</span><span class="p">)</span>
<span class="gp">&gt;&gt;&gt; </span><span class="k">print</span><span class="p">(</span class="p"><span class="n">G</span><span class="o">.</span><span class="n">nodes</span><span class="p">())</span>
<span class="go">[1, 2, &#39;spam&#39;]</span>
<span class="gp">&gt;&gt;&gt; </span><span class="k">print</span><span class="p">(</span class="p"><span class="n">G</span><span class="o">.</span><span class="n">edges</span><span class="p">())</span>
<span class="go">[(1, 2)]</span>
</pre></div>
    </td>
    <td width="50%">
    <div id="chart"></div>
    <script type="text/javascript" src="_static/force/force.js"></script>
</td></tr>
</blockquote>
</table>
<h2>Documentation</h2>
<table class="contentstable" align="center" style="margin-left: 30px"><tr>
  <td width="50%">
    <p class="biglink"><a class="biglink" href="overview.html">Overview</a><br/>
       <span class="linkdescr">the big picture</span></p>
    <p class="biglink"><a class="biglink" href="tutorial/index.html">Tutorial</a><br/>
       <span class="linkdescr">get started here</span></p>
    <p class="biglink"><a class="biglink" href="reference/index.html">Reference</a><br/>
       <span class="linkdescr">guide to all functions and classes</span></p>
  </td>
  <td width="50%">
    <p class="biglink"><a class="biglink" href="contents.html">Contents</a><br/>
       <span class="linkdescr">all documentation</span></p>
    <p class="biglink"><a class="biglink" href="examples/index.html">Examples</a><br/>
       <span class="linkdescr">using the library</span></p>
    <p class="biglink"><a class="biglink" href="gallery.html">Gallery</a><br/>
       <span class="linkdescr">network drawings</span></p>
  </td></tr>
</table>
<h2>Features</h2>
<ul class="simple">
<li> Python language data structures for graphs, digraphs, and multigraphs.
<li> Nodes can be &quot;anything&quot; (e.g. text, images, XML records)</li>
<li> Edges can hold arbitrary data (e.g. weights, time-series) 
<li> Generators for classic graphs, random graphs, and synthetic networks</li>
<li> Standard graph algorithms</li>
<li> Network structure and analysis measures</li>
<li> Basic graph drawing</li>
<li> Open source <a href="reference/legal.html">BSD license</a> </li>
<li> Well tested: more than 1500 unit tests</li>
<li> Additional benefits from Python: fast prototyping, easy to teach, multi-platform</li>
</ul>
<p><em></em></p>
          </div>
        </div>
      </div>
      <div class="clearer"></div>
    </div>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="genindex.html" title="General Index"
             >index</a></li>
        <li class="right" >
          <a href="py-modindex.html" title="Python Module Index"
             >modules</a> |</li>
        <li><a href="#">NetworkX Home </a> |&nbsp;</li>
        <li><a href="download.html">Download </a> |&nbsp;</li>
        <li><a href="http://networkx.lanl.gov/trac">Developer Zone</a>|&nbsp;</li>
        <li><a href="contents.html">Documentation </a>|&nbsp;</li>
        <li><a href="http://networkx.lanl.gov/trac/blog">Blog</a> &raquo;</li>
 
      </ul>
    </div>
    <div class="footer">
        &copy; Copyright 2010, NetworkX Developers.
      Last updated on Jul 04, 2012.
      Created using <a href="http://sphinx.pocoo.org/">Sphinx</a> 1.1.3.
    </div>
  </body>
</html>

kvadrat

Сен. 6, 2012 09:12:10

FishHook
Где тут код питона?

Quick Example

>>> import networkx as nx
>>> G=nx.Graph()
>>> G.add_node("spam")
>>> G.add_edge(1,2)
>>> print(G.nodes())
[1, 2, 'spam']
>>> print(G.edges())
[(1, 2)]

как я понял вот этот код управляет той фигней, что справа от когда. ее можно тянуть за узлы, она интерактивная

odnochlen

Сен. 6, 2012 09:22:51

fata1ex
Вы создаете уже не первую тему и никак не хотите понять, что язык программирования - инструмент, решающий определенные задачи. Для “интерактивной фигни” используется JS, HTML5 и CSS. Python не для этого.

GWT, например, генерирует и клиентский код, может, и питон так может.

fata1ex

Сен. 6, 2012 11:03:24

Вы поняли неправильно.

http://networkx.lanl.gov/_static/force/force.js

var w = 200,
    h = 200,
    fill = d3.scale.category20();

var vis = d3.select("#chart")
  .append("svg:svg")
    .attr("width", w)
    .attr("height", h);

d3.json("_static/force/force.json", function(json) {
  var force = d3.layout.force()
      .charge(-120)
      .linkDistance(30)
      .nodes(json.nodes)
      .links(json.links)
      .size([w, h])
      .start();

  var link = vis.selectAll("line.link")
      .data(json.links)
    .enter().append("svg:line")
      .attr("class", "link")
      .style("stroke-width", function(d) { return Math.sqrt(d.value); })
      .attr("x1", function(d) { return d.source.x; })
      .attr("y1", function(d) { return d.source.y; })
      .attr("x2", function(d) { return d.target.x; })
      .attr("y2", function(d) { return d.target.y; });

  var node = vis.selectAll("circle.node")
      .data(json.nodes)
    .enter().append("svg:circle")
      .attr("class", "node")
      .attr("cx", function(d) { return d.x; })
      .attr("cy", function(d) { return d.y; })
      .attr("r", 5)
      .style("fill", function(d) { return fill(d.group); })
      .call(force.drag);

  node.append("svg:title")
      .text(function(d) { return d.name; });

  vis.style("opacity", 1e-6)
    .transition()
      .duration(1000)
      .style("opacity", 1);

  force.on("tick", function() {
    link.attr("x1", function(d) { return d.source.x; })
        .attr("y1", function(d) { return d.source.y; })
        .attr("x2", function(d) { return d.target.x; })
        .attr("y2", function(d) { return d.target.y; });

    node.attr("cx", function(d) { return d.x; })
        .attr("cy", function(d) { return d.y; });
  });
});

http://d3js.org/

FishHook

Сен. 6, 2012 11:37:38

kvadrat
FishHook
Где тут код питона?

Quick Example
>>> import networkx as nx
>>> G=nx.Graph()
>>> G.add_node("spam")
>>> G.add_edge(1,2)
>>> print(G.nodes())
[1, 2, 'spam']
>>> print(G.edges())
[(1, 2)]
как я понял вот этот код управляет той фигней, что справа от когда. ее можно тянуть за узлы, она интерактивная

А с чего Вы взяли, что именно приведенный код нарисовал что-то на этой странице? Я же вам показал код, там нет питона.

Вот пример, эту картинку я нарисовал питоном. Догадайтесь, как она попала на эту страницу?

kvadrat

Сен. 6, 2012 12:15:27

FishHook
А с чего Вы взяли, что именно приведенный код нарисовал что-то на этой странице?

я так подумал, потому что объект(обратите внимание, это не картинка. оно шевелится!!!) находится рядом с кодом под надписью Quick Example.
что вообще делает этот интерактивный элемент на сайте про статичные графики?

FishHook

Сен. 6, 2012 14:45:52

Ты бы хоть в код то поглядел бы, хотя б одним глазком.