echart样式如何修改，如下图代码_JavaScript_论坛

echart样式如何修改，如下图代码

马***0 分类：JavaScript 人气：1000 回帖：2 发布于6年前收藏

设计图效果

没有用echart前

用了echart

问题

标题的位置设置为top:-10，就向上移，但是标题就展示不完，如何达到标题与饼图有上下的距离
饼图的背景色怎么换
饼图的文字说明，怎么设置展示value,不展示name

代码

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <title>错题详情</title>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/reset.css"/>
    <link rel="stylesheet" href="css/jie.css"/>
    <script>
        document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';
    </script>
</head>
<body style="background-color: #fff">
<!--顶部-->
<header class="jie-header">
    <div class="jie-goback"><img src="images/goBack.jpg" alt="goback"/></div>
    <h1 class="header-title">试卷</h1>
    <div class="header-right">
        <span class="del">删除</span>
        <img class="yellow-del" src="images/yellowDel.jpg" alt="del"/>
    </div>
</header>
<!--内容-->
<section class="single-selection">
    <div class="selection-header">
        <div class="header-title">2017年普通高等学校招生全国统一考试(新课标||卷): 理综</div>
        <div class="header-text">(本试卷难度3.2, 总分120分,考试时间为100分钟)</div>
    </div>
    <div class="selection-body">
        <h2>共分为3个总分</h2>
        <div class="jie-hr"></div>

            <div id="main" style="width: 6.0rem;height:4.0rem;"></div>

    </div>
    <div class="selection-footer">
        <div class="body-button">开始答题</div>
    </div>
</section>
<!--底部-->
<footer class="jie-footer">
    <div class="footer-item-left">
        <img class="text-img" src="images/indexHomeYellow.jpg" alt="home"/>
        <p class="item-text">首页</p>
    </div>
    <div class="footer-item-center">
        <img class="text-img" src="images/indexErrorWhite.jpg" alt="error-title"/>
        <p class="item-text">错题库</p>
    </div>
    <div class="footer-item-right">
        <img class="text-img" src="images/indexMyWhite.jpg" alt="mg"/>
        <p class="item-text">我的</p>
    </div>
</footer>
<script src="js/echarts.js"></script>
<script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));

    // 指定图表的配置项和数据
    var option = {
        title: {
            text: '总共分为3个部分'

        },
        tooltip: {},
        legend: {
            bottom: 0,
            left: 'center',
            data: ['单选题', '多选题','完型填空']
        },
        series: [{
            name: '销量',
            type: 'pie',
            data: [
                {value:100, name: "单选题"},
                {value:50, name: "多选题"},
                {value:25, name: "完型填空"}
            ]
        }]
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
</script>
</body>
</html>

标签：echarts c javascript java php

讨论这个帖子（2）垃圾回帖将一律封号处理……

Lv4 码徒

25***om UI设计师 6年前#1

有一种东西，它叫文档。。。

Lv1 新人

陈***1 学生 6年前#2

建议查看echarts官方API ，http://echarts.baidu.com/opti...

文明上网，理性发言！ 😉 阿里云幸运券，戳我领取