Turning your phone into a virtual-joystick

Image
Update: I kept working on this and I have released it as a package for Windows, Linux and macOS. Check it out: https://github.com/zenineasa/joystick/releases/tag/v1.0.0 -- During the days when I was pursying my master's programme, my friends and I used to occasionally go to a classroom in the university, turn on a projector, connect devices like Nintento Switch or Gaming computers and loads of joysticks, and play different simple multiplayer games; MarioKart was my favourite. From time-to-time, when I get together with people, I ponder that it would be a good idea if I bought such devices. Indeed, I do have a laptop, which could easily run such games; SuperTuxKart is similar enough to MarioKart and it can run on Linux, Windows and Mac. However, I do not have joysticks with me at the moment. Therefore, I think it would be a good idea if I simply worked on a project that would enable using our phones as joysticks. From a high-level, the plan is to host APIs on a NodeJS server that wo

Extracting Stock Price Data Trend from Google Search to Train LSTM Network

I am not very good with designing my own neural networks. I have attempted to create a few in the past, some worked out fine for proving certain points that I wanted to make, but whenever I tried to make something to participate in a competition, things were not very well. In this post, I do not intent on creating an LSTM based neural network to predict stock prices, rather simply use Google as a tool to extract the stock trends from the graphs.

To get started, search for "Amazon stock price" on google. You would be able to see a pretty nice graph. On right clicking on the graph and clicking on Inspect and reading through Elements in the Developer tools, it can be observed that the graph is rendered using Scalable Vector Graphics or SVG. This is an XML-based vector image format and the data required to create such a graphic would be available in a format that we'll be able to read. I also observed that the required SVG image has a class name uch-psvg and there is only one element with that class name.

Let us start observing the data inside the SVG image. It can be seen that identical data is being stored in the first two path tags inside the SVG. This represents the data trend. To train an LSTM, you don't necessarily need the data with right numbers; you just need the data with the right trend. Let us extract this data into variables named xValues and yValues.

svg = document.getElementsByClassName('uch-psvg')[0];
pathStr = svg.getElementsByTagName('path')[1].outerHTML;
valueStr = pathStr.split('d="M ')[1].split('"')[0];
valueStrSplit = valueStr.split(" L ");
var xValues = [];
var yValues = [];
for(var i = 0; i < valueStrSplit.length; i++){
    xy = valueStrSplit[i].split(" ");
    xValues.push(parseFloat(xy[0]));
    yValues.push(-1 * parseFloat(xy[1]));
}



It can be observed that xValues are just equidistant values and from analyzing a trend perspective, it would not provide a lot of information. Let us ignore that.

The reason for adding a -1 multiplier to yValues is because in browsers, while rendering, the coordinate axes start from the top left corner of your screen and positive Y-direction is downward and hence SVG would have values adjusted accordingly. We are only interested in the right trend and hence to flip it, we simply have to add a negative sign.

You can use this method to create a training data with trends from different stock prices and create a huge training data and train an LSTM network.

Comments

Popular posts from this blog

First impression of Lugano - Mindblowing

Thinking about developing an opensource P2P social network

From Correlation to Causation through stories and math