0

私はJavaScriptが初めてです。w2ui パネルを使用して、D3.js を使用したデータ視覚化用の Web ページを作成したいと考えています。これは私のコードです:

<!DOCTYPE html>
<html>
<head>
    <title>W2UI Demo: layout-2</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://rawgit.com/vitmalina/w2ui/master/dist/w2ui.min.js"></script>
    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <link rel="stylesheet" type="text/css" href="http://rawgit.com/vitmalina/w2ui/master/dist/w2ui.min.css" />
</head>
<body>

<div id="layout" style="width: 100%; height: 400px;"></div>

<script type="text/javascript">
$(function () {
    var pstyle = 'border: 1px solid #dfdfdf; padding: 5px;';
    $('#layout').w2layout({
        name: 'layout',
        padding: 4,
        panels: [
            { type: 'top', size: 50, resizable: true, style: pstyle, content: 'top' },
            { type: 'left', size: 200, resizable: true, style: pstyle, content: 'left' },
            { type: 'main', style: pstyle, content: 'main' },
            { type: 'right', size: 200, resizable: true, style: pstyle, content: 'right' }
        ]
    });
});
  
  
     d3.select("body")
   .append("svg")
   .append("rect")
   .attr("width",50)
   .attr("height",200)
   .style("fill","blue")

     
</script>

</body>
</html>

私の質問は、w2ui パネルの左側のペイン (または指定された任意のペイン) に長方形を描画するように D3js を指定する方法です。ありがとうございました!

4

1 に答える 1