代码之家  ›  专栏  ›  技术社区  ›  Jaffer Wilson Dilip kumar

js在Django中找不到文件

django-staticfiles python-3.x django python
  •  0
  • Jaffer Wilson Dilip kumar  · 技术社区  · 6 年前

    我尝试使用以下示例: https://bl.ocks.org/anilnairxyz/a51393d7c51342abe8d4e3f4cbab7ae1

    我通过简单的调整修改了这个示例,使其进入Django框架。以下是模板代码:
    temp.html 

    {% load static %}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="{% static 'test/cschart.css' %}">
</head>
<body>
    <div id="demobox">
        <div id="csbox">
            <div id="option">
                <input id="oneM" name="1M" type="button" value="1M"/>
                <input id="threeM" name="3M" type="button" value="3M" />
                <input id="sixM" name="6M" type="button" value="6M" />
                <input id="oneY" name="1Y" type="button" value="1Y" />
                <input id="twoY" name="2Y" type="button" value="2Y" />
                <input id="fourY" name="4Y" type="button" value="4Y" />
            </div>
            <div id="infobar">
                <div id="infodate" class="infohead"></div>
                <div id="infoopen" class="infobox"></div>
                <div id="infohigh" class="infobox"></div>
                <div id="infolow" class="infobox"></div>
                <div id="infoclose" class="infobox"></div>
            </div>
            <div id="chart1"></div>
        </div> <!-- csbox -->
    </div> <!-- demobox -->
    <script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script src="https://d3js.org/d3-queue.v3.min.js"></script>
    <script src="https://d3js.org/topojson.v1.min.js"></script>
    <script src="{% static 'test/cschart.js' %}"></script>
    <script src="{% static 'test/csbars.js' %}"></script>
    <script src="{% static 'test/csheader.js' %}"></script>
    <script src="{% static 'test/csdataprep.js' %}"></script>
    <script src="{% static 'test/csmain.js' %}"></script>
</body>
</html>


    def temp(request):
    return render(request, 'tt/temp.html', {})

    url.py 

    urlpatterns = [
    path('tt/', views.show),
    path('pie/', views.pie),
    path('dd3/', views.testingD3),
path('fera/', views.fera),
path('line/', views.lined3),
path('temp/', views.temp),
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

    我将完整的js和css保存在 static/test 文件夹,并已成功访问js和css。但我无法找到stockdata.csv文件。查看文件目录:
    directory structure


    output error image

    请帮我查一下档案。我甚至尝试创建一个名为 temp csv 文件,但失败了,因为我仍然得到相同的错误。 

    var parseDate    = d3.time.format("%Y-%m-%d").parse;
var TPeriod      = "3M";
var TDays        = {"1M":21, "3M":63, "6M":126, "1Y":252, "2Y":504, "4Y":1008 };
var TIntervals   = {"1M":"day", "3M":"day", "6M":"day", "1Y":"week", "2Y":"week", "4Y":"month" };
var TFormat      = {"day":"%d %b '%y", "week":"%d %b '%y", "month":"%b '%y" };
var genRaw, genData;

(function() {
    d3.csv("stockdata.csv", genType, function(data) {
      genRaw         = data;
      mainjs();
    }); 
}());

function toSlice(data) { return data.slice(-TDays[TPeriod]); }

function mainjs() {
  var toPress    = function() { genData = (TIntervals[TPeriod]!="day")?dataCompress(toSlice(genRaw), TIntervals[TPeriod]):toSlice(genRaw); };
  toPress(); displayAll();
  d3.select("#oneM").on("click",   function(){ TPeriod  = "1M"; toPress(); displayAll(); });
  d3.select("#threeM").on("click", function(){ TPeriod  = "3M"; toPress(); displayAll(); });
  d3.select("#sixM").on("click",   function(){ TPeriod  = "6M"; toPress(); displayAll(); });
  d3.select("#oneY").on("click",   function(){ TPeriod  = "1Y"; toPress(); displayAll(); });
  d3.select("#twoY").on("click",   function(){ TPeriod  = "2Y"; toPress(); displayAll(); });
  d3.select("#fourY").on("click",  function(){ TPeriod  = "4Y"; toPress(); displayAll(); });
}

function displayAll() {
    changeClass();
    displayCS();
    displayGen(genData.length-1);
}

function changeClass() {
    if (TPeriod =="1M") {
        d3.select("#oneM").classed("active", true);
        d3.select("#threeM").classed("active", false);
        d3.select("#sixM").classed("active", false);
        d3.select("#oneY").classed("active", false);
        d3.select("#twoY").classed("active", false);
        d3.select("#fourY").classed("active", false);
    } else if (TPeriod =="6M") {
        d3.select("#oneM").classed("active", false);
        d3.select("#threeM").classed("active", false);
        d3.select("#sixM").classed("active", true);
        d3.select("#oneY").classed("active", false);
        d3.select("#twoY").classed("active", false);
        d3.select("#fourY").classed("active", false);
    } else if (TPeriod =="1Y") {
        d3.select("#oneM").classed("active", false);
        d3.select("#threeM").classed("active", false);
        d3.select("#sixM").classed("active", false);
        d3.select("#oneY").classed("active", true);
        d3.select("#twoY").classed("active", false);
        d3.select("#fourY").classed("active", false);
    } else if (TPeriod =="2Y") {
        d3.select("#oneM").classed("active", false);
        d3.select("#threeM").classed("active", false);
        d3.select("#sixM").classed("active", false);
        d3.select("#oneY").classed("active", false);
        d3.select("#twoY").classed("active", true);
        d3.select("#fourY").classed("active", false);
    } else if (TPeriod =="4Y") {
        d3.select("#oneM").classed("active", false);
        d3.select("#threeM").classed("active", false);
        d3.select("#sixM").classed("active", false);
        d3.select("#oneY").classed("active", false);
        d3.select("#twoY").classed("active", false);
        d3.select("#fourY").classed("active", true);
    } else {
        d3.select("#oneM").classed("active", false);
        d3.select("#threeM").classed("active", true);
        d3.select("#sixM").classed("active", false);
        d3.select("#oneY").classed("active", false);
        d3.select("#twoY").classed("active", false);
        d3.select("#fourY").classed("active", false);
    }
}

function displayCS() {
    var chart       = cschart().Bheight(460);
    d3.select("#chart1").call(chart);
    var chart       = barchart().mname("volume").margin(320).MValue("TURNOVER");
    d3.select("#chart1").datum(genData).call(chart);
    var chart       = barchart().mname("sigma").margin(400).MValue("VOLATILITY");
    d3.select("#chart1").datum(genData).call(chart);
    hoverAll();
}

function hoverAll() {
    d3.select("#chart1").select(".bands").selectAll("rect")
          .on("mouseover", function(d, i) {
              d3.select(this).classed("hoved", true);
              d3.select(".stick"+i).classed("hoved", true);
              d3.select(".candle"+i).classed("hoved", true);
              d3.select(".volume"+i).classed("hoved", true);
              d3.select(".sigma"+i).classed("hoved", true);
              displayGen(i);
          })                  
          .on("mouseout", function(d, i) {
              d3.select(this).classed("hoved", false);
              d3.select(".stick"+i).classed("hoved", false);
              d3.select(".candle"+i).classed("hoved", false);
              d3.select(".volume"+i).classed("hoved", false);
              d3.select(".sigma"+i).classed("hoved", false);
              displayGen(genData.length-1);
          });
}

function displayGen(mark) {
    var header      = csheader();
    d3.select("#infobar").datum(genData.slice(mark)[0]).call(header);
}

    看看我的表 setting.py 

    import os

# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
print("Base URL is \n:    ",BASE_DIR)

SECRET_KEY = '#7xfs=i@n*!frchr_e)vaw!r=1c2fy-zu%070gdy6fe_=h_du_'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = ['127.0.0.1']    


INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'blog',
    'demod3',
    'django_nvd3',
    'djangobower',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',

]

