Points at equal interval in Svg Path - javascript

i am working on svg based application where user draw a path and i convert that path to points by using following function
path2Array: function(path, incrementer) {
var pointsArray = new Array();
var add = 1;
var point, tx, ty, cordinatesXY;
if (incrementer)
add = incrementer;
var length = Math.ceil(path.getTotalLength());
for (var i = 0; i <= length; i += add) {
point = path.getPointAtLength(i);
tx = Paper.roundDecimalNumber(point.x);// custom rounding function
ty = Paper.roundDecimalNumber(point.y);
cordinatesXY = {
x: tx,
y: ty
}
pointsArray.push(cordinatesXY);
}
return pointsArray;
}
Now , i want to get points in equal interval.
For example, let say in an svg path, my function returns an array which have
Total_nodes=200;
now i want 5 nodes at equal distance, so i divide 200/5=40;
for(var i=0;i<points.length;i+=40)
{
var point=points[i];
// do something
}
and i loop the points array with '40' increment to get 5 points at equal interval.
What didn't work, is when nodes are 212. now if i divide 212/5=42.4 (not an integer index). So now how i can get points at equal interval if i get index in decimal point.

Related

Optimize order of objects within layer in Illustrator for reduced laser cutting time

I'm trying to optimize the layer order of paths in Illustrator so that when sent to a laser cutter, the end of one path is close to the start of the next path reducing the travel time of the laser between each cut.
I've come up with the following code, which works, but could be further optimized considering length of lines, or through an annealing process. I'm posting it here in case anyone else is Googling 'Laser cutting optimization' and doesn't want to write their own code. Also if anyone can suggest improvements to the below code, I'd love to hear them.
// For this script to work, all paths to be optimised need to be on layer 0.
// Create a new empty layer in position 1 in the layer heirarchy.
// Run the script, all paths will move from layer 0 to layer 1 in an optimized order.
// Further optimisation possible with 'Annealing', but this will be a good first run optimization.
// Load into Visual Studio Code, follow steps on this website
// https://medium.com/#jtnimoy/illustrator-scripting-in-visual-studio-code-cdcf4b97365d
// to get setup, then run code when linked to Illustrator.
function test() {
if (!app.documents.length) {
alert("You must have a document open.");
return;
}
var docRef = app.activeDocument;
function endToStartDistance(endPath, startPath) {
var endPoint = endPath.pathPoints[endPath.pathPoints.length - 1].anchor;
var startPoint = startPath.pathPoints[0].anchor;
var dx = (endPoint[0] - startPoint[0]);
var dy = (endPoint[1] - startPoint[1]);
var dist = Math.pow((Math.pow(dx, 2) + Math.pow(dy, 2)), 0.5);
return dist;
}
function Optimize(items) {
var lastPath, closest, minDist, delIndex, curItem, tempItems = [];
var topLayer = app.activeDocument.layers[0];
var newLayer = app.activeDocument.layers[1];
for (var x = 1, len = items.length; x < len; x++) {
tempItems.push(items[x]);
}
lastPath = items[0];
lastPath.move(newLayer, ElementPlacement.PLACEATBEGINNING);
while (tempItems.length) {
closest = tempItems[0];
minDist = endToStartDistance(lastPath, closest);
delIndex = 0;
for (var y = 1, len = tempItems.length; y < len; y++) {
curItem = tempItems[y];
if (endToStartDistance(lastPath, curItem) < minDist) {
closest = curItem;
minDist = endToStartDistance(lastPath, closest);
delIndex = y;
}
}
$.writeln(minDist);
//closest.zOrder(ZOrderMethod.BRINGTOFRONT);
closest.move(newLayer, ElementPlacement.PLACEATBEGINNING);
lastPath = closest;
tempItems.splice(delIndex, 1);
}
}
var allPaths = [];
for (var i = 0; i < documents[0].pathItems.length; i++) {
allPaths.push(documents[0].pathItems[i]);
//$.writeln(documents[0].pathItems[i].pathPoints[0].anchor[0])
}
Optimize(allPaths);
}
test();
Version 2 of the above code, some changes include the ability to reverse paths if this results in a reduced distance for the cutting head to move between paths, and added comments to make the code easier to read.
// Create a new empty layer in position 1 in the layer heirarchy.
// Run the script, all paths will move from their current layer to layer 1 in an optimized order.
// Further optimisation possible with 'Annealing', but this will be a good first run optimization.
// Load into Visual Studio Code, follow steps on this website
// https://medium.com/#jtnimoy/illustrator-scripting-in-visual-studio-code-cdcf4b97365d
// to get setup, then run code when linked to Illustrator.aa
function main() {
if (!app.documents.length) {
alert("You must have a document open.");
return;
}
var docRef = app.activeDocument;
// The below function gets the distance between the end of the endPath vector object
// and the start of the startPath vector object.
function endToStartDistance(endPath, startPath) {
var endPoint = endPath.pathPoints[endPath.pathPoints.length - 1].anchor;
var startPoint = startPath.pathPoints[0].anchor;
var dx = (endPoint[0] - startPoint[0]);
var dy = (endPoint[1] - startPoint[1]);
var dist = Math.pow((Math.pow(dx, 2) + Math.pow(dy, 2)), 0.5);
return dist;
}
// The below function gets the distance between the end of the endPath vector object
// and the end of the startPath vector object.
function endToEndDistance(endPath, startPath) {
var endPoint = endPath.pathPoints[endPath.pathPoints.length - 1].anchor;
var startPoint = startPath.pathPoints[startPath.pathPoints.length - 1].anchor;
var dx = (endPoint[0] - startPoint[0]);
var dy = (endPoint[1] - startPoint[1]);
var dist = Math.pow((Math.pow(dx, 2) + Math.pow(dy, 2)), 0.5);
return dist;
}
// The below function iterates over the supplied list of tempItems (path objects) and checks the distance between
// the end of path objects and the start/end of all other path objects, ordering the objects in the layer heirarchy
// so that there is the shortest distance between the end of one path and the start of the next.
// The function can reverse the direciton of a path if this results in a smaller distance to the next object.
function Optimize(tempItems) {
var lastPath, closest, minDist, delIndex, curItem;
var newLayer = app.activeDocument.layers[1]; // There needs to be an empty layer in position 2 in the layer heirarchy
// This is where the path objects are moved as they are sorted.
lastPath = tempItems[0]; // Arbitrarily take the first item in the list of supplied items
tempItems.splice(0, 1); // Remove the first item from the list of items to be iterated over
lastPath.move(newLayer, ElementPlacement.PLACEATBEGINNING); // Move the first item to the first position in the new layer
while (tempItems.length) { // Loop over all supplied items while the length of this array is not 0.
// Items are removed from the list once sorted.
closest = tempItems[0]; // Start by checking the distance to the first item in the list
minDist = Math.min(endToStartDistance(lastPath, closest), endToEndDistance(lastPath, closest));
// Find the smallest of the distances between the end of the previous path item
// and the start / end of this next item.
delIndex = 0; // The delIndex is the index to be removed from the tempItems list after iterating through
// the entire list.
for (var y = 1, len = tempItems.length; y < len; y++) {
// Iterate over all items in the list, starting at item 1 (item 0 already being used above)
curItem = tempItems[y];
if (endToStartDistance(lastPath, curItem) < minDist || endToEndDistance(lastPath, curItem) < minDist) {
// If either the end / start distance to the current item is smaller than the previously
// measured minDistance, then the current path item becomes the new smallest entry
closest = curItem;
minDist = Math.min(endToStartDistance(lastPath, closest), endToEndDistance(lastPath, closest));
// The new minDistace is set
delIndex = y; // And the item is marked for removal from the list at the end of the loop.
}
}
if (endToEndDistance(lastPath, closest) < endToStartDistance(lastPath, closest)) {
reversePaths(closest); // If the smallest distance is yielded from the end of the previous path
// To the end of the next path, reverse the next path so that the
// end-to-start distance between paths is minimised.
}
closest.move(newLayer, ElementPlacement.PLACEATBEGINNING); // Move the closest path item to the beginning of the new layer
lastPath = closest; // The moved path item becomes the next item in the chain, and is stored as the previous item
// (lastPath) for when the loop iterates again.
tempItems.splice(delIndex, 1); // Remove the item identified as closest in the previous loop from the list of
// items to iterate over. When there are no items left in the list
// The loop ends.
}
}
function reversePaths(theItems) { // This code taken / adapted from https://gist.github.com/Grsmto/bfe1541957a0bb17972d
if (theItems.typename == "PathItem" && !theItems.locked && !theItems.parent.locked && !theItems.layer.locked) {
pathLen = theItems.pathPoints.length;
for (k = 0; k < pathLen / 2; k++) {
h = pathLen - k - 1;
HintenAnchor = theItems.pathPoints[h].anchor;
HintenLeft = theItems.pathPoints[h].leftDirection;
HintenType = theItems.pathPoints[h].pointType;
HintenRight = theItems.pathPoints[h].rightDirection;
theItems.pathPoints[h].anchor = theItems.pathPoints[k].anchor;
theItems.pathPoints[h].leftDirection = theItems.pathPoints[k].rightDirection;
theItems.pathPoints[h].pointType = theItems.pathPoints[k].pointType;
theItems.pathPoints[h].rightDirection = theItems.pathPoints[k].leftDirection;
theItems.pathPoints[k].anchor = HintenAnchor;
theItems.pathPoints[k].leftDirection = HintenRight;
theItems.pathPoints[k].pointType = HintenType;
theItems.pathPoints[k].rightDirection = HintenLeft;
}
}
}
var allPaths = []; // Grab every line in the document
for (var i = 0; i < documents[0].pathItems.length; i++) {
allPaths.push(documents[0].pathItems[i]);
// This could be better changed to the selected objects, or to filter only objects below a certain
// stroke weight so that raster paths are not affected, but cut paths are.
}
Optimize(allPaths); // Feed all paths in the document into the optimize function.
}
main(); // Call the main function, executing the above code.

