Font Awersome & ECharts

最新推荐文章于 2024-03-26 09:56:37 发布

Xu_sa_sa

最新推荐文章于 2024-03-26 09:56:37 发布

阅读量611

点赞数

本文链接：https://blog.csdn.net/Xu_sa_sa/article/details/81319360

版权

Font Aweisome需要在官网下载压缩包后使用

<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts-all-3.js"></script>
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
</head>

<body bgcolor="#faebd7">
<i class="fa fa-camera-retro fa-2x"></i>
<span class="fa-stack fa-lg">
    <i class="fa fa-square-o fa-stack-2x"></i>
    <i class="fa fa-twitter fa-stack-1x"></i>
</span> //图表合并，效果图中的推特图标

<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="width: 500px;height:400px;" align="center"></div>
<script type="text/javascript" >
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));
    // 指定图表的配置项和数据
    var option = {
        backgroundColor: '#2c343c',
        title: {
            text: 'XXXXXXXX',
            left: 'center',
            top: 20,
            textStyle: {
                color: '#ccc'
            }
        },
      .............(在ECharts官网的实例都有)

效果如下