mirror of
https://github.com/c9s/bbgo.git
synced 2024-11-10 09:11:55 +00:00
add poly js surface chart
This commit is contained in:
parent
b643b8ed0d
commit
a852411e01
4
apps/backtest-report/components/Plot.jsx
Normal file
4
apps/backtest-report/components/Plot.jsx
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
import plotly from 'plotly.js/dist/plotly';
|
||||||
|
import createPlotComponent from 'react-plotly.js/factory';
|
||||||
|
const Plot = createPlotComponent(plotly);
|
||||||
|
export default Plot;
|
|
@ -8,10 +8,12 @@
|
||||||
const withTM = require('next-transpile-modules')([
|
const withTM = require('next-transpile-modules')([
|
||||||
'lightweight-charts',
|
'lightweight-charts',
|
||||||
'fancy-canvas',
|
'fancy-canvas',
|
||||||
// 'd3-array',
|
'd3',
|
||||||
// 'd3-format',
|
'd3-array',
|
||||||
// 'd3-time',
|
'd3-format',
|
||||||
// 'd3-time-format',
|
'd3-time',
|
||||||
|
'd3-time-format',
|
||||||
|
'react-plotly.js',
|
||||||
// 'react-financial-charts',
|
// 'react-financial-charts',
|
||||||
// '@react-financial-charts/annotations',
|
// '@react-financial-charts/annotations',
|
||||||
// '@react-financial-charts/axes',
|
// '@react-financial-charts/axes',
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
"@mantine/core": "^4.2.5",
|
"@mantine/core": "^4.2.5",
|
||||||
"@mantine/hooks": "^4.2.5",
|
"@mantine/hooks": "^4.2.5",
|
||||||
"@mantine/next": "^4.2.5",
|
"@mantine/next": "^4.2.5",
|
||||||
|
"d3": "^7.4.4",
|
||||||
"d3-dsv": "^3.0.1",
|
"d3-dsv": "^3.0.1",
|
||||||
"d3-format": "^3.1.0",
|
"d3-format": "^3.1.0",
|
||||||
"d3-scale": "^4.0.2",
|
"d3-scale": "^4.0.2",
|
||||||
|
@ -21,9 +22,12 @@
|
||||||
"lightweight-charts": "^3.8.0",
|
"lightweight-charts": "^3.8.0",
|
||||||
"moment": "^2.29.3",
|
"moment": "^2.29.3",
|
||||||
"next": "12.1.6",
|
"next": "12.1.6",
|
||||||
|
"plotly.js": "^2.12.1",
|
||||||
|
"plotly.js-dist-min": "^2.12.1",
|
||||||
"react": "18.1.0",
|
"react": "18.1.0",
|
||||||
"react-compound-slider": "^3.4.0",
|
"react-compound-slider": "^3.4.0",
|
||||||
"react-dom": "18.1.0",
|
"react-dom": "18.1.0",
|
||||||
|
"react-plotly.js": "^2.5.1",
|
||||||
"tabler-icons-react": "^1.48.0"
|
"tabler-icons-react": "^1.48.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|
60
apps/backtest-report/pages/metrics.tsx
Normal file
60
apps/backtest-report/pages/metrics.tsx
Normal file
|
@ -0,0 +1,60 @@
|
||||||
|
import type {NextPage} from 'next'
|
||||||
|
import styles from '../styles/Home.module.css'
|
||||||
|
import {useRouter} from "next/router";
|
||||||
|
import {useEffect, useState} from "react";
|
||||||
|
import dynamic from 'next/dynamic';
|
||||||
|
|
||||||
|
import * as d3 from "d3";
|
||||||
|
|
||||||
|
const DynamicPlot = dynamic(import('../components/Plot'), {
|
||||||
|
ssr: false
|
||||||
|
})
|
||||||
|
|
||||||
|
const Metrics: NextPage = () => {
|
||||||
|
const {query} = useRouter();
|
||||||
|
const basePath = query.basePath ? query.basePath as string : '/output';
|
||||||
|
const [zData, setZData] = useState();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
d3.csv('https://raw.githubusercontent.com/plotly/datasets/master/api_docs/mt_bruno_elevation.csv').then((rows) => {
|
||||||
|
function unpack(rows, key) {
|
||||||
|
return rows.map(function (row) {
|
||||||
|
return row[key];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
let z_data = []
|
||||||
|
for (let i = 0; i < 24; i++) {
|
||||||
|
z_data.push(unpack(rows, i));
|
||||||
|
}
|
||||||
|
setZData(z_data);
|
||||||
|
});
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<main className={styles.main}>
|
||||||
|
<DynamicPlot
|
||||||
|
data={[{
|
||||||
|
z: zData,
|
||||||
|
type: 'surface'
|
||||||
|
}]}
|
||||||
|
layout={{
|
||||||
|
title: 'Metrics',
|
||||||
|
autosize: true,
|
||||||
|
width: 800,
|
||||||
|
height: 500,
|
||||||
|
margin: {
|
||||||
|
l: 65,
|
||||||
|
r: 50,
|
||||||
|
b: 65,
|
||||||
|
t: 90,
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Metrics
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user