echarts图表组件封装模板

这里提供的模板都是可以直接复用的。不同的图表，无非就是 option 配置不同，props接受传递过来的数据按需设置即可

这里我使用了一个 fontChart 的方法，这是为了让图表的字体在浏览器变化时能够达到自适应

fontChart 方法

// 字体转换 px -> rem
export function fontChart(res) {
  let docEl = document.documentElement,
    clientWidth =
      window.innerWidth ||
      document.documentElement.clientWidth ||
      document.body.clientWidth;
  if (!clientWidth) return;
  // 此处的3840 为设计稿的宽度，记得修改！
  let fontSize = clientWidth / 1920;
  return res * fontSize;
}

模板（Vue2） 

<template>
  <div :id="id" class="wft-w-h-100"></div>