yuyu_2019的博客

【代码】echart环形图渐变色。

legend: { top: 'center', left: '60px', orient: 'vertical', textStyle: { color: '#fff', // 文字颜色 fontSize: 14, }, padding: [50, 20], // 整体padding itemGap: 20, // 每项间距 formatter: (pamars) => { console.log(pamars) let data =

graphic: { elements: [ { type: 'image', style: { image: "../../assets/images/apps/bi/huan2.png", width: 145, height: 145 }, left: '48px', top: 'center' } ]},

markLine: { label: { show: true, // 是否展示文字 formatter: function (params) { return '月平均\n' + params.value } }, data: [ { type: 'average', name: '月平均' } ]}

yAxis: { max: this.yMax, interval: this.yMax / 4, axisLabel: { // 关键行 formatter: function (value, index) { return value.toFixed(0) } }, type: 'value', axisLine: { // 设置坐标轴和坐标轴字体颜色

思路1）html2canvas 截图 //两个参数：所需要截图的元素id，截图后要执行的函数， canvas为截图后返回的最后一个canvas html2canvas(document.getElementById('id')) // 根据id截图 .then(function(canvas) { document.body.appendChild(canvas); // 截图成功后做什么 });2）jspdf 生成导出pdfnpm install jspdf --saveim

xAxis: { type: 'category', data: ['00', '01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24'], axisLine: { // 设置坐标轴和坐标轴字体颜色 lineStyle: { color: '#226

series: [ { type: 'line', data: [120, 200, 150, 80, 70, 110, 130], areaStyle: { opacity: 0.5 }, symbol: 'circle', itemStyle: { normal: { lineStyle: { width: 1 } } }, markLine: { symbol: "n

方法描述max最大值interval间隔 yAxis: { type: 'value', name: '小时', max: 24, interval: 24 / 4, axisLabel: { textStyle: { color: '#5c96d5' }, }, nameTextStyle: { color: '#5c96d5' }, axisLi...

<template> <chart style="width: 100%; height: 350px" ref="chart1" :options="orgOptions" :auto-resize="true"></chart></template>methods: { resizeTheChart () { if (this.$refs && this.$refs

<template> <chart style="width:100%; height:100px;" :options="orgOptions" :auto-resize="true"></chart></template><script>import echarts from 'echarts'export default { name: 'barChartGDYJ', data (.

需求：vue-echarts放子组件里父组件传值调用它当父组件的数据变更了子组件里的echart重绘思路：子组件watch监听 props数据的变更当监听到变更重新定义 options的值父组件正常传值即可子组件<template> <chart style="width:160px; height:190px;" ref="yibiaopan" :options="orgOptions" :auto-res

<template> <chart style="width:100%; height:250px;" ref="chart1" :options="orgOptions" :auto-resize="true"></chart></template><script>import echarts from 'echarts'export default { name: 'b.

1）splitLine（网格线）2）axisLine（坐标轴）3）legend（数据分类）

好像是因为如果一开始容器是隐藏的那写的100%就会自动变为100px解决方法：直接写window.innerWidth<chart ref="chart1" :style="[{width:chartWidth},{height:'320px'}]" :options="orgOptions" :auto-resize="true" @click='onClick'></chart>

解决：步骤1：cnpm 改为 npm, npm i echarts vue-echarts -S步骤2：npm i resize-detector -S步骤3：vue.config.js文件写入module.exports = { transpileDependencies: [ 'vue-echarts', 'resize-detector', ...

<chart style="width:100%; height:320px;" ref="chart1" :options="orgOptions" :auto-resize="true" @click='onClick'></chart>methods: { onClic...