老师,浏览器显示空白

来源:2-3 请求流量分析统计-入门百度Echarts组件

梨海

2020-07-15 08:37:49

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>ECharts</title>

    <!-- 引入 echarts.js -->

    <script src="js/echarts.min.js"></script>

</head>

<body>

<!-- 为ECharts准备一个具备大小(宽高)的Dom -->

<div id="main" style="width: 600px;height:400px;"></div>

<script type="text/javascript">

    // 基于准备好的dom,初始化echarts实例

    var myChart = echarts.init(document.getElementById('main'));


    // 指定图表的配置项和数据

    var option = {

        title: {

            text: 'ECharts 入门示例'

        },

        tooltip: {},

        legend: {

            data:['销量']

        },

        xAxis: {

            data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]

        },

        yAxis: {},

        series: [{

            name: '销量',

            type: 'bar',

            data: [5, 20, 36, 10, 10, 20]

        }]

    };


    // 使用刚指定的配置项和数据显示图表。

    myChart.setOption(option);

</script>

</body>

</html>

http://img.mukewang.com/climg/5f0e4f47096a5b3d03330353.jpg

http://img.mukewang.com/climg/5f0e4f6309725ec112540144.jpg

写回答

1回答

好帮手慕小尤

2020-07-15

同学你好,测试代码并未发现问题,如下图所示:

http://img.mukewang.com/climg/5f0e6fb9092deef706910383.jpg

1. 建议同学清除缓存,重新进行测试。

    浏览器:Ctrl+R(清除缓存) 或使用Ctrl+F5(强制刷新)

    Tomcat如下所示:

        http://img.mukewang.com/climg/5f0e71790973311a02400228.jpg

2. 建议同学在浏览器控制台查看相应的js文件是否有成功引入,如下图所示:

http://img.mukewang.com/climg/5f0e703f096fcf2006840273.jpg

如果没有,建议同学尝试添加项目名。如下所示:

 <script src="/request-total/js/echarts.min.js"></script>

然后重启项目,重新进行测试。

如果我的回答解决了你的疑惑,请采纳,祝学习愉快~

0

0 学习 · 9666 问题

查看课程