search

epochjs / epoch

A general purpose, real-time visualization library.
http://epochjs.github.io/epoch
MIT License
4.97k stars 278 forks source link

tickFormat.right not working for time charts #164

Closed woozyking closed 9 years ago

woozyking commented 9 years ago

tickFormat.left in this case works, however.

This is with v0.6.0

Snippet:

$('#some-id').epoch({
  type: 'time.line',
  axes: ['right', 'bottom'],
  data: data,
  tickFormats: {
    right: function(d) {
      return '$' + (d / 100000).toFixed(3);
    }
  }
});
woozyking commented 9 years ago

Also confirmed not working for time.bar and time.area

jme783 commented 9 years ago

+1

rsandor commented 9 years ago

I am not sure why that would be happening, anyone free to look into this?

rsandor commented 9 years ago

@woozyking - I just tried this locally on chrome and the tickFormat.right seems to work just fine for me. Here's a full example (file is located in the epoch root directory):

<html>
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
  <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> -->
  <script src="dist/js/epoch.js"></script>
  <link rel="stylesheet" type="text/css" href="dist/css/epoch.css">
</head>
<body>

  <div class="epoch" id="event-bar-chart" style="width: 500px; height: 150px"></div>

  <script>
  var chart = new Epoch.Time.Area({
    el: '#event-bar-chart',
    axes: ['right', 'bottom'],
    tickFormats: {
      right: function (d) {
        return '$' + (d / 100000).toFixed(3);
      }
    },
    data: [
      // First series
      {
        label: "Series 1",
        values: [{time: 1370044800, y: 1000000}, {time: 1370044801, y: 1000000}]
      },
      // The second series
      {
        label: "Series 2",
        values: [{time: 1370044800, y: 780000}, {time: 1370044801, y: 98000}]
      }
    ]
  });
  chart.draw();
  </script>
</body>
</html>
woozyking commented 9 years ago

I'll try this on the plane on Monday (didn't put it clearly in the other thread), and let you know when I arrive.

— Runzhou Li (Leo)

On Mon, Oct 5, 2015 at 12:42 AM, Ryan Sandor Richards notifications@github.com wrote:

@woozyking - I just tried this locally on chrome and the tickFormat.right seems to work just fine for me. Here's a full example (file is located in the epoch root directory):

<html>
<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
  <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> -->
  <script src="dist/js/epoch.js"></script>
  <link rel="stylesheet" type="text/css" href="dist/css/epoch.css">
</head>
<body>
  <div class="epoch" id="event-bar-chart" style="width: 500px; height: 150px"></div>
  <script>
  var chart = new Epoch.Time.Area({
    el: '#event-bar-chart',
    axes: ['right', 'bottom'],
    tickFormats: {
      right: function (d) {
        return '$' + (d / 100000).toFixed(3);
      }
    },
    data: [
      // First series
      {
        label: "Series 1",
        values: [{time: 1370044800, y: 1000000}, {time: 1370044801, y: 1000000}]
      },
      // The second series
      {
        label: "Series 2",
        values: [{time: 1370044800, y: 780000}, {time: 1370044801, y: 98000}]
      }
    ]
  });
  chart.draw();
  </script>
</body>
</html>

Reply to this email directly or view it on GitHub: https://github.com/epochjs/epoch/issues/164#issuecomment-145428907

woozyking commented 9 years ago

Actually never mind. I just remember now what the problem is. The issue is that it's not formatting right axis as defined in tickFormat.right function.

woozyking commented 9 years ago

test html

This is what I got from the example, where the right axis labels are expected to have dollar sign in front

rsandor commented 9 years ago
screen shot 2015-10-05 at 7 02 55 am

This is very strange as I am able to get the $ to appear. What browser and browser version are you using to see these results?

woozyking commented 9 years ago

Latest stable Chrome on latest stable OS X.

I can only get the format working on basic charts.

— Runzhou Li (Leo)

On Mon, Oct 5, 2015 at 10:03 AM, Ryan Sandor Richards notifications@github.com wrote:

screen shot 2015-10-05 at 7 02 55 am

This is very strange as I am able to get the $ to appear. What browser and version are you using to see these results?

Reply to this email directly or view it on GitHub: https://github.com/epochjs/epoch/issues/164#issuecomment-145537115

rsandor commented 9 years ago

Are you still using 0.6.0? Did you try the new release 0.7.1?

woozyking commented 9 years ago

Oh yea I’m still using 0.6.0. Let me try 0.7.1.

— Runzhou Li (Leo)

在 2015年10月5日，10:12，Ryan Sandor Richards <notifications@github.com mailto:notifications@github.com> 写道：

Are you still using 0.6.0? Did you try the new release 0.7.1?

— Reply to this email directly or view it on GitHub https://github.com/epochjs/epoch/issues/164#issuecomment-145541202.

woozyking commented 9 years ago

Just confirmed that 0.7.1 works as expected. I guess this can be closed. It'd be good to know though which exact commit fixed the issue.

— Runzhou Li (Leo)

On Tue, Oct 6, 2015 at 2:03 AM, Leo Li runzhou.li@gmail.com wrote:

Oh yea I’m still using 0.6.0. Let me try 0.7.1. — Runzhou Li (Leo)

在 2015年10月5日，10:12，Ryan Sandor Richards <notifications@github.com mailto:notifications@github.com> 写道：

Are you still using 0.6.0? Did you try the new release 0.7.1?

— Reply to this email directly or view it on GitHub https://github.com/epochjs/epoch/issues/164#issuecomment-145541202.

rsandor commented 9 years ago

I will leave that as an exercise for the reader ;), closing.