Weighted Interpolation using means of circular quantities

I am woking on a project of weighted interpolation. Each station has a coordinate point on the map as shown below.
var stationCoor = [[408,352],[525,348],[535,495],[420,400],[272,145],[175,195],[197,335]];
I am taking points that are located in the lake and I am using those to create weighted averages for inputs from those stations. Here is my function for determining the weighted numbers.
function findWeightSpeed(xPos, yPos){
var totalHypt = 0;
var arrHpyt = [];
var arrWeight = [];
for(var l=0;l<7;l++){
var xDis = Math.abs(xPos-stationCoor[l][0]);
var yDis = Math.abs(yPos-stationCoor[l][1]);
var hptSq = Math.pow(xDis,2)+Math.pow(yDis,2);
var hypt = Math.sqrt(hptSq);
totalHypt = totalHypt+hypt;
arrHpyt.push(hypt);
}
for(var j=0;j<7;j++){
arrWeight.push(arrHpyt[j]/totalHypt)
}
return arrWeight;
}
This finds the hypotenuse between the point (xPos,yPos) and the stations. It then adds the data up and divides each station by the total yielding the weighted numbers.
I need to use these points to weight wind direction from these stations. I was using the funciotn below to calculate an average of points.
function averageAngles(){
var x = 0;
var y = 0;
var pi = 22/7;
var angle = [2.7925,2.8797,2.9670,3.0543, 0.0872]; // 310,320,330,340,10
for(var i = 0; i < angle.length; i++) {
x += Math.cos(angle[i]);
y += Math.sin(angle[i]);
}
var average_angle = Math.atan2(y, x);
console.log((average_angle/pi)*360);
}
This gave me accurate information for a weighted average of .20 for all points. However, the weighted average points for the 7 stations (as seen below on the map) is similar to [0.1076839005418769, 0.08051796093187284, 0.003987308213631277, 0.08458358029618485, 0.2463427297217639, 0.26463834002675196, 0.21224618026791833].
How would I go about making a function that takes the weighted average numbers from the findWeightSpeed() and using that to weight the circular quantities in averageAngles()?
I used this How do you calculate the average of a set of circular data? to make the function for averaging angles.
Many thanks for any suggestions given.
Here is a link I found online that explains the entire procedure.
Computing Weighted Averages for Wind Speed and Direction
The code is similar to this.
function weightAllData(xPos,yPos,windData){
var uVecSum = 0;
var vVecSum = 0;
var arrayWeightSpeed = findWeightSpeed(xPos, yPos); //using weighted interpolation based on distance
var arrayWindSpeed = [WSData];
var arrayWindDirection = [WDData];
for(var m=0;m<7;m++){
uVecSum = uVecSum + (arrayWeightSpeed[m] * getUVector(arrayWindSpeed[m],(arrayWindDirection[m]/180)*Math.PI));
vVecSum = vVecSum + (arrayWeightSpeed[m] * getVVector(arrayWindSpeed[m],(arrayWindDirection[m]/180)*Math.PI));
}
var weightWS = Math.sqrt(Math.pow(uVecSum,2)+Math.pow(vVecSum,2));
if(vVecSum!=0){
weightWDRad = Math.atan(uVecSum/vVecSum);
}
if(vVecSum==0){
weightWDRad = Math.atan(uVecSum/(0.0001+vVecSum));
}
if(weightWDRad<0){
weightWDRad = weightWDRad + Math.PI
}
weightWD = (weightWDRad * (180/Math.PI));
}
Let me know if you want an explanation

