Tag: d3.js

通过HTML加载D3模块与节点需求语句: 问题执行以下代码会根据模块的加载位置而产生不同的结果。 d3.tsv("data.tsv", function(error, data) { if (error) throw error; console.log(data); } 当D3库加载到html文件中时，使用下面的脚本标签 <script src="node_modules/d3/build/d3.js" type="text/javascript"></script> 在上面的例子中，data data.tsv中的data按照预期被导入到variablesdata中。当从节点terminal（REPL）或脚本导入库时，如下所示， data的内容最终为三个对象数组，其中所有对象都包含Error: connect ECONNREFUSED 127.0.0.1:80 。 let d3 = require('d3'); d3.tsv("data.tsv", function(error, data) { if (error) throw error; console.log(data); } 放弃这是一个电子应用程序，问题发生在渲染过程而不是主要过程。 D3正被用来组件UI。浏览器安全性如下，解释如何通过本地托pipe文件（如使用本地Web服务器）或使用Electron API 访问本地文件轻松解决此问题。题如前所述，D3文档小组解释说，浏览器安全限制了文件的访问，但是这两个import之间的function差异是什么，为什么它只能以一种方式工作，而不是另一种？

D3请求错误地组装path和使用错误的主机: 我通过npm start 10.0.1.18:3000运行服务器。我正在做： import * as request from 'd3-request'; const myPath = './data/my_file.json'; request.json(myPath, (error,data)=>console.log(error,data)); 这是失败的，一个错误： "Failed to execute 'fetch' on 'Window': Failed to parse URL from //localhost:80./data/my_file.json ” 好像有两个问题：它正在寻找localhost:80而不是10.0.1.18:3000 只是把path连接起来，包括领先的“。” 而不是正确地解释它。

使用D3和C3绘制一个简单的图表: 我正在使用node.js（我不知道在这种情况下是否重要）。我想用d3和c3绘制一个简单的条形图。我的html如下所示。没有输出。我在这里做错了什么？ var chart = c3.generate({ data:{ columns:[ ['data1', 90, 30] ], type: 'bar' } }); <script src="https://d3js.org/d3.v4.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.18/c3.js"></script> <head> <title></title> </head> <body> <div id="chart"></div> </body>

要求“d3-select-multi”作为节点模块不工作: 我通过npm安装了d3，并直接要求在我的脚本中（出于某种原因）所以： npm install d3 接着 var d3 = require("d3"); 工作正常。现在的问题是，我需要“d3select多”模块。我也通过npm安装它 npm install d3-selection-multi 在d3-Doku我读，你可能需要不同的模块，如： var d3 = Object.assign({}, require("d3-format"), require("d3-geo"), require("d3-geo-projection")); 我改变了我的需要，这将是有标准的D3包（工作已经上面），并添加D3select多。 var d3 = Object.assign({}, require("d3"), require("d3-selection-multi")); 那不行。所以我通过打印出结果对象来testing它： console.log(d3) 结果是正确的： {version: "4.11.0", bisect: ƒ, bisectRight: ƒ, bisectLeft: ƒ, ascending: ƒ, …} 但是“d3-selection-multi”模块不存在。我可以看到，因为它不能识别d3.selectAll().styles作为函数。我尝试了以下：而不是 var d3 = Object.assign({}, require("d3"), require("d3-selection-multi")); […]

d3.js节点和链接: 我试图让节点连接到线，并能拖动时移动。我知道我需要一个鼠标，鼠标，鼠标和鼠标。但是，我不知道如何使用d3.js来做到这一点，因为我从来没有做过。这是我迄今为止所做的。 window.onload = function () { var drawOptions = { // dimensions of svg element SVG_WIDTH: 800, SVG_HEIGHT: 600, SHRINK_FACTOR: 100, BIG_CIRCLE: 200 }; // 1. array of objects representing the network // each object is a province or state // preliminary version – only 2 provinces, 1 state var provincesAndStates = […]

可视化stream速非常高的数据: 我正在使用Twitter Storm进行stream式高速/大数据的实时分析。现在我不知道如何有效地在浏览器上可视化数据。我的意思是Storm正在处理的速度真的非常快，风暴正在集群上工作。我刚刚遇到了Node.js和D3.js的组合来解决这个显示问题。由于我不是从UI或JavaScript世界，所以只是想知道我是否正确的方向？有人能简单地解释一下这个组合能给我带来什么吗？

如何使用代码删除D3树节点？: 我有这个小提琴http://jsfiddle.net/Deansmithok/3HeU9/ 我想删除一个节点（和它的链接）在我最后的尝试中：我已经保存了DOM中的d.id作为$（'＃inpSelidTAUsers'）。val（）然后试着这个代码… svgGroup.selectAll('path.link').filter(function(d, i) { if (d.target.id == $('#inpSelidTAUsers').val() ) return true; else return false; }).remove(); svgGroup.selectAll('g.node').data(nodes).filter(function(d, i) { if (d.id == $('#inpSelidTAUsers').val()) return true; else return false; }).remove(); 此代码确实会删除屏幕上的节点和链接。但是如果我调用DrawItAll（root），那么节点RE-APPEARS。请告诉我如何删除节点，使它保持GONE 🙂

Node.js：如何将JSvariables的值从脚本传递给terminal？: 给定一个运行D3jsdynamicdataviz的JS脚本我目前打印出一个单一的视图到output.svg文件使用： svgcreator.node.js ： var jsdom = require('jsdom'); jsdom.env( "<html><body></body></html>", // CREATE DOM HOOK: [ 'http://d3js.org/d3.v3.min.js', // JS DEPENDENCIES online … 'js/d3.v3.min.js' ], // … & offline // D3JS MAP DRAWING CODE * * * * * * * * * * * * * * * * * * * function (err, window) { […]

D3animation（转换）不适用于Angular应用程序: 我在一个指令中破解了一个包含简单饼图的指令。这是jsfiddle中的确切示例。但是，一旦我试图将其移动到我的networking应用程序，我得到的graphics是build立在以前的会议（覆盖），但没有animation。我没有控制台错误。当我做数据的日志，数据传递正确。以下是我目前使用的软件：AngularJS v1.2.1，D3版本：“3.4.13”，由Express和NodeJS托pipe。任何build议可能会导致此错误。我不想在每次获得新数据时重置SVG，我想要平滑过渡。 var App = angular.module('App', ['ngRoute', 'ngCookies']); App.directive('barsChart', function($parse) { d3.edge = {}; d3.edge.donut = function module() { var width = 460, height = 300, radius = Math.min(width, height) / 2; var color = d3.scale.category20(); ………….//rest is the same as the js fiddle example

排除故障d3.js安装“让我们制作地图”教程: 我正在开始迈克·博斯托克的“让我们制作一个地图”教程，但是我正在碰到基本的安装问题。我在Windows 8.1上运行这个。这是部分： “接下来，您将需要TopoJSON的参考实现，它需要Node.js.（您可以通过Homebrew安装Node，但官方安装程序也可以。）安装Node之后，运行以下命令安装TopoJSON： npm install -g topojson 并validation两个安装，请尝试：哪个ogr2ogr哪topojson“ 我安装了node.js，发现我必须在cmd.exe中运行'npm install -g topojson'命令。而不是node.js，但是我遇到了'which'命令及其后面的错误。当我input which ogr2ogr 在我的cmd.exe中，它说“哪一个不被识别为内部或外部命令”，当我在node.js中input时，它会显示“Syntax error; unexpected identifier” 帮帮我？