我有四個文件,並且我正在爲此項目使用節點。 我index.ejs,app.js,countymap.js,countries.geo.json。是否有可能將ejs變量傳遞給嵌入式JavaScript文件
app.js使用國家代碼數組呈現index.ejs文件(即[「MEX」,「USA」]。然後index.ejs調用countrymap.js,它使用d3使用json渲染地圖countries.geo.json
我想要做的就是將國家代碼傳遞給index.ejs,並根據國家使用它們爲相應國家代碼着色國家.geo .json文件到目前爲止,我已經嘗試了幾種方法,但似乎沒有任何工作可以使用
如果任何人有任何想法,我真的可以使用幫助,這是我最終的作品集和平,而且我被困在第一個障礙,並且如果你認爲我所做的一切都是錯誤的有另一個解決方案,我也很想聽到。
感謝, 喬治
index.ejs
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Passport Social</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="https://d3js.org/d3.v3.min.js"></script>
<script type="text/javascript" src="https://d3js.org/topojson.v2.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-3">
<div class="list-group">
<li class="list-group-item active">Info 1</li>
<li class="list-group-item">Info 2</li>
<li class="list-group-item">Info 3</li>
</div>
</div>
<div class="col-md-9">
<div class="thumbnail">
<svg style="background:grey;"></svg>
</div>
</div>
</div>
</div>
<script src="js/countrymap.js" type="text/javascript"></script>
</body>
</html>
app.js
var express = require("express"),
app = express(),
bodyParser = require("body-parser");
var countrydata = ["MEX","USA"];
app.get("/", function(req, res){
res.render("index",{countries:countrydata});
});
app.use(bodyParser.urlencoded({extended:true}));
app.set("view engine","ejs");
app.use(express.static(__dirname+"/public"));
app.listen(process.env.PORT,process.env.IP,function(){
console.log("Passport Social Server is Running.")
})
countrymap.js
/*global d3*/
var w = 500,
h = 300;
var projection = d3.geo.mercator()
.scale(1)
.translate([0, 0]);
var path = d3.geo.path()
.projection(projection);
var svg = d3.select("svg")
.attr("width", w)
.attr("height", h);
d3.json("json/countries.geo.json", function(error, world) {
if (error) return console.log(error);
world.features.forEach(function(path){
})
var b = path.bounds(world),
s = .95/Math.max((b[1][0] - b[0][0])/w, (b[1][1] - b[0][1])/h),
t = [(w - s * (b[1][0] + b[0][0]))/2, (h - s * (b[1][1] + b[0][1]))/2];
projection.scale(s)
.translate(t);
svg.selectAll("path")
.data(world.features).enter()
.append("path")
//.style("fill", "black")
.style("stroke", "grey")
.style("stroke-width", "1px")
.attr("d", path)
.attr("id", function(d, i) {return (d.id);});
});
你試過了嗎?<%variable_name%>? –
這在js文件中是不允許的。 –