JavaScript: Subtracting ranges of numbers

I'm trying to write a JS function which has two parameters, include and exclude, each an array of objects {X, Y} which represents a range of numbers from X to Y, both included.
The output is the subtraction of all the ranges in include with all the ranges in exclude.
For example:
include = [ {1,7}, {9,10}, {12,14} ]
exclude = [ {4,5}, {11,20} ]
output = [ {1,3}, {6,7}, {9,10} ]
{4,5} broke {1,7} into two range objects: {1,3} and {6,7}
{9,10} was not affected
{12,14} was removed entirely
You can use sweep line algorithm. For every number save what it represents (start and end, inclusion and exclusion ). Then put all the number in an array and sort it. Then iteratively remove elements from the array and perform the appropriate operation.
include_list = [[1,7]]
exclude_list = [[4,5]]
(1,start,inclusion),(4,start,exclusion),(5,end,exclusion),(7,end,inclusion)
include = 0
exclude = 0
cur_element = (1,start,inclusion) -> include = 1, has_open_range = 1, range_start = 1 // we start a new range starting at 1
cur_element = (4,start,exclusion) -> exclude = 1, has_open_range = 0, result.append ( [1,4] ) // we close the open range and add range to result
cur_element = (5,end,exclusion) -> exclude = 0, has_open_range = 1, range_start = 5 // because include was 1 and exclude become 0 we must create a new range starting at 5
cur_element = (7,end,inclusion) -> include = 0, has_open_range = 0, result.append([5,7]) // include became zero so we must close the current open range so we add [5,7] to result
maintain variables include and exclude increment them with start of the respective elements and decrement them upon receiving end elements. According to the value of include and exclude you can determine wether you should start a new range, close the open range, or do nothing at all.
This algorithm runs in linear time O(n).
The rule for integer set arithmetic for subtraction of two sets X,Y is
X − Y := {x − y | x ∈ X, y ∈ Y }
but that's not what you want, as it seems.
You can assume ordered sets in your example which allows you to set every occurrence of x==y as an arbitrary value in a JavaScript array and use that to split there. But you don't need that.
The set difference {1...7}\{4...5} gets expanded to {1,2,3,4,5,6,7}\{4,5}. As you can easily see, a subtraction with the rule of set arithmetic would leave {1,2,3,0,0,6,7} and with normal set subtraction (symbol \) you get {1,2,3,6,7}.
The set difference {12...14}\{11...20} gets expanded to {12,13,14}\{11,12,13,14,15,16,17,18,19,20}; the set arithm. difference is {-11,0,0,0,-15,-16,...,-20} but the normal set-subtraction leaves the empty set {}.
Handling operations with the empty set is equivalent to normal arithmetic {x}-{}={x} and {}-{x} = {-x} for arithmetic set rules and {x}\{}={x},{}\{x}= {} with normal rules
So what you have to use here, according to your example, are the normal set rules. There is no need to expand the sets, they can be assumed to be dense.
You can use relative differences(you may call them distances).
With {1...7}\{4...5} the first start is small then the second start and the first end is greater the the second end, which resulted in two different sets.
With {12...14}\{11...20} the first start is greater than the second start and the first end is lower then the second end which resulted in an empty set.
The third example makes use of the empty-set rule.
Do you need an example snippet?
Here's an answer that works with fractions and that isnt just brute forcing. I've added comments to explain how it works. It may seem big the the premise is simple:
create a method p1_excluding_p2 that accepts points p1 and p2 and returns of an array of points that exist after doing p1 - p2
create a method points_excluding_p2 which performs the EXACT same operation as above, but this time allow us to pass an array of points, and return an array of points that exist after subtracting p2 from all the points in our array, so now we have (points) - p2
create a method p1_excluding_all which takes the opposite input as above. This time, accept one point p1 and many exclusion points, and return the array of points remaining after subtracting all the exclusion points. This is actually very easy to create now. We simply start off with [p1] and the first exclusion point (exclusion1) and feed this into points_excluding_p2. We take the array that comes back (which will be p1 - exclusion1) and feed this into points_excluding_p2 only this time with exclusion2. We continue this process until we've excluded every exclusion point, and we're left with an array of p1 - (all exclusion points)
now that we have the power to perform p1 - (all exclusion points), its just a matter of looping over all our points and calling p1_excluding_all, and we're left with an array of every point subtract every exclusion point. We run our results through remove_duplicates incase we have any duplicate entries, and that's about it.
The code:
var include = [ [1,7], [9,10], [12,14] ]
var exclude = [ [4,5], [11,20] ]
/* This method is just a small helper method that takes an array
* and returns a new array with duplicates removed
*/
function remove_duplicates(arr) {
var lookup = {};
var results = [];
for(var i = 0; i < arr.length; i++) {
var el = arr[i];
var key = el.toString();
if(lookup[key]) continue;
lookup[key] = 1;
results.push(el);
}
return results;
}
/* This method takes 2 points p1 and p2 and returns an array of
* points with the range of p2 removed, i.e. p1 = [1,7]
* p2 = [4,5] returned = [[1,3],[6,7]]
*/
function p1_excluding_p2(p1, p2) {
if(p1[1] < p2[0]) return [p1]; // line p1 finishes before the exclusion line p2
if(p1[0] > p2[1]) return [p1]; // line p1 starts after exclusion line p1
var lines = [];
// calculate p1 before p2 starts
var line1 = [ p1[0], Math.min(p1[1], p2[0]-1) ];
if(line1[0] < line1[1]) lines.push(line1);
// calculate p1 after p2 ends
var line2 = [ p2[1]+1, p1[1] ];
if(line2[0] < line2[1]) lines.push(line2);
// these contain the lines we calculated above
return lines;
}
/* this performs the exact same operation as above, only it allows you to pass
* multiple points (but still just 1 exclusion point) and returns results
* in an identical format as above, i.e. points = [[1,7],[0,1]]
* p2 = [4,5] returned = [[0,1],[1,3],[6,7]]
*/
function points_excluding_p2(points, p2) {
var results = [];
for(var i = 0; i < points.length; i++) {
var lines = p1_excluding_p2(points[i], p2);
results.push.apply(results, lines); // append the array lines to the array results
}
return results;
}
/* this method performs the same operation only this time it takes one point
* and multiple exclusion points and returns an array of the results.
* this is the important method of: given 1 point and many
* exclusion points, return the remaining new ranges
*/
function p1_excluding_all(p1, excluded_pts) {
var checking = [p1];
var points_leftover = [];
for(var i = 0; i < exclude.length; i++) {
checking = points_excluding_p2(checking, exclude[i]);
}
return remove_duplicates(checking);
}
/* now that we have a method that we can feed a point and an array of exclusion
* points, its just a simple matter of throwing all our points into this
* method, then at the end remove duplicate results for good measure
*/
var results = [];
for(var i = 0; i < include.length; i++) {
var lines = p1_excluding_all(include[i], exclude);
results.push.apply(results, lines); // append the array lines to the array results
}
results = remove_duplicates(results);
console.log(results);
which returns:
[[1,3],[6,7],[9,10]]
NOTE: include = [ {1,7}, {9,10}, {12,14} ] is not valid javascript, so I assumed you as passing in arrays of arrays instead such as:
include = [ [1,7], [9,10], [12,14] ]
Brute force method (a solution, may not be the most eloquent):
function solve_range(include, exclude) {
numbers = [];
include.forEach(function (range) {
for (i = range[0]; i <= range[1]; i++) {
numbers[i] = true;
}
});
exclude.forEach(function (range) {
for (i = range[0]; i <= range[1]; i++) {
numbers[i] = false;
}
});
contiguous_start = null;
results = [];
for (i = 0; i < numbers.length; i++) {
if (numbers[i] === true) {
if (contiguous_start == null) {
contiguous_start = i;
}
} else {
if (contiguous_start !== null) {
results[results.length] = [contiguous_start, i - 1];
}
contiguous_start = null;
}
}
return results;
}
var include = [
[1, 7],
[9, 10],
[12, 14]
];
var exclude = [
[4, 5],
[11, 20]
];
var output = solve_range(include, exclude);
https://jsfiddle.net/dwyk631d/2/
Here's a working solution that handles the 4 possible overlap scenarios for an exclusion range.
var include = [{from:1, to: 7},{from: 9, to: 10},{from: 12, to: 14}];
var exclude = [{from:4, to: 5}, {from: 11, to: 20}];
//result: {1,3}, {6,7}, {9,10}
var resultList = [];
for (var i=0;i<include.length;i++){
var inc = include[i];
var overlap = false;
for (var x=0;x<exclude.length;x++ ){
var exc = exclude[x];
//4 scenarios to handle
if (exc.from >= inc.from && exc.to <= inc.to){
//include swallows exclude - break in two
resultList.push({from: inc.from, to: exc.from - 1});
resultList.push({from: exc.to + 1, to: inc.to});
overlap = true;
}else if (exc.from <= inc.from && exc.to >= inc.to){
//exclude swallows include - exclude entire range
overlap = true;
break;
}else if (exc.from <= inc.from && exc.to <= inc.to && exc.to >= inc.from){
//exclusion overlaps on left
resultList.push({from: exc.to, to: inc.to});
overlap = true;
}else if (exc.from >= inc.from && exc.to >= inc.to && exc.from <= inc.to){
//exclusion overlaps on right
resultList.push({from: inc.from, to: exc.from - 1});
overlap = true;
}
}
if (!overlap){
//no exclusion ranges touch the inclusion range
resultList.push(inc);
}
}
console.log(resultList);
Perhaps we can make it slightly more efficient by merging labeled intervals into one sorted list:
include = [ {1,7}, {9,10}, {12,14} ]
exclude = [ {4,5}, {11,20} ]
merged = [ [1,7,0], [4,5,1], [9,10,0], [11,20,1], [12,14,0] ];
Then, traverse the list and for any excluded interval, update any surrounding affected intervals.
try this
function excludeRange(data, exclude) {
data = [...data] // i don't want inplace edit
exclude.forEach(e=>{
data.forEach((d,di)=>{
// check intersect
if (d[0] <= e[1] && e[0] <= d[1]) {
// split into two range: [Ax, Bx-1] and [By+1, Ay]
var ranges = [
[d[0], e[0]-1],
[e[1]+1, d[1]],
]
// keep only valid range where x <= y
ranges = ranges.filter(e=>e[0]<=e[1])
// replace existing range with new ranges
data.splice(di, 1, ...ranges)
}
})
})
return data
}
I try to implement this short and simple as possible
edit: add explain and update more readable code
the algorithm with A-B
if intersect -> we split into two range: [Ax, Bx-1] and [By+1, Ay]
then we filter out invalid range (where x > y)
else: keep A

