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 7 days ago.
Improve this question
I have a UI which plays video and a human creates boxes around hands(labels the video) in the video at different timestamps. Timestamps are chosen by human whenever human thinks position of hand has changed.
Those boxes are generated with the help of HTML5 Canvas.
At the end of video result is generated by getting coordinates of boxes at different timestamps Boxes was created by human on the video.
For example result can be:
{
"0.12": [
"box1": [[0,1], [0,0], [1,0], [1,1]],
.
.
]
"0.22": [
"box1": [[0.1,1.1], [0.1,0.1], [1.1,0.1], [1.1,1]],
.
.
]
}
Now I want to reverse the situation where the result will be given to me before hand and I will have to create the boxes on the video from the given result containing position of boxes on different timestamps. Another human will see the video and can modify the position of boxes shown and at the end another result will be generated similar to the first one.
How can this be achieved using HTML & Javascript and maybe HTML5 Canvas?
Now I have to reverse this situation, I have to create Boxes on top of the running video given different timestamps of box coordinates at those timestamps.
And human should be able to modify the pre-made boxes while watching the video.
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
I want to code a website, showing 7 elements: one image (that will be changing), and 6 buttons (left, right, up, down, backwards, forwards), as shown in this example
The website should be able to "read" a 6 column file, which will have the following format example
with:
"ind_img_x" being the index for image x (numeric index)
"url_img_x" being the string containing the web address for image x
The file will control which image will appear accordingly with the button that is pressed.
For example: if the image displayed is "img_2", and the user press the "down" button, then the website will show the image 77452, and wait for the next button to be pressed.
The file will be rather big, able to contain several million lines (for example 10 million lines).
I should be able to update the file from time to time.
The web site will have to be able to get each image from the web (by means of the url in the file) The url data may consists of strings of large length. And the website has to be able to read these long strings and urls.
Would somebody please give me some advice about the best web developing language to use?
Do you think I'll be able to drop the file into the server as a text file, and ask the web site to read it each time, or will I have to put the data in a database?
I look forward to any advice that you guys may have,
Thank you!
Simplest way would be to use a webhosting service and parse the file with JavaScript. Especially because you said you already have JavaScript knowledge.
I would also suggest you to use CSV files: https://en.wikipedia.org/wiki/Comma-separated_values
Edit: When you have millions of lines you should use a database and use Nodejs libraries to connect to the database. Files are only recommended for small sets of data.
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'm using html2canvas to generate a screenshot of a url. This screenshot is displayed on the page and I want to be able to break it into pieces when it's clicked.
The output file that I get from html2canvas is a canvas element.
How can I "break" it to random pieces? Should I create new canvas element for every piece that I want?
Html2Canvas does not click . It just renders the DOM elements provided to it.So I dont think you can break the rendered canvas into pieces.
How it works
The script traverses through the DOM of the page it is loaded on. It gathers information on all the elements there, which it then uses to
build a representation of the page. In other words, it does not
actually take a screenshot of the page, but builds a representation of
it based on the properties it reads from the DOM.
But one thing you can do is divide your DOM content into parts and the you can use Html2Canvas for every DOM pieces and you get the required result.
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
So I want to make a website where I can generate EVERY SINGLE Minecraft skin (which are 64 px by 64 px) possible (And put it up on a web page), by using many different combinations of many different coloured pixels in many different positions. (Or in fact, ALL of them.)
Similar to a generator which generates every black/white pixel combination in a 1x2 grid (I made a gif on that here, https://gyazo.com/071a5d482852fc8eea9963e841f5dbc1, but it's very small so you'll have to look at your screen closely), except using all colours and on a much larger scale.
But the problem is, I don't know what coding language to code it in.
And there are many different coding languages, like PHP, SQL, JavaScript, Ruby, Python, and others, but I just don't know which one to use to create a generator like this. (And I also don't know how to actually get it onto the web page so it can generate onto the web page real-time.)
If anyone could help me on this then that would be greatly appreciated.
Thanks.
You haven't done some quick math, have you?
There are 64*64 = 4096 pixels to choose a color for. If you choose from only 256 colors for each pixel, then you'd have 256^4096 possible pictures, which is about 1.4*10^9864. That's a number with 9865 decimal digits.
Now let's put any memory issues aside, suppose you need just a nanosecond to generate one picture. Then you'll be waiting
(256^4096)/(31557600*10^9)
or roughly 4.5*10^9847 years for your result.
I don't think the universe lives that long pal :/
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 want to create a webpage with several small tiles that enlarge when clicked (And show more/different content, but that's not a part of this question).
This is what I have now: http://puu.sh/nX929.png
When I click on the first tile, it looks exactly like I want it to: http://puu.sh/nX9l9.png
But when I click the second tile it looks like this: http://puu.sh/nX95G.png (gap on the left)
That's not what I want, I want to other (small) tiles to float around it. To fill the empty space.
The source code (+ live example) can be found here (but I wouldn't mind doing it in a completely different way): https://www.crescendosassenheim.nl/Hugo/Training/
I don't even know what to Google, because I have absolutely no idea what kind of technique I can use to achieve what I want. Any suggestions?
http://masonry.desandro.com/methods.html Take a look at this I am sure this will help you, what you want is even displayed at the bottom of the page i am linking.
Download masonry in your computer link to it and follow the little guide in their website.
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 7 years ago.
Improve this question
I want to display 1000x1000 array in some way. Array element would either be black or white, depending on boolean value. For this job I am thinking about either javascript or winforms, but before I jump into, I wanted to hear what could be drawbacks for these choices. I am much more familiar with javascript than winforms though. As for winforms, I tought that there could be too many GDI objects to handle. Any ideas, suggestions?
I'm not familiar with win-forms but the first idea that came to mind was just a plain old html table. It would be a lot of html though to have 1000 x 1000. Second thing that came to mind would be an SVG. You can manipulate an SVG with JavaScript as shown here http://tutorials.jenkov.com/svg/scripting.html. Theres also this post which shows how to create tables with SVG.You would probably want to generate the SVG before hand to save the application from doing a lot of work and then set the colors using a loop. You can even use photoshop and save as SVG and then open the file in an editor to get the SVG code.