| | |
| | | } |
| | | this.initStats = function () { |
| | | this.stats = new Stats(); |
| | | this.dom.appendChild( this.stats.dom ); |
| | | // this.dom.appendChild( this.stats.dom ); |
| | | } |
| | | this.initBackground = function () { |
| | | const cubeTextureLoader = new THREE.CubeTextureLoader(); |
| | |
| | | "posy.jpg", "negy.jpg", |
| | | "posz.jpg", "negz.jpg" |
| | | ]); |
| | | // this.scene.background = new THREE.Color( 0xf0f0f0 ); |
| | | this.scene.background = new THREE.Color( 0x17c5dc ); |
| | | } |
| | | this.removeObject = function (nameorid) { |
| | | for (let i = 0; i < this.objects.length; i++) { |
| | |
| | | canvas { |
| | | display: block; |
| | | } |
| | | #sidebar{ |
| | | /*定位*/ |
| | | position: absolute; |
| | | top: 50%; |
| | | left: 1%; |
| | | transform: translateY(-50%); |
| | | width: 20%; |
| | | height: 95%; |
| | | /*特效*/ |
| | | background: rgba(255,255,255,0.3); |
| | | border-radius: 5px; |
| | | color: #f0f8ff; |
| | | } |
| | | #sidebar h1{ |
| | | font-family: Fantasy; |
| | | font-size: 36px; |
| | | text-indent: 5%; |
| | | } |
| | | #baobiao1{ |
| | | width: 400px; |
| | | height: 300px; |
| | | } |
| | | |
| | | |
| | | </style> |
| | | </head> |
| | | <body> |
| | | <body style="position: relative"> |
| | | <div id="sidebar"> |
| | | <h1>中扬-立体仓库</h1> |
| | | <div id="baobiao1"></div> |
| | | |
| | | </div> |
| | | <div id="container"></div> |
| | | <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5.2.2/dist/echarts.min.js"></script> |
| | | <script type="text/javascript"> |
| | | var dom = document.getElementById("baobiao1"); |
| | | var myChart = echarts.init(dom); |
| | | var app = {}; |
| | | |
| | | var option; |
| | | |
| | | option = { |
| | | xAxis: { |
| | | type: 'category', |
| | | data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] |
| | | }, |
| | | yAxis: { |
| | | type: 'value' |
| | | }, |
| | | series: [ |
| | | { |
| | | data: [120, 200, 150, 80, 70, 110, 130], |
| | | type: 'bar' |
| | | } |
| | | ] |
| | | }; |
| | | |
| | | option && myChart.setOption(option); |
| | | |
| | | |
| | | // option = { |
| | | // title: { |
| | | // text: '年度进/出货量', |
| | | // textStyle:{ |
| | | // color:'#F8F8FF', |
| | | // }, |
| | | // subtext: 'Data', |
| | | // subtextStyle:{ |
| | | // color:'#F8F8FF', |
| | | // }, |
| | | // show: true, |
| | | // |
| | | // }, |
| | | // textStyle:{ |
| | | // color:'#F8F8FF', |
| | | // }, |
| | | // // subtextStyle:{ |
| | | // // color:'#F8F8FF', |
| | | // // }, |
| | | // // tooltip: { |
| | | // // trigger: 'axis' |
| | | // // }, |
| | | // legend: { |
| | | // show:false, |
| | | // data: ['进货', '出货'] |
| | | // }, |
| | | // toolbox: { |
| | | // show: false, |
| | | // feature: { |
| | | // dataView: { show: true, readOnly: false }, |
| | | // magicType: { show: true, type: ['line', 'bar'] }, |
| | | // restore: { show: true }, |
| | | // saveAsImage: { show: true } |
| | | // } |
| | | // }, |
| | | // calculable: true, |
| | | // xAxis: [ |
| | | // { |
| | | // type: 'category', |
| | | // // prettier-ignore |
| | | // data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'] |
| | | // } |
| | | // ], |
| | | // yAxis: [ |
| | | // { |
| | | // // show:false, |
| | | // type: 'value' |
| | | // } |
| | | // ], |
| | | // series: [ |
| | | // { |
| | | // name: '进货', |
| | | // type: 'bar', |
| | | // data: [ |
| | | // 2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3 |
| | | // ], |
| | | // markPoint: { |
| | | // data: [ |
| | | // { type: 'max', name: 'Max' }, |
| | | // { type: 'min', name: 'Min' } |
| | | // ] |
| | | // }, |
| | | // markLine: { |
| | | // data: [{ type: 'average', name: 'Avg' }] |
| | | // } |
| | | // }, |
| | | // { |
| | | // name: '出货', |
| | | // type: 'bar', |
| | | // data: [ |
| | | // 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3 |
| | | // ], |
| | | // markPoint: { |
| | | // data: [ |
| | | // { name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 }, |
| | | // { name: 'Min', value: 2.3, xAxis: 11, yAxis: 3 } |
| | | // ] |
| | | // }, |
| | | // markLine: { |
| | | // data: [{ type: 'average', name: 'Avg' }] |
| | | // } |
| | | // } |
| | | // ], |
| | | // |
| | | // }; |
| | | // |
| | | // if (option && typeof option === 'object') { |
| | | // myChart.setOption(option); |
| | | // } |
| | | |
| | | </script> |
| | | <script type="text/javascript" src="../static/js/lib/jquery-3.3.1.min.js"></script> |
| | | <script type="text/javascript" src="../static/js/common.js"></script> |
| | | <script type="text/javascript" src="../static/js/data/Warehouse.js"></script> |