'如果'声明在D3.js中不起作用

时间:2014-08-03 02:49:16

标签: javascript d3.js

我需要在地铁站的地图上绘制圆圈。如果车站温度低于20度,圆圈的“行程”必须为白色,否则为黑色。

我尝试了很多方法,而且下面的方法在逻辑上是最简单的,但它不起作用,有人可以告诉我为什么吗?

                    var stroke; // a global variable

 function ShowWeather(sId, place) {
            var h;
            $.ajax({
                type: "GET",
                url: "Station-Weather1.xml", 
                dataType: "xml",
                success: function (xml) {`$(xml).find('DWStation').each(function () {
                        var stId = $(this).find("sId").text()

                        if (sId == stId) {
                            var cDate = getCurrentDate();
                            var wLocId = $(this).find("wId").text()

                            var wtURL = "http://localhost:56854/WebForm1.aspx?webURL=http://datapoint.metoffice.gov.uk/public/data/val/wxfcs/all/xml/";


                            var wData;
                            $.ajax({
                                url: wtURL,
                                dataType: 'xml',
                                data: wData,
                                success: weatherData,
                                error: MyMessage
                            });

                            function weatherData(wData) {


                                var dv = $(wData).find("DV");

                                var tmp = dv.find("Location").find("Period").find("Rep");


                                  if (attrib.name == "T") { // In the corresponding XML file "T" is the "Temperature" value

if (attrib.value < 20 ) {stroke = 1;} else {stroke =0;} } } } }); },});}

        var data;


        $.ajax({
            url: "webURL=http://www.tfl.gov.uk/tfl/syndication/feeds/cycle-hire/livecyclehireupdates.xml",
            dataType: 'xml', 
            data: data,
            success: parseXml,
            error: MyMessage
        });

        function parseXml(data) {
            var c;
            var color;
            var stations = d3.select(data).selectAll("station")[0];
            g.selectAll("circle")
                   .data(stations)
                   .enter()
                   .append("circle")
                   .style("fill", "red")
                   .attr("cx", function (d) {
                       return projection([d.getElementsByTagName("long")[0].childNodes[0].nodeValue, d.getElementsByTagName("lat")[0].childNodes[0].nodeValue])[0];
                   })
                   .attr("cy", function (d) {
                       return projection([d.getElementsByTagName("long")[0].childNodes[0].nodeValue, d.getElementsByTagName("lat")[0].childNodes[0].nodeValue])[1];
                   })
                   .attr("r", 3)


                   .style ("stroke", function(d)
                   {

               if (stroke == 1) { return c ="white"; } else { return c ="black"; }
                   })

1 个答案:

答案 0 :(得分:2)

你让它变得比它需要的更难 - 你可以在一个地方检查属性值和颜色设置,而不是将它分成几个:

.style("stroke", function(d) { return d.T < 20 ? "white" : "black"; })

这假设您绑定到圈子的stations数据附加了此属性。