gauge.js-相对URL不起作用，但绝对URL在Django 1.10中起作用

Question

我一直在尝试gauge.js，并且仅在使用绝对URL时复制链接上显示的有效“使用”代码，而在使用相对URL时则不。 >

我在Github Issue Tracker上没有找到任何类似的东西

工作代码

<canvas id="foo"></canvas>
<script>
    var opts = {
      lines: 12,
      angle: 0.15,
      lineWidth: 0.44,
      pointer: {
         length: 0.9,
         strokeWidth: 0.035,
         color: '#000000'
      },
      limitMax: 'false', 
      percentColors: [[0.0, "#a9d70b" ], [0.50, "#f9c802"], [1.0, "#ff0000"]], // !!!!
      strokeColor: '#E0E0E0',
      generateGradient: true
    };
    var target = document.getElementById('foo');
    var gauge = new Gauge(target).setOptions(opts);
    gauge.maxValue = 3000;
    gauge.animationSpeed = 32;
    gauge.set(2250);
</script>

<script src="https://bernii.github.io/gauge.js/dist/gauge.min.js"></script>

问题

如果我用相对URL替换上面的绝对URL，则量表消失。我要做的是从here复制gauge.min.js代码，并将文件放在我的静态文件夹中。 （下面的工作树目录）

<script src="../../static/lineoee/gauge.min.js"></script>

上面的相对URL应该指向一个有效目录，但是我得到了：

  

（index）：224未捕获的参考错误：未在var gauge = new Gauge(target).setOptions(opts);处定义量规

工作树目录

    │   ├── static
│   │   └── lineoee
│   │       ├── gauge.min.js
│   ├── templates
│   │   ├── linedetails
│   │   │   ├── index.html
│   │   │   └── index.html.save
│   │   └── lineoee
│   │       ├── index.html     <-- I am linking gauge.min.js from here
│   │       ├── index.html.save

Urls.py

from django.conf.urls import url
from django.contrib import admin
from lineoee.views import index
from lineoee.views import details

urlpatterns = [
    url(r'lineoee/$', index, name='index'),
    url(r'linedetails/', details, name='details'),
]

关于我可能做错了什么建议？

旁注：

• 我有一些具体的性能问题，例如有限的互联网和 快速重新加载时间。
• 应用程序将仅部署在 localhost 上。

编辑

按照下面的答案，使用../static/lineoee/gauge.js在python控制台上收到以下消息：

  

“ GET /static/lineoee/gauge.min.js HTTP / 1.1” 304 0

Answer 1

相对URL相对于模板的磁盘位置不是，它们相对于当前URL。因此，如果您使用URL访问页面

http://localhost/lineoee/

Javascript资源的相对URL为

../static/lineoee/gauge.min.js

这可能是为什么对静态资源使用绝对URL的一个好主意，因为URL配置可以随时更改。建议您使用static模板标记，该标记为您处理这些详细信息：

{% load static %}
...
{% static 'lineoee/gauge.min.js' %}