Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I would like a stream graph as in this example:
http://mbostock.github.com/d3/ex/stream.html
but I would like real time data entering from the right and have old data leave from the left, such that I always have a window of 200 samples. How would I do this such that I have the appropriate transitions?
I tried changing the data points in the array a and then recreating an area as such
data0 = d3.layout.stack()(a);
but my transitions do not make it look like the chart is sliding across the screen.
Thanks in advance.
Try this tutorial:
When implementing realtime displays of time-series data, we often use the x-axis to encode time as position: as time progresses, new data comes in from the right, and old data slides out to the left. If you use D3’s built-in path interpolators, however, you may see some surprising behavior...
To eliminate the wiggle, interpolate the transform rather than the path. This makes sense if you think of the chart as visualizing a function—its value isn’t changing, we’re just showing a different part of the domain. By sliding the visible window at the same rate that new data arrives, we can seamlessly display realtime data...
Here is a simple example:
http://jsfiddle.net/cqDA9/1/
It shows a possible solution to keeping track and updating the different data series.
var update = function () {
for (Name in chart.chartSeries) {
chart.chartSeries[Name] = Math.random() * 10;
}
for (Name in chart2.chartSeries) {
chart2.chartSeries[Name] = Math.random() * 10;
}
setTimeout(update, 1000);
}
setTimeout(update, 1000);
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
So my ultimate goal here is to have the site have a new title each day (24 hours).
I am not a very experienced program, but, I am aware something similar could be done with JS.
I saw this idea:
setInterval(function() {
//change title
//document.title = "Some new title";
}, 3000);
I'm not sure how I can take this idea above, which I do not fully understand and make it use, for example, a large array or predefined titles and select one at random each day.
Would it be possible to select the title out of another file or should I have them all in the JS file? On the question just asked, should I have the JS code in the HTML file itself or referenced as a file like a CSS file?
I really appreciate any walkthrough/help I can get on this. I hope your days are well all.
found the solved problem with running code once per day:
Run code once a day
When you will have a function that runs once per day, you just have to reference the title from DOM inside the function and define new title.
var titles = ["title1", "title2", "title3"];
var iterator = 0; // this variable should be incremented every day
// somewhere inside the function that runs once per day
document.title = titles[iterator];
There are 2 ways to import a script on html page.
Inline: https://www.w3schools.com/tags/tag_script.asp
External: https://www.w3schools.com/tags/tag_link.asp
U can even read external file (.txt e.g.) in js, you can look that up, but it's bit more complicated than this.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
Is there is any way or module to move cursor and simulate mouse clicks in windows7/8 with node.js?
I found this library https://www.npmjs.org/package/win_mouse but seems like it doesn't work
I've been working on a module for this, RobotJS.
Example code:
var robot = require("robotjs");
//Get the mouse position, retuns an object with x and y.
var mouse=robot.getMousePos();
console.log("Mouse is at x:" + mouse.x + " y:" + mouse.y);
//Move the mouse down by 100 pixels.
robot.moveMouse(mouse.x,mouse.y+100);
//Left click!
robot.mouseClick();
It's still a work in progress but it will do what you want!
I've previously tried the win_mouse package, but it didn't work for me either, think it requires an older version of node.js.
One solution would be to use the ffi package, which allows you to dynamically load and call native libraries. To move the mouse on windows, you'd need to call the SetCursorPos function from the user32.dll like this:
var ffi = require("ffi");
var user32 = ffi.Library('user32', {
'SetCursorPos': [ 'long', ['long', 'long'] ]
// put other functions that you want to use from the library here, e.g., "GetCursorPos"
});
var result = user32.SetCursorPos(10, 10);
console.log(result);
Another solution would be to write a native node add-on that wraps around the SetCursorPos function, but it is more complex.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I've made this small tool but I'm not sure how to achieve what I need.
I would like it to subtract from the "Points Left" when adding to the others.
(Not going below zero into the negative, only 30 points).
I would also like to prevent going BELOW the initial numbers in "Weapon Power" and "Magic Power".
(I would like to be able to only spend a maximum of 25 points into one "power")
I think it kind of explains itself so maybe I'm just confusing you more.
Any ideas?
DEMO
You need to give your number input elements distinct ids, because when you do document.getElementById, it will only return you the first element with the given ids.
Then, you need to give another distinct ID to the "points left" field for each character, and update that one. To do that, you'll need to pass to add and substract the correct value ( add(warrior, 'weapon'), add(wizard, 'magic')).
You need to be able to get your IDs from your warrior or wizard object, so you could try doing this:
var wizard = {
weapon:"idOfWeaponField", magic:"idOfMagicField", points:"idOfPointsField"
};
where the string values are the ids of your elements.
Then, within your add function, you can access your id like this
function add(character, statName){
var myID = character[statName];
}
and update the correct input value.
EDIT: code here.
I would also like to prevent going BELOW the initial numbers in "Weapon Power" and "Magic Power". >(I would like to be able to only spend a maximum of 25 points into one "power")
Basically, you've seen what I did with the points left, when I said if(pointsVal.value == 0) return; ? You should be able to implement any constraint you like using that.
I modified mine to give an example where the limits are at their initial values.
If you only want to spend a given number of points on one of the powers, you'll have to substract the limit from the current number and return from add() without changing the value if the number exceeds the threshold. That should be pretty easy with what you have now, since you don't have to change the character object to do it.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions must demonstrate a minimal understanding of the problem being solved. Tell us what you've tried to do, why it didn't work, and how it should work. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
The code below belongs to a crossrider extension I am currently attempting to develop that hopefully will sync bookmarks across browsers. This file is currently the background.js file it will first retrieve a snapshot of the bookmarks file from the local database then compare that to the current list of bookmarks and if there are any differences (either additions to the bookmarks list or subtractions) they will be be returned with the getChanges() function and then sent to the server, finally the script updates the snapshot and waits 30 seconds before restarting the process. I dont really know how to make the getChanges() function. It needs to return presumably a json object indicating both the additions and subtractions (both their titles and urls). If someone could write the code for the function that would be great. Thanks
appAPI.ready(function() {
// Poll every 30 seconds
setInterval(function() {
appAPI.db.async.get('prevBookmarks', function(value) {
// Load or initialize previous bookmarks list
var prevBookmarks = (value) ? value : {};
// Get current bookmarks
appAPI.bookmarks.getTree(function(nodes) {
// Save bookmark list for next comparison
appAPI.db.async.set('prevBookmarks', nodes);
// In your getChanges functions, traverse the bookmark trees collating
// changes and then post then to your API server using appAPI.request
var changes = getChanges(prevBookmarks, nodes);
appAPI.request.post({
url: http://yourAPIserver.com,
postData: changes,
contentType: 'application/json'
});
});
});
}, 30 * 1000);
});
Ok, you've got jQuery as one of your tags, so try this link: Compare 2 arrays which returns difference.
It returns the differences between two arrays. You'll have to perform this twice for what you're doing, once to figure out what is in current that is not in previous and vice versa. I don't know what properties are contained in your bookmarks so this simple example might not exactly suit your needs, but it might point you in the right direction.
Good luck and welcome to JavaScript!
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I have lot enough functions, which look like:
var functionName = function(e) {
//
};
where all the parameters are getting passed in in a single container e. Most times values are simple values (no functions), ex.:
{ parameter1: 1, parameter2: "Name", parameter3:{ subParameter1: "A"}}
But there're times when I pass in functions as in: { p2:function(){...} }
I have two options when it comes to utilising parameter values:
Options 1: get parameter values from the chain, starting from e: e.parameter1, e.parameter3.subParameter1 etc.
Option 2: use cached parameter values:
var parameter1 = e.parameter1;
var subParameter1 = e.parameter3.subParameter1;
The second option improves readability but increases the number of vars and the size of the code base. On another hand it's much drier when using long chains, i.e. e.p1.p2.p3 etc.
What reasoning should I use for choosing between those two options?
**Update 1 - the question sounds quite subjective, let me re-prase it.**
I don't mind using chains all the way, no local vars codebase is smaller, I can always figure out what's what, are the any cases when caching is a must?
A combination, based on depth(e.p1 vs e.p1.sp2.ssp3) and frequency of use. Deeper sub-properties and high usage of any sub-property both benefit from caching.
Nested property look ups can get costly, and caching the value after executing the look up once is valuable if you're going to use it a lot. This is only more efficient if you're accessing a particular property on the chain more than once, and the more you access it, the more you benefit from caching.
If you only have one level deep(e.p1, e.p2, e.p3) and you're only looking up each property value once, don't bother.
If you're accessing e.p1.sp2.ssp3 all throughout your function, cache it for sure.