Incubator-echarts: 官网例子绘图显示报错

Created on 19 Jan 2020 · 9Comments · Source: apache/incubator-echarts

Version

4.6.0

Steps to reproduce

idea创建springboot项目；
static/js目录下导入echarts.min.js
依据官网用例编写对应html5文件在项目的template目录下
编写controller测试方法请求对应html5文件
chrome访问对应接口。

What is expected?

显示对应柱状图

What is actually happening?

请求html成功，但是对于的柱状图未显示，对应DOM容器为空，

chrome进行debug发现echarts初始化报错，进入js发现echarts.min.js文件的开头<!DOCTYPE html>申明处就报错了，这是会是因为版本兼容或是我哪里配置出了问题么？Chrome为最新版本：79.0.3945.130 。
console处报错：

Uncaught SyntaxError: Unexpected token '<'
(index):14 Uncaught ReferenceError: echarts is not defined
    at (index):14
VM38:1 版本： 3.128 null

Source

KLordy

Most helpful comment

@KLordy 不能直接保存这个网页，需要点击 raw 然后再保存
屏幕快照 2020-02-27 14 03 07

Ovilia on 27 Feb 2020

👍2

All 9 comments

Hi! We've received your issue and please be patient to get responded. 🎉
The average response time is expected to be within one day for weekdays.

In the meanwhile, please make sure that you have posted enough image to demo your request. You may also check out the API and chart option to get the answer.

If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to [email protected]. Please attach the issue link if it's a technical questions.

If you are interested in the project, you may also subscribe our mail list.

Have a nice day! 🍵

echarts-bot[bot] on 19 Jan 2020

您好，echarts.min.js 文件里面不可能有 <!DOCTYPE html>，有点不太清楚你是怎么用的。

deqingli on 20 Jan 2020

您好，echarts.min.js 文件里面不可能有 <!DOCTYPE html>，有点不太清楚你是怎么用的。
你好~ 我是直接下载的https://github.com/apache/incubator-echarts/tree/4.6.0/dist 里的echarts.min.js直接存储到对应项目路径，然后引用的html如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Title</title>
    <script src="js/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例  -- MARK 这一行初始化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>
<p>测试mark</p>
</body>
</html>

请问是我下载的文件不对么？

KLordy on 20 Jan 2020

您好，echarts.min.js 文件里面不可能有 <!DOCTYPE html>，有点不太清楚你是怎么用的。

另外，我用了别人提供的老版本的echarts.min.js文件替换了我下载的github上的echarts.min.js，然后就绘图成功了，是因为我上面说的从github仓库直接下载echarts.min.js方式不对么？github上下载的需要自己手动build么？问题有点多不好意思哈...

KLordy on 20 Jan 2020

您好，echarts.min.js 文件里面不可能有 <!DOCTYPE html>，有点不太清楚你是怎么用的。

另外，我用了别人提供的老版本的echarts.min.js文件替换了我下载的github上的echarts.min.js，然后就绘图成功了，是因为我上面说的从github仓库直接下载echarts.min.js方式不对么？github上下载的需要自己手动build么？问题有点多不好意思哈...

按理说下载的方式是没问题的，你应该是从官网过去的。你可以重新再下载一遍试下么，我担心是因为被墙下载不完全导致的。2. 不需要构建了，dist 目录下就是构建后的产物。

deqingli on 21 Jan 2020

👍1

您好，echarts.min.js 文件里面不可能有 <!DOCTYPE html>，有点不太清楚你是怎么用的。

另外，我用了别人提供的老版本的echarts.min.js文件替换了我下载的github上的echarts.min.js，然后就绘图成功了，是因为我上面说的从github仓库直接下载echarts.min.js方式不对么？github上下载的需要自己手动build么？问题有点多不好意思哈...

按理说下载的方式是没问题的，你应该是从官网过去的。你可以重新再下载一遍试下么，我担心是因为被墙下载不完全导致的。2. 不需要构建了，dist 目录下就是构建后的产物。

十分感谢答复~ 新版尝试了重新下载还是不行，已经使用久版本的echarts.min.js测试完成了~

KLordy on 6 Feb 2020

您好，echarts.min.js 文件里面不可能有 <!DOCTYPE html>，有点不太清楚你是怎么用的。

另外，我用了别人提供的老版本的echarts.min.js文件替换了我下载的github上的echarts.min.js，然后就绘图成功了，是因为我上面说的从github仓库直接下载echarts.min.js方式不对么？github上下载的需要自己手动build么？问题有点多不好意思哈...

按理说下载的方式是没问题的，你应该是从官网过去的。你可以重新再下载一遍试下么，我担心是因为被墙下载不完全导致的。2. 不需要构建了，dist 目录下就是构建后的产物。

十分感谢答复~ 新版尝试了重新下载还是不行，已经使用久版本的echarts.min.js测试完成了~

作为一个 git 萌新，表示也这么下载过 echarts，这 url 对应的就是个网页啊，哈哈哈~~~

[root@bogon ~]# wget https://github.com/apache/incubator-echarts/blob/4.6.0/dist/echarts.min.js
--2020-02-27 13:53:00--  https://github.com/apache/incubator-echarts/blob/4.6.0/dist/echarts.min.js
Resolving github.com (github.com)... 

52.74.223.119
Connecting to github.com (github.com)|52.74.223.119|:443... connected.
HTTP request sent, awaiting response... 200 OK
Length: unspecified [text/html]
Saving to: ‘echarts.min.js’

    [                                                                <=>                                                                                                                                ] 952,569     33.1KB/s   in 22s    

2020-02-27 13:53:34 (43.0 KB/s) - ‘echarts.min.js’ saved [952569]

[root@bogon ~]# 
[root@bogon ~]# 
[root@bogon ~]# more echarts.min.js 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
........................................