Drupal7+D3-在页面中嵌入圆形包可视化

Drupal 7 + D3 - embed circle-pack visualization in a page

本文关键字:可视化 Drupal7+D3-      更新时间:2023-09-26

我试图在Drupal 7基本页面中嵌入一个D3圆形包,但它出现在页面的错误部分-页脚下方。请参见此处:http://www.thedata.co/circlepackzoom10.我尝试过不同的主题,但没有什么不同。

我使用的是带有php过滤器的php-include方法:<?php include './sites/thedata.co/files/html/circle_packZoom-10.html';

我能够在节点体中嵌入一个D3图表,所以在某些情况下似乎可以做到。

JS控制台使用Chrome将内容区域定义为:<div class="field-item odd" property="content:encoded">。也不适用于Firefox。

以下是完整的代码:http://jsfiddle.net/cajmcmahon/9a5xaovv/

var pack = d3.layout.pack()
    .size([r, r])
    .children(function(d) {
        return d.values; // accessor for children
    })
    .value(function(d) {
        return d.values; // accessor for values
    });
//Declare SVG attributes
var svg = d3.select("body").append("svg")
    .attr("width", w)
    .attr("height", w)
    .append("g")
    .attr("transform", "translate(" + (w - r) / 2 + "," + (w - r) / 2 + ")");

有人知道如何将其放置在节点的主要内容区域中吗?谢谢

选择要放置图表的元素,而不是在d3中选择"body"。Select("body"(.append("svg"(.

类似于:

d3.select('#divID').append('svg') ... etc

因为这个方法只是将它附加到网站的body元素中。