Gekko UI feedback

[askmike]

You can now try the beta version of the UI.

See here how it works: https://wizb.it/gekko/static/small.gif

---

You can try it yourself by downloading the web-wrapper branch and running:

npm install
node gekko --ui

I can't wait to here what you think :)

---

EDIT: I am still interested in ideas / bugs / feedback. Please post them in #611 (or create an issue once that is merged)

[BarnumD]

Got

module.js:442
    throw err;
    ^

Error: Cannot find module 'relieve'
    at Function.Module._resolveFilename (module.js:440:15)
    at Function.Module._load (module.js:388:25)
    at Module.require (module.js:468:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/usr/src/gekko/core/workers/dateRangeScan/parent.js:1:78)
    at Module._compile (module.js:541:32)
    at Object.Module._extensions..js (module.js:550:10)
    at Module.load (module.js:458:32)
    at tryModuleLoad (module.js:417:12)
    at Function.Module._load (module.js:409:3)

[askmike]

@BarnumD Could you try again?

[BarnumD]

Yes adding that dependency did it. I really like the ability to see the graph of the data. However, I would like to see the summary like we have on the command line. (buy and hold profit, vs trading profit.) Without that the graph is less useful.

[BarnumD]

@Feature request: Enter a custom date range in the gui for backtesting.

[BarnumD]

The graph is a little hard to zoom and navigate. It would be nice if you could zoom to certain date ranges on the graph and have it automatically adjust the graph.

[askmike]

I would like to see the summary like we have on the command line.

YES, coming asap :)

Enter a custom date range in the gui for backtesting.

Good one, I put it on the list.

The graph is a little hard to zoom and navigate.

I couldn't find a chart I needed.. (I basically want to show a few lines: price & indicator results, show buy and sell signals and have the whole thing pan and zoomable). I am open for suggestions, else I will just create my own at some point (now using techanjs).

[BarnumD]

Zenbot (https://github.com/carlos8f/zenbot) has a decent graph in terms of aesthetics. It has very limited ability to change the graph size by using a drop down menu. I'd like to see something more interactive. Really what I would like the ability to do is zoom to a particular point in time to get a sense of what was going on in the market.

Great job so far :)

[askmike]

@BarnumD so the profit report is now included in the UI, it looks like this:

more to come!

[totomaze]

Looks good !

(node:2658) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: Exited with code 3 I am accessing gekko ui through my public Ip but all the calls are made to localhost... build.js:3 GET http://localhost:3000/api/strategies net::ERR_CONNECTION_REFUSED build.js:3 OPTIONS http://localhost:3000/api/scan net::ERR_CONNECTION_REFUSED

Replcaing all http://localhost:3000/api/... to /api/... fixed it

[askmike]

Replcaing all http://localhost:3000/api/... to /api/... fixed it

Ah great, if you want you can submit a PR for that.

I am accessing gekko ui through my public Ip

The UI is now focussed on backtesting and importing, stuff I guess makes sense to run locally. So I was thinking that this is how it will be used for now. At some point I want people to be able to run live gekko's using the UI as well, which means something like: "configure the gekko-server" and than it talks to a Gekko hosted somewhere else (or people just set Gekko up on their server and do all their backtesting there as well).

[tomih]

