首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >dc.js不显示y轴

dc.js不显示y轴
EN

Stack Overflow用户
提问于 2019-02-26 06:17:09
回答 1查看 102关注 0票数 2

我有一组数据,我想在折线图上呈现该频率

数据解析

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var volumeChart = dc.barChart('#monthly-volume-chart');
var dateFormatSpecifier = '%Y-%m-%dT%H:%M:%S.000Z';
    var dateFormat = d3.timeFormat(dateFormatSpecifier);
    var dateFormatParser = d3.timeParse(dateFormatSpecifier);
    var numberFormat = d3.format('.2f');

    data.forEach(function (d) {
        d.dd = dateFormatParser(d.timestamp);
        d.minute = d3.timeMinute(d.dd)
        //coerce to number with a +
    });

维度分组

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var freqByMins = ndx.dimension(function (d) {
    return d.minute;
});
var aa = freqByMins.group()
console.log(aa.all())
var freqByMinsGroup = aa.reduceCount(function (d) {
    return d.minute;
});
console.log(freqByMinsGroup.all())

查看freqByMinsGroup.all(),我得到了以下数据

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
0: {key: Thu Feb 21 2019 05:29:00 GMT+0800 (Singapore Standard Time), value: 2}
1: {key: Thu Feb 21 2019 05:30:00 GMT+0800 (Singapore Standard Time), value: 5}
2: {key: Thu Feb 21 2019 05:31:00 GMT+0800 (Singapore Standard Time), value: 6}
3: {key: Thu Feb 21 2019 05:32:00 GMT+0800 (Singapore Standard Time), value: 3}
4: {key: Thu Feb 21 2019 05:33:00 GMT+0800 (Singapore Standard Time), value: 1}
5: {key: Thu Feb 21 2019 05:34:00 GMT+0800 (Singapore Standard Time), value: 1}
6: {key: Thu Feb 21 2019 05:35:00 GMT+0800 (Singapore Standard Time), value: 3}
7: {key: Thu Feb 21 2019 05:36:00 GMT+0800 (Singapore Standard Time), value: 4}
8: {key: Thu Feb 21 2019 05:38:00 GMT+0800 (Singapore Standard Time), value: 4}
9: {key: Thu Feb 21 2019 05:39:00 GMT+0800 (Singapore Standard Time), value: 7}
length: 10

呈现图表

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 volumeChart.width(960)
    .height(100)
    .margins({top: 10, right: 10, bottom: 20, left: 40})
    .dimension(freqByMins)
    .group(freqByMinsGroup)
    .transitionDuration(500)
    .elasticY(true)

    .x(d3.scaleTime().domain([new Date(2019, 2, 21, 5, 29, 0), new Date(2019, 2, 21, 5, 40, 0)]))
    .xAxis();

但是,我的交叉过滤器图表没有呈现任何y轴。

附件是一张图片

EN

回答 1

Stack Overflow用户

发布于 2019-02-27 05:28:19

对于任何可能正在关注这个问题的人来说,

错误出现在html中。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<div class="row">
    <div id="monthly-move-chart">
        <strong>Monthly Index Abs Move & Volume/500,000 Chart</strong>
        <span class="reset" style="display: none;">range: <span class="filter"></span></span>
        <a class="reset" href="javascript:moveChart.filterAll();volumeChart.filterAll();dc.redrawAll();"
           style="display: none;">reset</a>

        <div class="clearfix"></div>
    </div>
</div>

当我使用另一个索引时

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<div id="quarter-chart">
        <strong>Quarters</strong>
        <a class="reset" href="javascript:quarterChart.filterAll();dc.redrawAll();" style="display: none;">reset</a>

        <div class="clearfix"></div>
    </div>

啊,真灵。我猜这是因为它依赖于另一个图表。我实际上是在修改来自https://dc-js.github.io/dc.datatables.js/的示例,当我没有真正检查html时,这可能会导致一些有趣的错误

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/54879469

