| <div id="chart" style="width:100%;height:520px;"></div> | |
| <script src="https://cdn.jsdelivr.net/npm/@visactor/vchart/build/index.min.js"></script> | |
| <script> | |
| // 这里粘贴你的那段 JS 代码 | |
| const spec = { | |
| type: 'line', | |
| data: { | |
| values: [ | |
| { | |
| time: '2:00', | |
| value: 8 | |
| }, | |
| { | |
| time: '4:00', | |
| value: 9 | |
| }, | |
| { | |
| time: '6:00', | |
| value: 11 | |
| }, | |
| { | |
| time: '8:00', | |
| value: 14 | |
| }, | |
| { | |
| time: '10:00', | |
| value: 16 | |
| }, | |
| { | |
| time: '12:00', | |
| value: 17 | |
| }, | |
| { | |
| time: '14:00', | |
| value: 17 | |
| }, | |
| { | |
| time: '16:00', | |
| value: 16 | |
| }, | |
| { | |
| time: '18:00', | |
| value: 15 | |
| } | |
| ] | |
| }, | |
| xField: 'value', | |
| yField: 'time', | |
| direction: 'horizontal', | |
| axes: [ | |
| { orient: 'left', type: 'band' }, | |
| { orient: 'bottom', type: 'linear' } | |
| ] | |
| }; | |
| const vchart = new VChart.default(spec, { dom: "chart" }); | |
| vchart.renderSync(); | |
| // Just for the convenience of console debugging, DO NOT COPY! | |
| window['vchart'] = vchart; | |
| // 只要记得：dom 要写成 "chart" | |
| </script> | |