使用d3.layout.stack()从图层访问自定义坐标

山姆·克劳斯

我有以下形式的数据数组:

_data = [
    {key: <String>, values: [<number>...]}
]

如果每个JSON对象中的“值”变量是JSON坐标数组(即“ x:?,y:?”),则可以使用以下代码:

d3.layout.stack()
    .values(function(d) {
        return d.values;
    });

相反,我需要从每个图层的values数组中读取x作为values数组中的索引,并将y作为数字。像这样:

_data = [
    {key: "oranges", values: [5, 6, 8]},
    {key: "bananas", values: [2, 1, 9]}
]

becomes

"oranges": (0, 5), (1, 6), (2, 8);
"bananas": (0, 2), (1, 1), (2, 9);

如何才能做到这一点?

高积云

如果我正确理解了您的问题,那么您正在寻找合适的访问器函数来从D3的堆栈布局中访问您的特定数据格式。下面的代码应该可以满足您的需求:

d3.layout.stack()
    .values(function(d) {
        return d.values.map(function(y, i) {
            return { "x": i, "y": y };
        });
    });

的调用.map()将转换您的data.values数组,并返回一个数组,该数组由将对象xy坐标设置为您指定的值的对象组成

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用D3的自定义布局

来自分类Dev

使用图层列表自定义绘图

来自分类Dev

D3 DataMaps(或jvectormap):如何通过坐标将自定义对象放置在地图上

来自分类Dev

数据与d3.stack.layout()连接

来自分类Dev

谷歌地图使用 d3 路径作为图层使用 (d3 v4)

来自分类Dev

使用 d3 和 dc.js 自定义时间线刻度

来自分类Dev

Vue 使用自定义 d3 事件触发更新

来自分类Dev

如何使用图层列表创建自定义背景

来自分类Dev

使用自定义图层保存Keras模型

来自分类Dev

使用自定义位置扩展图层避开指定区域

来自分类Dev

使用d3 v4.0重新创建Cluster Force Layout

来自分类Dev

Float Layout使用Kivy添加自定义大小的小部件

来自分类Dev

d3自定义时间间隔

来自分类Dev

未选择D3自定义属性

来自分类Dev

D3自定义文字标签轴

来自分类Dev

自定义D3 LineChart中的刻度线

来自分类Dev

d3 自定义数字格式

来自分类Dev

使用THREE.js通过坐标自定义3D对象

来自分类Dev

您如何使用D3访问对象数组?

来自分类Dev

使用变量访问D3中的嵌套JSON键

来自分类Dev

如何使用d3访问JSON数据?

来自分类Dev

使用findViewById访问自定义视图

来自分类Dev

使用自定义坐标截取屏幕截图

来自分类Dev

使用D3.js layout.stack()制作标准化的堆叠条形图

来自分类Dev

使用d3.layout.stack()并解析csv的条形图

来自分类Dev

是否可以使用D3 JS在Hue中创建自定义窗口小部件?

来自分类Dev

d3.layout.stack()出现“摆动”偏移问题

来自分类Dev

d3版本4中的d3.layout.treemap

来自分类Dev

自定义3D图形引擎...在哪里绘制Z坐标