后来改用网络引用,也没用
啥情况
//引用的本地文件,用的django所有有模板语法,可以直接通过连接打开
<script src="{% static '/businessintelligence/echarts.min.js' %}"></script>
//直接在html内使用echart,报错echarts is not defined
<script>
var myChart=echarts.init(document.querySelector(".bar .chart"));
</script>
//放到一个单独的文件里面初始化,也是爆粗
<script src="{% static '/businessintelligence/mycharts.js' %}"></script>
关键是,下午刚开始调试的时候一点问题也没有,用的好好的
20分钟之后的补充
我试了很多不同的配置,然后申请的发现,换一个浏览器就好了,换了edge之后,echart就可以正常使用,但是使用Chrome就不行,我佛了.这个还跟浏览器挂钩,但是我之前再调试的时候,也是用的Chrome,没问题,现在突然出问题了
你把你引用的js.放到上面,浏览器解析是从上到下依次解析
看不到你的完整代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="chart" style="width: 400px; height: 400px;"></div>
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.1.2/echarts.common.js"></script>
<script>
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('chart'));
// 指定图表的配置项和数据
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>
控制台调一下,先输入echarts看下到底有没有,没有的话看下source目录有没有引入,如果也有就是没解析成功
加载顺序的问题,echarts.min.js 放到head中,
var myChart=echarts.init(document.querySelector(".bar .chart")); 的代码放到结束标签下面
如果都要放在一块,即使echarts.min.在上面,也有可能加载不到。