D3.js中的“如果”声明

时间:2014-08-01 15:52:43

标签: javascript d3.js

链接中有以下格式的在线Feed http://www.tfl.gov.uk/tfl/syndication/feeds/cycle-hire/livecyclehireupdates.xml

使用D3我正在伦敦地图上绘制一个圆圈,无论这些地点位于何处。我想实现以下内容。如果自行车的数量(在XML文件中以nbBikes给出)小于5,则圆圈的“填充”应为红色,否则为绿色。 我得到了正确绘制的圆圈,但IF声明无效。

$.ajax({
            url: "http://localhost:56854/WebForm1.aspx?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 stations = d3.select(data).selectAll("station")[0];
            g.selectAll("circle")
                   .data(stations)
                   .enter()
                   .append("circle")
                   .attr("r", 3)
                   .style("fill", function (d) {            // 
                       if (d.getElementsByTagName("nbBikes").childNodes[0].nodeValue <= 5) { return "red" }  // 
                     else { return "black" }          // 
                     ;
                 })
                   .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];
                   })

0 个答案:

没有答案