score:6
Accepted answer
Try this.
var width = 400,
height = 200;
var x = d3.scale.linear().range([0, width]),
y = d3.scale.linear().range([height, 0]);
var svg = d3.select("body")
.append("svg")
.attr("width", width)
.attr("height", height);
var dataSource = 'data.tsv',
dataSource2 = 'data2.tsv';
function updateChart(sourcefile) {
d3.tsv(sourcefile, function(error, data) {
if (error) console.warn(error);
x.domain(d3.extent(data, function(q) {return q.xCoord;}));
y.domain(d3.extent(data, function(q) {return q.yCoord;}));
svg.selectAll(".dot")
.data(data)
.enter().append("circle")
.attr("r", 10)
.attr("cx", function(d) { return x(d.xCoord); })
.attr("cy", function(d) { return y(d.yCoord); })
});
}
updateChart(dataSource);
//here is where you change the data..
d3.select(#button).on("click", function() {
updateChart(dataSource2)
})
Source: stackoverflow.com
Related Query
- D3: How to dynamically refresh a graph by changing the data file source?
- How to rearrange the DOM order of svg elements based on their data values in a dynamically changing d3 vis?
- How to change the data in a force layout graph dynamically ? D3
- NVD3 - How to refresh the data function to product new data on click
- How to fetch data from json file to draw a dynamic graph by using d3.js
- How to use the quantize function with my json data file
- graph the data from a csv file
- d3 graph duplicates on the DOM when data source changes
- How to apply D3 data interpolate/animate functions to a dynamically changing pie chart
- I am making a d3.js graph as a csv file How should I manipulate the data?
- D3js: How to load a tsv file and select only the data which is available for two different points
- How can we Sum the data of .csv file columnwise using d3.js
- D3 Plus - Dynamically changing the position of data points in Scatter Plot
- How to update data on a page according to data from a CSV file instead of using fixed element data on the page?
- How to scale bars of barchart so it shows the complete graph with data
- How to update the d3js - graph data alone without re-appending `svg` element
- How to get a D3.js pie chart to render data dynamically from the DOM
- how to display the xml tags data using force directed graph in d3.js
- How to load data from a CSV file in D3 v5
- D3: Create a continuous color scale with many strings/inputs for the range and dynamically changing values of the domain
- How to update elements of D3 force layout when the underlying data changes
- Is D3.js the right choice for real-time visualization of Neo4j Graph DB data
- In d3, how to get the interpolated line data from a SVG line?
- how to use svg file for image source in D3
- Can d3.js draw two scatterplots on the same graph using data from the same source?
- Dynamically update D3 Sunburst if the source json is updated (item added or deleted)
- How to load data from an internal JSON array rather than from an external resource / file for a collapsible tree in d3.js?
- How do I associate SVG elements generated by graphviz to elements in the DOT source code
- How do I control the bounce entry of a Force Directed Graph in D3?
- how do i format the value shown in a d3 graph
More Query from same tag
- "Restrict" text scaling on zoom chart
- Continuously updating lines in a d3 chart based on SignalR input
- Data with custom date dimple.js
- d3.js wrong time scale ticks
- convert arrays to json
- Nested JSON not working in d3.js
- legend not showing properly in d3
- D3 mouse release event
- Importing multiple CSV files in Javascript
- d3 selection issue offsetParent is null
- Building JSON dynamically in D3 javascript
- append d3 text to existing html div
- How to make grouped stacked bar chart in d3js?
- D3 update pattern not working as expected
- How to add filters effects to Svg in d3
- Why are my D3 force layout diagram lines extending into circles?
- Bounded force graph with labels d3.js
- D3 bar chart not showing first element in array
- SVG to PNG with Embedded Style Sheet
- Partition layout with different value functions
- D3 Logarithmic Scaling
- D3: Constrained Semantic Zooming on a Tree Layout
- error on data update with a d3pie.js piechart
- Modify Cubism.js Graphite Title Text
- Native d3.js v5 - constructing a radial scale with desired interval
- HowTo select svg-objects inside a drawnrect d3
- Displaying images on hovering over points in d3.js scatter plot
- Can I normalise CSV data with D3?
- C3js Stacked Bar Chart with a hidden bar
- D3.js: How to combine 2 datasets in order to create a map and show values on.mouseover?