<template> <div> <lt-canvas ref="canvas" :width="750" :height="500"></lt-canvas> </div> </template> <script> import LightChart from 'light-chart'; export default { components:{ ltCanvas:require("light-chart/canvas") }, data(){ return {} }, mounted(){ const data = [ { year: '1951 年', sales: 38 }, { year: '1952 年', sales: 52 }, { year: '1956 年', sales: 61 }, { year: '1957 年', sales: 145 }, { year: '1958 年', sales: 48 }, { year: '1959 年', sales: 38 }, { year: '1960 年', sales: 38 }, { year: '1962 年', sales: 38 }, ]; let chart = new LightChart.Chart({ ltCanvas:this.$refs.canvas });
chart.source(data, { sales: { min: 20, } }); chart.interval().position('year*sales'); chart.render(); } } </script>
|