Vue 使用图表插件 -- Echarts

目前常用的图表插件有:
charts
Echarts
highcharts
d3.js
这次根据Vue 项目中 Echarts 的应用记一笔。

安装插件

npm install echarts -S

使用npm 安装 Echarts,安装成功后,可在项目package.json 文件中查看到

然后在项目的入口js文件 main.js中添加

import echarts from 'echarts' 

模板中创建所需的Demo

Vue 使用图表插件 -- Echarts_第1张图片


<template>
    
    <div class="vol-data">
      <div class="charts" style="width:'100%',height:'6.54rem'">
        <div class="charts-title">
          24小时内最高:99.99
        div>
        <div id="myChart" :style="{width:'100%',height:'300px'}">
        div>
      div>
    div>
<template>

                    
                    

你可能感兴趣的:(Vue.js)