小编All*_*nSH的帖子

使用来自表单的输入更新 d3 图表

已经广泛搜索了这方面的帮助,但似乎无法找到足够接近的任何东西。

简而言之,我正在尝试更新我使用 d3.js 生成的图形,其中包含来自与图形位于同一页面上的表单的数据。即我显示一个包含 3 列的柱状图,并希望能够通过图表旁边的简单输入来调整第 3 列的高度。到目前为止,我正在通过 d3 的 csv 方法加载数据,所以这可能不是最好的操作方式。

如果有人可以提供帮助,我将不胜感激!如果您愿意,我可以发布代码,但我认为可能可以实现一般性解释。

欢呼,艾伦

这是我让它工作后的样子:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <style>
            body {
                font: 10px sans-serif;
            }
            .axis path,
            .axis line {
              fill: none;
              stroke: #000;
              shape-rendering: crispEdges;
            }

            .bar {
              fill: steelblue;
            }

            .x.axis path {
              display: none;
            }
        </style>
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://d3js.org/d3.v3.min.js"></script>
    </head>
    <body>
        <div id="chart"></div>
        <div>
            <form>
                A: <input class="fields" id="a" type="float"/>
                B: <input class="fields" id="b" type="float"/>
                C: <input class="fields" id="c" type="float"/>
                <input type="submit" /> …
Run Code Online (Sandbox Code Playgroud)

javascript d3.js

5
推荐指数
1
解决办法
5682
查看次数

标签 统计

d3.js ×1

javascript ×1