Great work Mike. May I suggest TradingView charting library (https://www.tradingview.com/HTML5-stock-forex-bitcoin-charting-library/). You need to apply for access, but it's free. There are lots of tools and indicators available out of the box and there is also Trading Library that enables you placing orders (if you need to stop the bot and make panic trades yourself).

regards, T.

[askmike]

@tomih that license is way to restrictive for me. The main problem would be that Gekko is open source and other people can easily fork it and change whatever they want. But my name would be attached to the TV CL License Agreement and I would be liable for any violation of the terms. Also, just by signing that and putting it into Gekko I am violating 9.1.e(xi):

upload, host, post, transmit, deposit or otherwise make your TV CL API Implementation(s) available for any other third parties

[tomih]

Well, I know it is restrictive. It's a great charting lib, so i thought Gekko could be 'TradingView lib ready' and people who are interested would apply for access and plug it in.

But you are right. If you want to provide out of the box solution, open licence is the way to go.

Maybe it would be nice to have some kind of adapter to connect a charting library of choice. I will definitely play with TV lib and let you know.

T.

[askmike]

Maybe it would be nice to have some kind of adapter to connect a charting library of choice. I will definitely play with TV lib and let you know.

Great idea! I will look into making something so that the frontend supports plugins as well. If anyone feels adventurous already: this Vue component is holds the logic of what chart to render .

[askmike]

@BarnumD @tomih would this work for now? http://bl.ocks.org/askmike/11b383533644a4d570d0b6562b727668 You can pan/zoom (the circles will change into arrows that indicate buys/sells).

[tomih]

@askmike chart running smoothly.

I pulled the latest version but I still don't see a profit report. btw, I sent you mail at hey@...

T.

[askmike]

@tomih I replied now :) And try again, I forgot to recompile the frontend..

[askmike]

@BarnumD you can now select your own daterange as well, see here:

[askmike]

a few updates:

• web-wrapper branch has been merged into develop, please pull the develop branch to have a look
• the chart 4 comments up is now implemented (with small tweaks)
• the frontend and backend now also communicate via websockets.
• the UI looks better (imo):

[askmike]

@totomaze I changed some stuff around, if you need tell the frontend where the backend is located you now have to change this file.

[webcaetano]

@askmike Good job. It will need a parameter on config to setup the port.

[BarnumD]

I like the way the new graph looks and feels.

Can you put a default,/example date in From: and To: daterange just so people don't have to look up the proper syntax?

Will you also be able to export from the Gui?

I'm hoping the Live Gekko will give a graph and some historical (live) trading data. Maybe that's what's planed already?

[askmike]

@webcaetano

It will need a parameter on config to setup the port.

You're right, but so many config files... Coming asap (for now, change this)

@BarnumD

Can you put a default,/example date in From: and To: daterange just so people don't have to look up the proper syntax?

I'm hoping the Live Gekko will give a graph and some historical (live) trading data. Maybe that's what's planed already?

Will do and yes (well first I'd like to have importing done so that you can actually backtest through the UI without having to switch to the commandline to get the data).

[totomaze]

I changed localhost to my_IP but I got this error in UIConfig build.js:12 GET http://MY_IP:3000/strategies 404 (Not Found)

I had to put /api/ in the path

The declared route should not contain '/api/' (e.g: /api/strategies)

[totomaze]

The graph is awesome, and it will be even better if we can see the indicator too.

It will be good to configure the slipage and the fee in the backtest ui. The trade list will be good too

Great job.

[tomih]

Charts are great. :) @askmike is it possible to create kinda dynamic feed for additional indicator(s) with techanjs? Something like this: We create json in strategy (and emit it somehow):

{
   "indicators":[
      {
         "type":"line",
         "id":"willy",
         "name":"William",
         "yAxis":1,         // this is printed on canvas under main chart
         "color":"green",
         "dashStyle":"solid",
         "data":[
           {date:1373500800000,y:-78.553, text:'some text'},
           {date:1374105600000,y:-79.742, text:'some other text'}
         ]
      },
      {
         "type":"line",
         "id":"ema1",
         "name":"Ema 4",
         "yAxis":1,     // this is printed on canvas under main chart
         "color":"orange",
         "data":[
           {date:1373500800000,y:-71.695, text:'some text'},
           {date:1374105600000,y:-73.483, text:'some other text'}
         ]
      },
      {
         "type":"line",
         "id":"ema2",
         "name":"Ema 8",
         "yAxis":1,     // this is printed on canvas under main chart
         "color":"red",
         "data":[
           {date:1373500800000,y:-77.391, text:'some text'},
           {date:1374105600000,y:-78.331, text:'some other text'}
         ]
      },
      {
         "type":"line",
         "id":"reg",
         "name":"Regression",
         "yAxis":0,     // this is printed on main chart canvas
         "color":"black",
         "dashStyle":"solid",
         "data":[
           {date:1373500800000,y:-77.391, text:'some text'},
           {date:1374105600000,y:-78.331, text:'some other text'}
         ]
      },
      {
         "id":"cross",
         "type":"flags",
          "yAxis":1,     // flags are printed on canvas under main chart
         "name":"cross",
         "color":"green",
         "fillColor":"white",
         "onSeries":"ema1",
         "shape":"circlepin",
         "width":40,
         "data":[
           {date:1373500800000,y:-77.391, text:'some text'},
           {date:1374105600000,y:-78.331, text:'some other text'}
         ]
      },
   ]
}