SVG Animation: Create array of all polygons, apply IDs, and animate them individually

I'm trying to create a pattern generator, and am playing around with a quilt-like SVG file, with about 400 little polygons in it. I want to fill an array with all those polygons, iterate through giving them each a unique numbered id, and the animate them. I'm aware this might be too big a file and that the animation may be slow...I just want to try!
Here's the codepen: http://codepen.io/ferret/pen/emeXpg
JS below, in which the only real DOM reference is to "polygon" and the SVG id of quilt:
$(document).ready(function(){
var rC = randomColor({count:140}); //init random color generator
var quilt = Snap.select('#quilt'); //tell snap to look at the SVG called quilt.
var allPolys = new Array(); //set up empty array
var foundPolys = document.getElementsByTagName("polygon"); //get all the polygons in the DOM
allPolys.push(foundPolys); //push them into the empty array
console.log(allPolys); //make sure it went in (HTMLCollection w/ #)
var numPolys = allPolys.length; //get the array length
//allPolys is now an array of all the polygons woop woop!
function snow() {
for (i = 0; i <= numPolys; i++) { //iterate thru dem polys
return allPolys[i].id = 'tri-' + i; //give them unique ideas (tri-1, tri-2 etc)
var flakeId = flakes[i].id; //set their id as a variable
console.log(flakeId);
var flake = flakes.select(flakeId); // Select each individual flake from our list
var cx = flake.getBBox().cx; // Get its initial coordinates
var cy = flake.getBBox().cy;
animateFlake(flake, cx, cy); // Send it to be infinitely animated
} //eachPoly
}//snow
function animateFlake(flake, cx, cy){
var $scroller = ($(window).scrollTop()/2).toFixed(1),
timing = $scroller * 140;// Random transition time between times we specify
var flakeint = flake.attr({ transform:'0 0'}); // Reset the flake's position to behind the cloud
var deg = getRandomArbitrary(-360,360); // Random rotation (allows it to go either direction)
// Animate the flake and do a new animation for it when it's done (repeat this function)
flake.stop().animate({transform: 't0 200 r'+deg+' '+cx+' '+cy}, timing, function(){ animateFlake(flake, cx, cy);});
if ($scroller <=0) {
flake.stop();
}
}
$(window).scroll(function(){
var $percentageComplete = (($(window).scrollTop()/($("html").height()- $(window).height()))*100),
$scroller = $(window).scrollTop()*0.7,
$scrollsex = $scroller / 100,
$tileTop = $(".tiles").offset().top + 50,
$wH = $(window).height(),
if ($scroller <= $tileTop) { //if the amount you've scrolled is less than ~ the div height then keep animating this left.
$(".tileGo").css("-webkit-transform","rotate(" + $scroller + "deg)").animate({"left":$scroller}, $scrollsex);
snow();
}
// Lets us get random numbers from within a range we specify. From MDN docs.
function getRandomArbitrary(min, max) {
return Math.random() * (max - min) + min;
}
});

Javascript, finding first significant figure (values ranging from 87.352 to 0.0002432)

I have created a GPS system using coordinates.
I have found the highest and lowest longitude and latitude coordinates using this function:
var maxLng = 0;
var maxLat = 0;
var minLng = 180;
var minLat = 180;
for(var i=0; i<coordinates.length; i++)
{
//get max coordinates (the +90 is to remove negative numbers)
if (coordinates[i][0]+90 > maxLat)
{
maxLat = coordinates[i][0] + 90;
}
if (coordinates[i][1]+90 > maxLng)
{
maxLng = coordinates[i][1]+ 90;
}
//get min coordinates
if (coordinates[i][0]+90 < minLat)
{
minLat = coordinates[i][0] + 90;
}
if (coordinates[i][1]+90 < minLng)
{
minLng = coordinates[i][1] + 90;
}
}
console.log(maxLat, maxLng,minLat, minLng);
//calculate distance between max and min points
var lngDistance = maxLng - minLng;
var latDistance = maxLat - minLat;
console.log(lngDistance, latDistance);
This outputs the distance between the 2 furthest apart longitude and latitude points, which I then plan to use to create a basic 2d map looking like this:
I need to convert the points, they can be a range of value such as:
0.0009321
19.332
1.9432123
0.0013432423
0.23432423
0.000034324
I want to basically convert all the numbers to 2 significant figures in front of the decimal point and store the result in the array stating how many shifts I have used.
I would want the output to be something like this (original number, converted number, shifts used):
[0.0009321, 93.21, 4]
[19.332, 19.332, 0]
[1.9432123, 19.432123, 1]
[0.0013432423, 13.432423, 3]
...
I am thinking find the first significant figure then count how far away from the decimal point this is. I found a few posts about using REGEX to do this, but I have never used REGEX before.
Can anybody give me some pointers?
Cheers.
That was a fun one figuring out.
Made a basic function for you, and as far as I can see it works.
function change(data){
var ret=new Array();
for(var i=0,len=data.length;i<len;i++){
// make string from number, remove the dot
var st=(''+data[i]).replace('.','');
//remove leading zero's from string
var no_zero=st.replace(/^0+/,'');
//make value
var val=parseInt(no_zero)/(Math.pow(10,no_zero.length-2));
//calculate amount of steps
var steps=Math.round(Math.log(Math.round(val/data[i]))/Math.log(10));
//correction for floating point
if(data[i]<0.01)steps--;
ret.push([data[i],val,steps]);
}
return ret;
}
And a working Fiddle

Categories

Resources