D3 单击更新数据集并重新绘制条形图

2024-03-14

我是 d3 和 javascript 的新手,并且在更新数据集以及重新绘制条形时遇到问题。这是我到目前为止一直在查看的代码。

http://jsfiddle.net/TwEhT/2/ http://jsfiddle.net/TwEhT/2/

我有一个函数 clickEvent,它是在单击任何栏时触发的。该函数提示输入一个值。

function clickEvent() 
{
    var op = prompt("Please enter the value", "");
};

我需要做的是更新点击索引处的数据集,并重新绘制矩形,以便它们反映数据集的更改。

任何帮助,将不胜感激。谢谢。


对于一个非常简单的示例,您可以直接更新数据集,并将条形图绘制代码放入 render() 函数中,您可以调用该函数来重新渲染更改。

var dataset = [...];

function render() {
    // bind dataset to rects and draw here
}

function clickEvent(d, i) {
    var op = prompt("Please enter the value", d);
    dataset[i] = parseInt(op, 10);
    render();
};

这是您的代码中的一个运行示例:http://jsfiddle.net/findango/TwEhT/4/ http://jsfiddle.net/findango/TwEhT/4/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

D3 单击更新数据集并重新绘制条形图 的相关文章

  • iPad - 无法在框架内滚动

    我无法滚动 iPad Safari 中框架内调用的 pdf 我已经尝试过两件事 2 指滚动 使用对象 嵌入代替框架 但这是行不通的 事实上我已经尝试了很多东西 溢出 高度等等 请帮我 先感谢您 根据这篇文章http support appl
  • libxmljs 的替代品 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 目标 使用 Node js 访问网页 使用 xpath 语法操作 DOM 并打印新的 DOM libxm
  • DC.js 中的工具提示(D3 库)

    DC js 具有强大的内置功能 可显示每个工具提示文档 https github com dc js dc js blob master web docs api latest md title titleFunction 功能 无论如何
  • 将 R (ramda) 导入 typescript .ts 文件

    我正在尝试使用Ramda js如下
  • 我可以动态创建/销毁 Vue 组件吗?

    因此 我正在创建一个相当复杂的 Vue 应用程序 它从后端 API 获取数据并将其显示在前端 具体取决于用户选择的过滤器 它的默认设置是立即显示所有内容 然后一旦用户选择过滤器 它就会拉出不具有这些属性的 卡片 组件 直到今天 一切都很顺利
  • 我如何使用 querySelector() 选择具有双类的元素

    当我想使用 querySelector 选择元素时遇到问题 ul class xoxo blogroll ul 我怎样才能选择它ul元素 在我的代码中我像这样使用 var list document body querySelector u
  • 如何使用 JavaScript 选择预节点/块中的文本?

    我了解不允许 JS 将任意文本复制到剪贴板背后的安全原因 但是是否有一种方法可以通过单击按钮来选择预节点中的文本 类似于 select 函数在输入中的工作方式 我不是在寻找复制到剪贴板的 jQuery 插件 我只想突出显示预块中的文本 以便
  • 您可以将现有的 div 复制到模式对话框吗

    我有一个带有多个面板的仪表板来显示不同的信息 我希望能够添加一个按钮来以模式显示面板 我正在使用引导程序 我所能找到的只是已经编写的模态 我想复制作为面板的 div 标签的内容 然后将其显示在模型中 但我不确定如何进行 该面板的 html
  • Sonar 中的 javascript 代码覆盖率

    我是使用 Sonar 和插件进行 javascript 代码覆盖的新手 使用 Sonar 分析时 有哪些可能性可以找出 javascript 代码的质量 包括代码覆盖率 目前我正在使用 karma runner 它提供代码覆盖率报告 可以在
  • 实现悬停信息框

    我有一个日历 当用户将鼠标悬停在单元格上时 会出现一个很大的信息框 其中包含该日期的详细信息 虽然当用户离开时使信息框消失 但我遇到了一些麻烦 我基本上想要它 这样当鼠标光标移出信息框隐藏的日历单元格时 它就会消失 但我遇到了麻烦 因为mo
  • 无法读取未定义的“触及”属性

    为什么我会收到此错误无法读取未定义的属性 为什么无法读取formName controls email touched但它能够阅读formName get custDetails touched
  • 递归修剪对象中所有元素的更好方法?

    如果我有一个像这样的物体 const obj field subfield innerObj a asdasd asdas innerArr s ssad innerArrObj b adsad 我想出了这样的东西 const trimFi
  • 将异步事件监听器与 Nestjs EventEmitter 模块和无服务器函数结合使用

    我正在尝试在 Nestjs EventEmitter 模块的帮助下实现具有无服务器 lambda 函数的异步工作线程 处理程序在发出事件时被调用 但该函数在 async await 调用之前关闭 我尝试过同时使用emit and emitA
  • ReactCSSTransitionGroup 组件WillLeave 未调用

    我尝试使用 ReactCssTransition 但不知何故该事件没有被调用 componentWillLeave 这是我的组件 import React Component from react import TransitionGrou
  • 将 onclick 事件应用于页面加载时不存在的元素

    我将列表样式设置为看起来像选择框 并且当用户单击列表中的元素时我想触发一个函数 但是该元素是通过加载的AJAX因此 当页面加载并且我无法绑定时不存在onclick事件到它onDomReady 如果我把它作为一个普通的选择列表 我可以只标记一
  • 是否可以将请求标头添加到 CORS 预检请求中?

    我有一个从外部服务器 不是服务器 访问 API 的网站 为网站提供服务 通过简单的XmlHttpRequest 见下文 那个API 需要将用于访问服务的 API 密钥添加为请求标头 然而 正如这些CORS https developer m
  • 如何为 Imagus 悬停缩放扩展开发自定义过滤器?

    当我读到关于悬停缩放是邪恶的 http www reddit com r YouShouldKnow comments 1wjrc8 ysk that the hover zoom extension is spyware 哎呀 有两篇文章
  • D3 将现有 SVG 字符串(或元素)追加(插入)到 DIV

    我到处寻找这个问题的答案 并找到了一些我认为可能有用的资源 但最终没有让我找到答案 这里有一些 外部SVG http bl ocks org mbostock 1014829 嵌入SVG https stackoverflow com qu
  • 如何获得 JavaScript 阶乘程序的循环来显示所使用的工作?

    你好 我面临着用 JavaScript 编写一个程序的挑战 尽管我对它不太了解 但它要求用户输入一个数字 然后计算该数字的阶乘 我使用了已经提出的问题并设法使计算正常工作 但无法获得所需的输出 我必须在以下输出中获取它 而不使用任何花哨的库
  • 用javascript调用外部网页(跨域)

    我正在尝试使用以下网络服务来验证提要这个问题 https stackoverflow com questions 11996430 check if a url is a valid feed 但浏览器不允许我向另一台服务器发送 ajax