Note yAxis. It represents on what 'part' (main chart or under it) something is printed. New 'part' is created on the fly If we pass object with new yAxis. I used that approach with highcharts.

@totomaze I'm working on new profitSimulator that accepts limit orders and outputs fees and list of orders. It's backward compatible and can be used instead of old one. Must dive into vue and jade to figure out how to display list of all orders under the chart. :) Will let you know when it's published.

Regards, T.

[tomih]

@askmike vue & jade are awesome. Where have I been all this time. :) But I have one probably very stupid question: how to compile this and make it show in webUI? I made new template and included it in results.vue. Nothing happens. Also do you have any two sentence hints (or links) on how to prepare dev environment and debug? thnx, T.

[tomih]

As I can see there should be two commands available in web folder. 'npm run dev' & 'npm run build'. Both return missing script error. 'npm run' prints that only 'test' script is available. advice?

T.

[askmike]

Importing is now possible (very basic though): example

@totomaze

I had to put /api/ in the path

Should not be necessary anymore!

The graph is awesome, and it will be even better if we can see the indicator too.

I'll do some more work on the chart after the basics are working.

It will be good to configure the slipage and the fee in the backtest ui. The trade list will be good too

Good one, coming up!

@tomih

Charts are great. :) [me] is it possible to create kinda dynamic feed for additional indicator(s) with techanjs?

