首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >c3图表工具提示不会移动

c3图表工具提示不会移动
EN

Stack Overflow用户
提问于 2016-08-20 00:44:35
回答 1查看 172关注 0票数 0

我一直在努力使图形化工作,所有的数据似乎都是图形化的,但是工具提示并没有从最右边移动。当然,这是一个问题,因为我不能在特定点上鼠标查看数据。

下面是一个JS小提琴示例,说明正在发生的事情:https://jsfiddle.net/kp7eyf8o/6/

注意:由于某种原因,堆栈溢出JSfiddle给了我一个错误,但是应该会显示我的问题。

代码语言:javascript
运行
复制
var chart = c3.generate({
  bindto: '#test',
  data: {
    x: 'x',
    columns: [
      ['x', '2016-01-01', '2016-02-02', '2016-03-03', '2016-04-04', '2016-05-05', '2016-06-06', '2016-07-07', '2016-08-08', '2016-09-09', '2016-10-10', '2016-11-11', '2016-12-12'],
      ['2016 Actual', 12873666.64, 15976835.94, 19232540.28, 23649495.4, 26338636.36, 29496799.84, 43801703.66, 4263924.64, 5788580.3, ],
      ['2016 Projected', 3916752.11, 4626643.23, 5146264.25, 6148854.32, 6640724.57, 7409783.48, 8263054.46, 8488001.54, 8837809.1, 9068047.68, 9402019.15, 9513505.72, ],
      ['2015 Actual', 3256870.0, 3825580.0, 4394290.0, 5550000.0, 6044000.0, 7100000.0, 7700000.0, 8154000.0, 8860000.0, 9200000.0, 9500000.0, 9600328.45, ]
    ],
    colors: {
      '2016 Actual': '#2cd554',
      '2016 Projected': '#1bc4fc',
      '2015 Actual': '#fdaf5a'
    }
  },
  axis: {
    x: {
      type: 'timeseries',
      tick: {
        culling: false,
        format: '%b'
      }
    },
    y: {
      tick: {
        format: d3.format("$,.2f")
      }
    }
  },
});
代码语言:javascript
运行
复制
<link href="https://rawgit.com/masayuki0812/c3/master/c3.css" rel="stylesheet" />
<script src="https://rawgit.com/masayuki0812/c3/master/c3.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.3.12/d3.min.js"></script>


<div id="test"></div>

我看到有人提到使用'xs:{x…y…}‘,但我没能做到这一点。我需要X轴是日期(现在是硬编码的,但在我的应用程序中,我使用的是与我正在循环的一个数据集相关联的日期),Y轴是$。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-08-20 03:55:45

当将不同长度的数据数组输入列时,C3工具提示似乎会中断。您可以尝试将空值放入较短的数组中,以便工具提示可以正确移动。JS Fiddle:https://jsfiddle.net/stancheta/7zgny2yd/

代码语言:javascript
运行
复制
['2016 Actual', 12873666.64, 15976835.94, 19232540.28, 23649495.4, 26338636.36, 29496799.84, 43801703.66, 4263924.64, 5788580.3, null, null, null],
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39049436

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档