使用flexigrid爲觸摸屏

我成功地呈現d3js面積圖在這裏html頁面是在文件的鍍鉻或mozilla.The名成功地渲染代碼是說temp.html.Here是代碼使用flexigrid爲觸摸屏

<!DOCTYPE html> 
<html lang="en" class="no-js"> 
<head> 
    <meta charset="UTF-8" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <title>js graphs and charts libraries</title> 


    <script 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 

    <script src="http://d3js.org/d3.v3.js"></script> 

    <body> 
     <div id="dbar"> 

     </div> 

    <script type="text/javascript"> 
     var margin = {top:10, right: 20, bottom: 30,left: 40}, 
      width = 960 - margin.left - margin.right, 
      height = 400 - margin.top - margin.bottom; 
      var svg = d3.select ("#dbar").append("svg").attr("width", 
width+margin.left+margin.right).attr("height",height+margin.top+margin.bottom) 
.append("g"). 
attr("transform","translate("+margin.left+","+margin.top+")"); 

     var parseDate = d3.time.format("%m-%Y").parse; 

     var x = d3.time.scale().range([0, width]); 
     var y = d3.scale.linear().range([height, 0]); 

     var xAxis = d3.svg.axis().scale(x).orient("bottom"); 

     var yAxis = d3.svg.axis().scale(y).orient("left"); 

     var area = d3.svg.area().x(function(d) { return x(d.date); }) 
        .y0(height) 
        .y1(function(d) { return y(d.count); }); 




     d3.json("data/json.json", function(error, data) { 
      data.StoreVisitGraphCount.list.forEach(function(d) { 

      d.date = parseDate(d.date); 

      d.count = +d.count; 
      }); 
      //console.log(data.StoreVisitGraphCount.list); 
     x.domain(d3.extent(data.StoreVisitGraphCount.list, function(d) { 
return d.date; })); 
     y.domain([0, d3.max(data.StoreVisitGraphCount.list, function(d) { 
`return d.count; })]);` 
    console.log(data.StoreVisitGraphCount.list); 
     svg.append("path") 
      .datum(data.StoreVisitGraphCount.list) 
      .attr("class", "area") 
      .attr("d", area); 

     svg.append("g") 
      .attr("class", "x axis") 
      .attr("transform", "translate(0," + height + ")") 
      .call(xAxis); 

     svg.append("g") 
      .attr("class", "y axis") 
      .call(yAxis) 
     .append("text") 
      .attr("transform", "rotate(-90)") 
      .attr("y", 6) 
      .attr("dy", ".71em") 
      .style("text-anchor", "end") 
      .text("Price ($)"); 
     }); 
    </script> 


    </body> 
</html>

但是，當我複製粘貼此代碼來說「temp.jsp」頁面它的不渲染和圖表不會來。

需要建議

來源

2013-01-24 Saurabh Sinha

我在您的標題看到你提到flexigrid :)你應該更新它。

要回答你的問題，也有2個可能的問題： 1.確保「數據/ json.json」供應OK（而不是404錯誤） 2.具有文件的.jsp可能意味着你需要額外的代碼。

來源

2013-01-26 06:53:13 ra00l

使用flexigrid爲觸摸屏

回答

相關問題