Thanks! So the current chart is not based on techanjs but I made it myself. The big advantage now is that you can do some mad backtesting (like backtest over a year on 5min candles you'll create 105.120 price points) without it crashing your browser.

We create json in strategy (and emit it somehow):

Yes that is very easy.

I'm working on new profitSimulator that accepts limit orders and outputs fees and list of orders.

Not quite sure what you mean? The profitSimulator currently outputs a list of trades with the following properties (when run as a child process):

{
  "action": "buy",
  "price": 583.94209145,
  "date": "2016-08-20T21:33:00.000Z",
  "balance": 99.69999532001636
},
{
  "action": "sell",
  "price": 582.8,
  "date": "2016-08-21T08:33:00.000Z",
  "balance": 99.20648408
}

Please see this doc on how to develop the frontend (vue app).

[askmike]

Datasets

The UI now has a concept of datasets. A dataset is basically a market (exchange + cur + asset) with a certain timerange (to + from).

This makes it easier and faster to see and manage what local data Gekko has & to start backtests. Eaxmple here:

https://wizb.it/gekko/static/ds.gif

[tomih]

@askmike,

Not quite sure what you mean? The profitSimulator currently ...

Current implementation of profitSimulator simulates market orders (as soon as you emit advice, it is filled for current close price. I made simulation of real exchange. When order is placed, it goes to a queue. It is filled when: candle.high >= order.price for short OR candle.low <= order.price for long.

What I want to do now is output all orders under the chart (and that's not a problem, I'm aware of json output, the problem was compiling the frontend).

So, I still get errors when trying to run npm run dev in /web/vue:

ERROR in multi main
Module not found: Error: Can't resolve '/' in '/!Company/Dev/gekko/web/vue'
 @ multi main

ERROR in multi main
Module not found: Error: Can't resolve 'babel' in '/!Company/Dev/gekko/web/vue'
 @ multi main

Steps: npm install in web/vue Open gekko --ui in one terminal. Close localhost:3000 tab. Open npm run dev in new terminal.

and npm run build returns:

ERROR in Entry module not found: Error: Can't resolve 'babel' in '/!Company/Dev/gekko/web/vue'

btw, how about candlestick chart?

great job. importer works perfectly.

T.

[edward81]

If i start the normal backtest with "node gekko -b" all is working fine. The Ui can't see any datarange. And if i try to force the datarange i get this on the console: { Error: SQLITE_ERROR: no such table: candles_USD_BTC errno: 1, code: 'SQLITE_ERROR' } xxx POST /api/backtest 500 165ms -

[tomih]

@edward81 you should check if data for selected pair (btc_usd) exists. You can use import flag (--import) or import data via latest UI, before you try to backtest.

@askmike I still cannot run UI in dev mode nor build it. I believe there is some dependency problem, but error messages are not informative enough. Actually, code points to babel (that module didn't exist), but when I installed it, I got The node API for babel has been moved to babel-core error. If I change that to babel-loader, I get a bunch of other errors... I'm using node v6.6.0, on osx.

thnx for help, T.

[edward81]

@tomih I have the data. The command line backtest is working. But i think to found out what is wrong. With "BTC-e" as exchange the request fail. But i think that i figured out what is wrong. With firefox if I edit, and resend the request as "btce" instead of "BTC-e" the history is detected. I just need to figure out how ti fix this.

[askmike]

@edward81 nice catch! I was passing the exchange.name while the backtester required the exchanges.slug. These are the same is a lot of cases, but not in the case of btc-e.

Fixed now in latest develop!

[askmike]

@tomih

I still cannot run UI in dev mode nor build it.

Could you try this:

npm install -g vue-cli

I am not doing anything fancy, I just use the vue-loader as a start point.

[tomih]

@askmike thnx for reply. i tried with vue-cli but nothing changed.

I'm still getting this error:

ERROR in multi main
Module not found: Error: Can't resolve '/' in '/!Company/Dev/hodl/hodl.gekko/web/vue'
 @ multi main

ERROR in multi main
Module not found: Error: Can't resolve 'babel' in '/!Company/Dev/hodl/hodl.gekko/web/vue'
 @ multi main

I don't know what is '/' referring to, but babel is indeed missing. If I change it to babel-loader (in webpack.config.js), it compiles a little bit further, but still full of errors.

Here is the list of installed modules. Can you compare it with yours or post your list?

local modules:
npm ls --depth=0
vue@0.1.0 
+-- babel-core@6.18.2
+-- babel-loader@6.2.7
+-- babel-preset-es2015@6.18.0
+-- cross-env@3.1.3
+-- css-loader@0.25.0
+-- file-loader@0.9.0
+-- json-loader@0.5.4
+-- marked@0.3.6
+-- superagent@2.3.0
+-- superagent-no-cache@0.1.0 (git://github.com/uditalias/superagent-no-cache.git#2b15f4366a4b45bbfb66b9a626265bf3a72d00e4)
+-- vue@2.0.5
+-- vue-loader@9.9.5
+-- webpack@2.1.0-beta.26
`-- webpack-dev-server@2.1.0-beta.11

global modules:
npm -g ls --depth=0
/usr/local/lib
+-- forever@0.15.2
+-- npm@3.10.3
+-- pg@6.1.0
+-- vue-cli@2.5.1
`-- wavi@1.0.10

thnx in advance, T.

[tomih]

@askmike solved. It looks like the problem was in uppercase chars in path (/!Company/Dev). I love new things... T.

[tomih]

To recap the above problem. In addition to uppercase dirnames, there is also a problem with vue/bebel versions. Newer require suffix '-loader' in webpack.config.js and new module vue-router to be loaded.

1. don't use uppercase or special chars in dirnames. stick with all lowercase.
2. add "vue-router": "^2.0.3", to your devDependencies in package.json
3. to be safe, delete node_modules directory and run npm install
4. in webpack.config.js change vue -> vue-loader and babel -> babel-loader in rules section. Also add inline:true, in your devServer section.
5. in src/layout/footer.vue change all occurrences of json to json-loader.

That's it. Hope it helps. T.

[askmike]

Are you on windows? Anyway: I will change this whenever I have time (or you might create a PR for it).

On Tue, Nov 22, 2016 at 11:52 AM, Tomi notifications@github.com wrote:

To recap the above problem. In addition to uppercase dirnames, there is also a problem with vue/bebel versions. Newer require suffix '-loader' in webpack.config.js and new module vue-router to be loaded.

1. don't use uppercase or special chars in dirnames. stick with all lowercase.
2. add "vue-router": "^2.0.3", to your devDependencies in package.json
3. to be safe, delete node_modules directory and run npm install
4. in webpack.config.js change vue -> vue-loader and babel -> babel-loader in rules section. Also add inline:true, in your devServer section.
5. in src/layout/footer.vue change all occurrences of json to json-loader.

That's it. Hope it helps. T.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/askmike/gekko/issues/489#issuecomment-262221829, or mute the thread https://github.com/notifications/unsubscribe-auth/AA7MD1-0I4mPsoYVN2oHuSLL9ZN1DtbWks5rAteBgaJpZM4Klcxr .

PGP key at keybase.io/mikevanrossum https://keybase.io/mikevanrossum/key.asc

[tomih]

I couldn't find a chart I needed.. (I basically want to show a few lines: price & indicator results, show buy and sell signals and have the whole thing pan and zoomable). I am open for suggestions, else I will just create my own at some point (now using techanjs).

I just spent some time looking for d3 examples and found this: https://d3fc.io/ https://github.com/rrag/react-stockcharts (looks really responsive and cool). T.

[mattbrun]

Hi everyone, First of all thanks for this amazing project!

I've corrected a couple of missing dependencies, loader new requirements and a typo. Everything is in this PR https://github.com/askmike/gekko/pull/508 .

Thanks, M.

[tomih]

I'm on osx. Anyway, as I can see, we already have a contribution to solve it. I can't review it right now, but definitely will asap. T.

[askmike]

@tomih it's merged in so if you could let me know if it solves your problems!

---

I am working on live gekkos, I am taking a different approach than commandline gekko (since the UI makes it possible / easy to run multiple gekkos). For details and status, check PR Ui/market watchers [WIP] (#513)

[ofek-a]

@askmike I want to help integrating indicator data to the chart. Have you thought about what would be the best way to do so, and are you open for pull requests on that issue? Maybe it is possible to discuss it on a separate issue if necessary.

[askmike]

See #611.

[askmike]

@OfekA I

I am sorry for the late reply!

I want to help integrating indicator data to the chart. Have you thought about what would be the best way to do so, and are you open for pull requests on that issue? Maybe it is possible to discuss it on a separate issue if necessary.

Yes definitely open for this :) I first want to focus on having all main fuctionality in the UI (paper trading + backtesting + real trading). But definitely open to pull requests. If you have no idea where to start, please open an issue and I'll let you what needs to be done.

[thegamecat]

Using a talib custom method and get this, saw it was mentioned on the previous issue that was closed. Any ideas?

Error: non-error thrown: Child process has died. at Object.onerror (/Users/xyz/gekko-develop/node_modules/koa/lib/context.js:105:40)

[askmike]

@thegamecat can you try to set this to true and try again?

https://github.com/askmike/gekko/blob/develop/web/routes/baseConfig.js#L16

[thegamecat]

Tried, same issue.