Javascript模块未出现在通过CS50集成开发环境托管的网站中
Javascript模块未出现在通过CS50集成开发环境托管的网站中
提问于 2019-01-04 05:51:00
我正在做我的课程期末项目，并努力弄清楚我在cal-heatmap上遇到的一个bug，这是一个Javascript库，可以创建热图，比如Github的贡献日历。
当我在电脑上创建一个HTML文件并在Chrome中打开它时，一切看起来都很完美。
当我在Apache中创建相同的CS50文件，并在通过Flask/Apache托管服务器后打开它时，它看起来并不完美。
这是代码，sourced from this tutorial。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Cal-Heatmap Samples</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script>
<script type="text/javascript" src="http://cdn.jsdelivr.net/cal-heatmap/3.3.10/cal-heatmap.min.js"></script>
<link rel="stylesheet" href="http://cdn.jsdelivr.net/cal-heatmap/3.3.10/cal-heatmap.css" />
</head>
<body>
<div class="container">
<div class="page-header">
<h2>
Cal-HeatMap Samples</h2>
</div>
<div class="row">
<div class="col-lg-6">
<div class="panel panel-default">
<div class="panel-heading"><span class="glyphicon glyphicon-equalizer"></span> Service Call Statistics</div>
<div class="panel-body">
<div id="heatmap-navigation">
<button id="heatmap-previous" style="margin-bottom: 5px;" class="btn-xs"><i class="glyphicon glyphicon-chevron-left"></i></button>
<button id="heatmap-next" style="margin-bottom: 5px;" class="btn-xs"><i class="glyphicon glyphicon-chevron-right"></i></button>
</div>
<div id="cal-heatmap">
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var cal = new CalHeatMap();
cal.init({
domain: "month",
subDomain: "day",
cellSize: 20,
itemName: ["service ticket", "service tickets"],
data: {
"1452019700": 40,
"1454688100": 50,
"1452710900": 5,
"1452883700": 15,
"1453142900": 15,
"1453488500": 30,
"1456239700": 80,
"1453662300": 20,
"1455130100": 60,
"1455562100": 70,
"1455131100": 10,
"1456166900": 30,
"1456399000": 12,
"1451674100": 90
},
subDomainTextFormat: "%d",
range: 3,
displayLegend: true,
domainMargin: 20,
animationDuration: 800,
domainDynamicDimension: false,
start: new Date(2016, 01, 01),
end: new Date(2016, 02, 26),
scale: [10, 20, 80],
previousSelector: "#heatmap-previous",
nextSelector: "#heatmap-next",
});
</script>
</body>
</html>怎么回事？为什么相同的代码会得到不同的结果？
谢谢你的帮忙!
回答 1
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54030298
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号