复制
相关文章
echarts的双y轴显示
第一步: 引入echarts import echarts from "echarts"; Vue.prototype.$echarts = echarts //引入组件(全局引入) 第二步: id绑定 <div id="pie"> /// pie 用于存放所要绘制的图形 第三步: 配置options,创建echarts实例 option1: { title: { text: "双坐标轴事例", //标题 show: f
用户4344670
2019/08/28
4.9K0
如何让 PowerBI Y 轴完美显示
在 PowerBI 原生可视化方面,一直有个小 BUG 的存在,那就是 Y 轴不能正常良好显示,如下:
BI佐罗
2021/10/12
4.2K0
echarts Y轴数据显示不全问题
坐标轴刻度标签的显示间隔,在类目轴中有效。 默认会采用标签不重叠的策略间隔显示标签,可以设置成 0 强制显示所有标签。
李维亮
2021/07/08
4.1K0
python双Y轴
import matplotlib.pyplot as plt import numpy as np x = np.arange(0., np.e, 0.01) y1 = np.exp(-x) y2 = np.log(x) fig = plt.figure() sns.set_style('white') ax1 = fig.add_subplot(111) ax1.plot(x, y1) ax1.set_ylabel('Y values for exp(-x)') ax1.set_title("Dou
用户1359560
2018/08/27
1.3K0
python双Y轴
echart 双折线 双Y轴, 折线,柱形 双Y轴图
双折线图 双Y轴 双坐标系坐标 option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: [ {name: '数值',type: 'value', interval: 300, position:'left'}, {type: 'value', pos
拿我格子衫来
2022/01/24
1.9K0
echart 双折线 双Y轴, 折线,柱形 双Y轴图
echarts实现多个y轴
在日常画图,如柱形图、折线图这些图表,需要两组或者两组以上不同的数据,且数据的大小有一定的差异时,通常是需要用两个y轴来体现的。
算法与编程之美
2022/02/17
1.9K0
Echarts多Y轴探索
ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。
孟君
2019/09/24
4.8K0
Echarts多Y轴探索
Echarts设置y轴值间隔
需求:如图,y轴之间的距离太小,这样就太过于拥挤了,现在要修改echarts里面的属性,设置y轴值间隔让图表看上去舒服一些。
王小婷
2019/03/22
9.2K0
Echarts设置y轴值间隔
Observablehq D3 的图标 Y 轴数据显示不完整
在上面的例子中,你可以在线修改下面的链接:https://observablehq.com/@yuchenghu/us-covid-19-daily-tested-cases-covid-19
HoneyMoose
2020/05/13
1.2K0
Observablehq D3 的图标 Y 轴数据显示不完整
origin如何绘制双y轴柱状图_Graphpad柱状图双Y轴
tips:origin横坐标的标注如何修改成双行显示呢? shift+enter,可以换行
全栈程序员站长
2022/11/11
3.3K0
origin如何绘制双y轴柱状图_Graphpad柱状图双Y轴
Stata | 调整 Y 轴文字顺序
鸽了一个暑假,最近试着渐渐更新起来。今天分享一个被好多强迫症小伙伴问到的问题:用 Stata 画图怎么更改 Y 轴文本的顺序。如下图所示,默认绘图的文字为每个字从左到右,但是一般论文在 Y 轴顶端的由上至下的排列。
PyStaData
2021/09/14
3.3K0
Stata | 调整 Y 轴文字顺序
android之绕Y轴旋转
转自:http://lzyfn123.iteye.com/blog/1426844
forrestlin
2022/04/02
1.1K0
Dygraph 自定义 y 轴刻度
我们在使用 Dygraph 的时候,假如需要设定固定的 Y 轴的刻度,那需要怎么做呢?
Jimmy_is_jimmy
2023/08/09
1920
Dygraph 自定义 y 轴刻度
OriginLab绘制分组双Y轴图形
请注意,本文编写于 938 天前,最后修改于 123 天前,其中某些信息可能已经过时。
曼亚灿
2023/05/17
1.1K0
OriginLab绘制分组双Y轴图形
origin双y轴柱状图_双Y轴柱状图和折线图
做双Y轴柱状图时,一开始是将左Y轴数据和右Y轴数据放在了两个sheet中,一顿操作最后发现两个柱要么重合要么有间距,怎么调都不行,就像下图这样。。。
全栈程序员站长
2022/11/10
1.8K0
origin双y轴柱状图_双Y轴柱状图和折线图
ROOT-画双Y轴图表
字号字体:当图片缩放占用单栏时,宽度约7.8cm,对应图片内字号与文章内字号大致相同,即10号Times New Roman。
梁佐佐
2021/07/20
2.3K5
ROOT-画双Y轴图表
MATLAB学习笔记 plotyy双y轴
t=0:0.1:8; [ax,h1,h2]=plotyy(t,sin(t),t,cos(t)); % plotyy(X1,Y1,X2,Y2):以左、右不同纵轴绘制X1-Y1、X2-Y2两条曲线。 set(h1,’linestyle’,’-‘,’marker’,’o’,’color’,’r’); set(h2,’linestyle’,’:’,’marker’,’x’,’color’,’b’);
全栈程序员站长
2022/07/05
2K0
MATLAB学习笔记 plotyy双y轴
Matlab绘制包含双Y轴的图
创建左右两侧都有 y 轴的坐标区。yyaxis left 命令用于创建坐标区并激活左侧。后续图形函数(例如 plot)的目标为活动侧。绘制数据对左侧 y 轴的图。
用户9925864
2022/07/27
2.1K0
Matlab绘制包含双Y轴的图
R画图y轴范围太大时,如何局部压缩坐标轴?
用 R 画图的时候,如果 y 轴存在个别非常大或非常小的值,或者当中的数值存在非常大差异的时候,画出的图很容易产生误导效果,使人忽略当中某一部分信息。
实验盒
2021/09/22
4K1
R画图y轴范围太大时,如何局部压缩坐标轴?
Matplotlib双Y轴折线图小实例
fig,ax1 = plt.subplots(figsize=(12,9))创建画布,有点类似于ggplot2的ggplot()函数的作用;figsize参数用来控制图片长和宽,但是单位是啥还没搞明白
用户7010445
2020/03/03
2.6K0

相似问题

如何更改Y轴dc.js

21

dc.js图形不会显示线条和y轴值

10

dc.js x轴不刷新

12

dc.js:如何在单线图的两边显示y轴?

13

dc.js按y轴/值排序序数线图

30
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文