HELP center can you format crosshair x values

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>ZingSoft Demo</title>

  <script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
  <style></style>
</head>

<body>
  <div id='myChart'></div>
  <script>
    ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];

    function formatKeyValuePairs() {
      var xyValues = [];
      var yValues = [35, 42, 67, 89, 25, 34, 67, 85];
      var currentDate = Date.now();
      for (var i = 0; i < yValues.length; i++) {
        xyValues.push([currentDate, yValues[i]]);
        currentDate += 24 * 60 * 60 * 1000;
      }

      return xyValues;
    }
    var myConfig = {
      type: "bar",
      title: {
        text: 'Custom Scale Labels'
      },
      crosshairX: {
        plotLabel: {
          headerText: '%kv',
          transform: {
            type: 'date', // yyyy-mm-dd hh:mm:ss
            all: '%Y-%mm-%dd %H:%i:%s'
          }
        },
        scaleLabel: { // adjst the scaleLabel separate from plotLabel
          transform: {
            type: 'date', // yyyy-mm-dd hh:mm:ss
            all: '%Y-%mm-%dd %H:%i:%s'
          }
        }
      },
      tooltip: {
        visible: false
      },
      scaleX: {
        transform: {
          type: 'date',
          all: "%Y-%mm-%dd" // yyyy-mm-dd
        },
        step: 'day',
        itemsOverlap: true,
        item: {
          angle: 45
        },
      },
      series: [{
        values: formatKeyValuePairs()
      }]
    };

    zingchart.render({
      id: 'myChart',
      data: myConfig,
      height: 400,
      width: '100%'
    });

    zingchart.bind(null, 'zoom', function(e) {
      if (e.action && e.action == 'viewall') {
        // if not data
        return false;
      }
    })
  </script>
</body>

</html>

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>ZingSoft Demo</title>

  <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
</head>

<body>
  <div id='myChart'></div>
</body>

</html>

function formatKeyValuePairs() {
  var xyValues = [];
  var yValues = [35, 42, 67, 89, 25, 34, 67, 85];
  var currentDate = Date.now();
  for (var i = 0; i < yValues.length; i++) {
    xyValues.push([currentDate, yValues[i]]);
    currentDate += 24 * 60 * 60 * 1000;
  }

  return xyValues;
}
var myConfig = {
  type: "bar",
  title: {
    text: 'Custom Scale Labels'
  },
  crosshairX: {
    plotLabel: {
      headerText: '%kv',
      transform: {
        type: 'date', // yyyy-mm-dd hh:mm:ss
        all: '%Y-%mm-%dd %H:%i:%s'
      }
    },
    scaleLabel: { // adjst the scaleLabel separate from plotLabel
      transform: {
        type: 'date', // yyyy-mm-dd hh:mm:ss
        all: '%Y-%mm-%dd %H:%i:%s'
      }
    }
  },
  tooltip: {
    visible: false
  },
  scaleX: {
    transform: {
      type: 'date',
      all: "%Y-%mm-%dd" // yyyy-mm-dd
    },
    step: 'day',
    itemsOverlap: true,
    item: {
      angle: 45
    },
  },
  series: [{
    values: formatKeyValuePairs()
  }]
};

zingchart.render({
  id: 'myChart',
  data: myConfig,
  height: 400,
  width: '100%'
});

zingchart.bind(null, 'zoom', function(e) {
  if (e.action && e.action == 'viewall') {
    // if not data
    return false;
  }
})