2012-05-22 2 views
0

.jsp를 사용하여 MySQL 데이터베이스에서 데이터를 수신하고 해당 데이터를 배열에 넣은 다음 해당 배열을 javascript로 보내고 배열을 사용하여 그래프를 채 웁니다. d3.js 통해 .jsp 부분을 수행하는 방법에 대한 연구를 해봤지만 실제로는별로 이해가되지 않습니다. 나는 자바에서 자바 스크립트로가는 것에 관해서는 거의 아무것도 발견하지 못했다. 이것은 내가 현재 가지고있는 것입니다 :MYSQL 및 JSP를 사용하여 Javascript 배열 채우기

<%@ page language="java" import="java.sql.*"%> 

<html> 
    <head> 
     <title>D3 Test</title> 
     <script type="text/javascript" src="d3/d3.v2.js"></script> 
      <style type="text/css"> 
     </style> 
    </head> 
    <body> 

    <% 

    Connection con=null; 
    ResultSet rst=null; 
    Statement stmt=null; 

    try{ 
     String url="jdbc:mysql://localhost:3306/usermaster? user=root&password=7rubA5Ra"; 

     int i=1; 
     con=DriverManager.getConnection(url); 
stmt=con.createStatement(); 
rst=stmt.executeQuery("select * from test "); 

%> 
    <script type="text/javascript"> 

     var dataset = [ 7, 12, 15, 21, 23, 27, 24, 20, 17, 15, 
      12, 14, 17, 22, 20, 19, 18, 20, 25, 27 ]; 
     var w = 500; 
     var h = 100; 
     var barPadding = 1; 
     var svg = d3.select("body") 
        .append("svg") 
        .attr("width", w) 
        .attr("height", h); 
     svg.selectAll("rect") 
      .data(dataset) 
      .enter() 
      .append("rect") 
      .attr("id", "rect1") 
      .attr("x", function(d, i) { 
        return i * (w/dataset.length); 
       }) 
      .attr("y", function(d) { 
       return h - d*4; 
      }) 
      .attr("width", w/ dataset.length - barPadding) 
      .attr("height", function(d) { 
       return d * 4; 
      }) 
      .attr("fill", function(d) { 
       return "rgb(0, 0, " + (d * 10) + ")"; 
      }); 

     /*svg.selectAll("rect") 
      .data(dataset2) 
      .enter() 
      .append("rect") 
      .attr("id", "rect2") 
      .attr("x", function(d, i) { 
        return i * (w/dataset2.length); 
      }) 
      .attr("y", function(d) { 
       return h - d*4; 
      }) 
      .attr("width", w/ dataset2.length - barPadding) 
      .attr("height", function(d) { 
       return d * 4; 
      }) 
      .attr("fill", function(d) { 
       return "rgb(0, 100, " + (d * 10) + ")"; 
      });*/ 

     svg.selectAll("text") 
      .data(dataset) 
      .enter() 
      .append("text") 
      .text(function(d) { 
       return d; 
      }) 
      .attr("x", function(d, i) { 
       return i * (w/dataset.length) + 5; 
      }) 
      .attr("y", function(d) { 
       return h - (d * 4) + 15; 
      }) 
      .attr("font-family", "sans-serif") 
      .attr("font-size", "11px") 
      .attr("fill", "white"); 
    </script> 
</body> 

내가 정말 올바른 방향으로 날 가리 키도록 몇 가지 중 하나가 필요합니다. 데이터베이스의 정보를 가변 데이터 세트에 넣길 원합니다.

감사합니다, EmptyBox

+1

이 암호를 두 곳 이상에서 사용합니까? :) – Andreas

+0

@Arereas 그것은 내가 개발/물건에 사용하는 무작위로 생성 된 암호입니다. 내게 맡길 필요가 없습니다. – user1410980

답변

1

당신이 자바 스크립트로를 삽입 할 위치 주변의 JSP 태그를 추가합니다.

var dataset = [ 
    <% while (rst!=null && rst.next()) { %> 
     <%=rst.getInt("<column name>")%>, 
    <% } %> 
    ]; 
+0

이러한 진술을 사용하려면 가져올 항목이 있습니까? 나는 '메소드가 두 문장 모두에 대해 ResultSet 유형에 대해 정의되지 않았다. – user1410980

+1

죄송합니다, 난 그냥 ResultSet 코드에 대한 의사 코드를 사용했다. 올바른 함수는 다음과 같습니다. while (rst! = null && rst.next()) 및 rst.getInt ("") – bluedevil2k

+0

아, 하하! 감사. 나는 이것으로 정말로 고심하고있다. 나는 지금 그것을 작동시킬 수 있어야한다. 다시 한 번 감사드립니다! – user1410980

0

귀하의 경우에 가장 좋은 방법은 JSON 라이브러리입니다. 먼저

:JSP 페이지는 ResultSet의를 통해 데이터베이스에서 모든 데이터를 검색 할 수 있습니다.
두 번째 :JsonArray에 배열을 유지하고 다른 페이지로 배열을 보냅니다.

마지막 :은 자바 스크립트 함수에서 JsonArray를 수신 어디서나 페이지에서
을 채울 요소를 사용합니다.

관련 문제