我正在尝试使用Planetary.js http://planetaryjs.com/examples/rotating.html,但它给了我错误。我已经在空文件夹中尝试过了,在该文件夹中我在一个文件夹中创建了每个html,js,并且效果很好。现在,我尝试按照烧瓶模板进行相同的操作。这是我的文件路径
mainfolder
|
|->templates
| |->index.html
| |-> world-110m.json
|
|->static
|->css
|->js
|->draw_globe.js
|-> planetaryjs.min.js
我放置了world-110m.json,因为在http://planetaryjs.com/documentation/index.html的文档中,它清楚地告诉了我
// You can remove this statement if `world-110m.json`
// is in the same path as the HTML page:
planet.loadPlugin(planetaryjs.plugins.earth({
topojson: { file: 'http/path/to/world-110m.json' }
}));
因此,当我在所有文件夹都放在一个文件夹中的另一个文件夹上尝试时,它工作得很好。我不确定如何解决这个问题
这是我的html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Air-Quality</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="../static/css/style.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css"
integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ=="
crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.3.3/dist/leaflet.js"
integrity="sha512-tAGcCfR4Sc5ZP5ZoVz0quoZDYX5aCtEm/eu1KhSLj2c9eFrylXZknQYmxUssFaVJKvvc0dJQixhGjG2yXWiV9Q=="
crossorigin=""></script>
<script type='text/javascript' src='http://d3js.org/d3.v3.min.js'></script>
<script type='text/javascript' src='http://d3js.org/topojson.v1.min.js'></script>
</head>
<body>
<div class="text-center main">
<canvas id='globe' width='700' height='700'></canvas>
</div>
<script type='text/javascript' src='../static/js/planetaryjs.min.js'></script>
<script src="../static/js/config.js"></script>
<script src="../static/js/draw_globe.js"></script>
<script src="../static/js/app.js"></script>
</body>
</html>
draw_globe.js
var planet = planetaryjs.planet();
var canvas = document.getElementById('globe');
// You can remove this statement if `world-110m.json`
// is in the same path as the HTML page:
// Make the planet fit well in its canvas
planet.projection.scale(250).translate([250, 250]);
planet.draw(canvas);
如果您需要任何其他信息,请告诉我,我将实时更新。谢谢!