ROOT_URLCONF = 'mysite.urls'


TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

WSGI_APPLICATION = 'mysite.wsgi.application'


DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}

# Password validation
# https://docs.djangoproject.com/en/2.0/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]


# Internationalization
# https://docs.djangoproject.com/en/2.0/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'Asia/Seoul'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.0/howto/static-files/

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
print("Statcic URL is :    \n:  ", STATIC_ROOT)
    1 回复  |  直到 6 年前
        1
  •  2
  •   Sina Khelil    6 年前

    在这篇文章中: 

    (function() {
    d3.csv("stockdata.csv", genType, function(data) {
      genRaw         = data;
      mainjs();
    }); 
}());

    改为: 

    (function() {
    d3.csv("/static/test/stockdata.csv", genType, function(data) {
      genRaw         = data;
      mainjs();
    }); 
}());

    不确定这在这种情况下是否有效,但您可以将该特定函数取出并将其嵌入到模板文件中: 

    <script language="javascript">
    var parseDate    = d3.time.format("%Y-%m-%d").parse;
    var TPeriod      = "3M";
    var TDays        = {"1M":21, "3M":63, "6M":126, "1Y":252, "2Y":504, "4Y":1008 };
    var TIntervals   = {"1M":"day", "3M":"day", "6M":"day", "1Y":"week", "2Y":"week", "4Y":"month" };
    var TFormat      = {"day":"%d %b '%y", "week":"%d %b '%y", "month":"%b '%y" };
    var genRaw, genData;

    (function() {
        d3.csv("{% static 'test/stockdata.csv' %}", genType, function(data) {
          genRaw         = data;
          mainjs();
        }); 
    }());
</script>

    不确定这将如何影响脚本的其余部分

    推荐文章
    July  ·  如何定义数字间隔,然后四舍五入
    1 年前
    Community wiki  ·  对象名称前的单下划线和双下划线的含义是什么?
    1 年前
    Brian Johnson  ·  为什么在Python中列出字典列表会引发TypeError?[已关闭]
    1 年前
    user026  ·  如何根据特定窗口的平均值(行数)创建新列?
    1 年前
    Ashok Shrestha  ·  需要追踪特定的颜色线并获取坐标
    1 年前
    Nicote Ool  ·  在FastApi和Vue3中获得422
    1 年前
    NeoExceptCodeBad  ·  如果我有很多垂直线,我如何找到它们的边缘?
    1 年前
    Abdulaziz  ·  如何对集合内的列表进行排序[重复]
    1 年前
    user2743931  ·  带有src目录的Python setup.py
    1 年前
    asmgx  ·  为什么合并数据帧不能按照python中的预期方式工作
    1 年前
    关于   移动版
    代码之家 - 一站式码农服务社区
    沪ICP备11025650号