随机推荐

  • 如何在Python中调用带有两个参数的函数

    我想问一下如何在 python 中调用带有两个参数的函数 例如 下面的代码是我想调用颜色函数的示例 def color object return 033 1 34m object 033 1 m tes this must be blue
  • 没有公钥的 EF 实体

    我想在 EF 中创建一个没有公钥的实体 支持表具有非唯一的聚集键 但表中的数据从概念上讲没有可以使用的唯一主键 看来EF确实不喜欢这样 有没有什么方法可以让 EF 接受该表没有主键并使其可以使用它 而不会影响性能 我不在乎结果是否是只读的
  • 当 php://temp 多次打开时会发生什么?

    If the php temp or php memory 文件被打开多次 句柄是否会指向同一个文件 或者每个手柄都是独一无二的 我在 php 文档中找不到答案 所以我要去编写一个测试脚本来找出答案 https stackoverflow
  • 将新 ns 映射到旧 ns

    我将 Android Studio 更新到 4 2 1 并删除了 jcentor 在构建项目时出现了这样的警告 我不明白这些 URL 的含义以及如何修复它 映射新的nshttp schemas android com repository
  • Flask 在文件上传时出现错误 400

    我有以下内容
  • 如何在我的发布 aar 中打包多个 AAR

    我们向客户发送 android sdk aar 文件 我们的代码在内部使用我们的存储库中的两个第三方 aar 并且 gradle 在运行时引用它 我的问题是如何将这些依赖项发送给客户 就好像如果我不想给他们那些第 3 方 aar 我怎样才能
  • 如何通过闪亮的按钮动态添加/删除输入字段

    我一直在尝试找到一种解决方案 如何使用闪亮的按钮添加和删除输入字段 我没有源代码 因为我还没有取得太大进展 但是这个 jQuery 示例 http www mkyong com jquery how to add remove textbo
  • 迁移到.net core 3.1后EF OrderBy出现问题

    考虑这段代码 dbContext Messages GroupBy m gt new MinId m SenderId lt m RecipientId m SenderId m RecipientId MaxId m SenderId g
  • 用g++编译简单的SDL程序时找不到-lSDLmain和-lSDL

    我使用 mingw 安装了 SDL2this http lazyfoo net SDL tutorials lesson01 windows mingw index php指导 但是 当我尝试使用他们提供的编译语法和测试代码进行编译时 仅使
  • java JNI 错误 java.lang.UnsatisfiedLinkError:

    java Djava library path TestJNI gt gt gt gt Exception in thread main java lang UnsatisfiedLinkError TestJNI calibrate D
  • 如何配置 GroovyConsole 以便我不必在启动时导入库?

    我有一个使用第三方库的常规脚本 每次我打开应用程序并尝试运行我的脚本时 我都必须导入正确的库 我希望能够打开 GroovyConsole 并运行我的应用程序 而无需导入库 在 Linux 中你也有 usr share groovy conf
  • NSString stringWithFormat 问题

    我正在尝试使用 NSString 构建一个小表 我似乎无法正确格式化字符串 这是我所拥有的 NSString stringWithFormat 8 6f e v 其中 e 是来自其他地方的 NSString v 是浮点数 我想要的是输出类似
  • Boost.Fusion运行时开关

    我正在从文件中读取对象的类型 enum class type index type index typeidx read file handle type index 根据类型索引 我想创建一个类型 从可能类型的列表中 并用它做一些通用的事
  • Pymongo 使用 $exists

    我是 pymongo 的新手 使用存在时遇到问题 使用时 collection find cwc exists True 我收到以下错误 Unsupported projection option exists 我想要完成的是找到所有 id
  • 可以使用反射访问方法变量吗?

    如何使用反射访问方法内定义的变量 我必须在 Hibernate 中创建标准 数据库是基于属性的 考虑一部电影 一部电影可以有多种语言和多种类型 例如 Movieid Property Value 1 Language Hindi 1 Lan
  • Gulp Typescript + Browserify;捆绑的 sourcemap 指向转译的 JS 而不是源 TS

    我正在开发一个 Typescript 项目 该项目被转换为 ES5 JS 然后通过 browserify 运行以创建单个 js 包和源映射 捆绑的源映射指向转译的 JS而不是源TS即使我生成的源映射在转换为 JS 时正确指向源 TS 这就好
  • 在内存中SQLite3共享数据库python

    我试图充分利用 aws 服务器 并想到跨多个线程使用内存数据库 在 python 中使用 SQLite 3 我在网上找到了这个命令 conn sqlite3 connect file memory cache shared 但后来我得到了这
  • 在Python中,如何在一行代码中创建一个包含n个字符的字符串?

    我需要在Python中生成一个包含n个字符的字符串 是否有一个简单的答案可以使用现有的 Python 库来实现这一目标 例如 我需要一串 10 个字母 string val abcdefghij 简单地重复同一个字母 10 次 string
  • xargs的默认分隔符可以更改吗?

    我想要以下行为 而不必使用选项显式指定它 xargs d n 与大多数命令不同 您不能只使用别名 因为管道无法识别别名 顺便说一句 为什么要这样设计 我也尝试创建自己的 bin xargs脚本 但我认为这并不像在脚本中读取 作为字符串那么简
  • D3 单击更新数据集并重新绘制条形图

    我是 d3 和 javascript 的新手 并且在更新数据集以及重新绘制条形时遇到问题 这是我到目前为止一直在查看的代码 http jsfiddle net TwEhT 2 http jsfiddle net TwEhT 2 我有一个函数