show empty data points on anychart line graph with dateTime axis - anychart

Question

I have a simple dataset with time series data points that i would like to plot on a per-second accuracy. But the data is ticker data so not every point is represented, only on price change.
Here is a simple example where the price goes 14:08, 14:09, 14:10 ... 14:15
https://playground.anychart.com/ZIT0QuAF/1
Is it possible to display the gap/time passed between data points, either with blank space or probably better the x-axis for each second and just an extended line ( maybe dotted or different colour ) connecting the points.
Thank you.

Answer 1

Now I see your requirements. You can achieve that very easy. As a default and as in the sample you provided, you use the ordinal based scale. To better illustrate that there was some time passed in between ticker points you should use scatter based scale. Just use the following line in your code:
chart.xScale('scatter');
Now all points follow strictly the time coordinate and all gaps between are showed. Also, all points are connected with dotted line. Please, check a sample below
anychart.onDocumentReady(function() {
// create data table on loaded data
var table = anychart.data.table("epoch");
table.addData([
{
last: 0.00000462,
epoch: 1520260206263,
vol: 0,
volBase: 0,
prcnt: 0,
volDiff: 0,
percentFromStart: 0.00000000
},
{
last: 0.00000558,
epoch: 1520260207391,
vol: 0,
volBase: 0,
prcnt: -17.20430108,
volDiff: NaN,
percentFromStart: 20.77922078
},
{
last: 0.00000585,
epoch: 1520260208131,
vol: 0,
volBase: 0,
prcnt: -4.61538462,
volDiff: NaN,
percentFromStart: 26.62337662
},
{
last: 0.00000680,
epoch: 1520260209293,
vol: 0,
volBase: 0,
prcnt: -13.97058824,
volDiff: NaN,
percentFromStart: 47.18614719
},
{
last: 0.00000693,
epoch: 1520260210752,
vol: 0,
volBase: 0,
prcnt: -1.87590188,
volDiff: NaN,
percentFromStart: 50.00000000
},
{
last: 0.00000657,
epoch: 1520260215326,
vol: 0,
volBase: 0,
prcnt: 5.47945205,
volDiff: NaN,
percentFromStart: 42.20779221
},
{
last: 0.00000700,
epoch: 1520260225028,
vol: 0,
volBase: 0,
prcnt: -6.14285714,
volDiff: NaN,
percentFromStart: 51.51515152
},
{
last: 0.00000657,
epoch: 1520260239317,
vol: 0,
volBase: 0,
prcnt: 6.54490107,
volDiff: NaN,
percentFromStart: 42.20779221
},
{
last: 0.00000624,
epoch: 1520260240762,
vol: 0,
volBase: 0,
prcnt: 5.28846154,
volDiff: NaN,
percentFromStart: 35.06493506
},
{
last: 0.00000723,
epoch: 1520260244015,
vol: 0,
volBase: 0,
prcnt: -13.69294606,
volDiff: NaN,
percentFromStart: 56.49350649
},
{
last: 0.00000740,
epoch: 1520260245557,
vol: 0,
volBase: 0,
prcnt: -2.29729730,
volDiff: NaN,
percentFromStart: 60.17316017
},
{
last: 0.00000740,
epoch: 1520260247146,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 60.17316017
},
{
last: 0.00000740,
epoch: 1520260258519,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 60.17316017
},
{
last: 0.00000740,
epoch: 1520260261733,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 60.17316017
},
{
last: 0.00000713,
epoch: 1520260262192,
vol: 0,
volBase: 0,
prcnt: 3.78681627,
volDiff: NaN,
percentFromStart: 54.32900433
},
{
last: 0.00000700,
epoch: 1520260263087,
vol: 0,
volBase: 0,
prcnt: 1.85714286,
volDiff: NaN,
percentFromStart: 51.51515152
},
{
last: 0.00000657,
epoch: 1520260264653,
vol: 0,
volBase: 0,
prcnt: 6.54490107,
volDiff: NaN,
percentFromStart: 42.20779221
},
{
last: 0.00000614,
epoch: 1520260288009,
vol: 0,
volBase: 0,
prcnt: 7.00325733,
volDiff: NaN,
percentFromStart: 32.90043290
},
{
last: 0.00000614,
epoch: 1520260295191,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 32.90043290
},
{
last: 0.00000740,
epoch: 1520260296127,
vol: 0,
volBase: 0,
prcnt: -17.02702703,
volDiff: NaN,
percentFromStart: 60.17316017
},
{
last: 0.00000749,
epoch: 1520260299736,
vol: 0,
volBase: 0,
prcnt: -1.20160214,
volDiff: NaN,
percentFromStart: 62.12121212
},
{
last: 0.00000749,
epoch: 1520260302084,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 62.12121212
},
{
last: 0.00000562,
epoch: 1520260304974,
vol: 0,
volBase: 0,
prcnt: 33.27402135,
volDiff: NaN,
percentFromStart: 21.64502165
},
{
last: 0.00000375,
epoch: 1520260323816,
vol: 0,
volBase: 0,
prcnt: 49.86666667,
volDiff: NaN,
percentFromStart: -18.83116883
},
{
last: 0.00000749,
epoch: 1520260327149,
vol: 0,
volBase: 0,
prcnt: -49.93324433,
volDiff: NaN,
percentFromStart: 62.12121212
},
{
last: 0.00000749,
epoch: 1520260328543,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 62.12121212
},
{
last: 0.00000749,
epoch: 1520260335547,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 62.12121212
},
{
last: 0.00000749,
epoch: 1520260338101,
vol: 0,
volBase: 0,
prcnt: 0.00000000,
volDiff: NaN,
percentFromStart: 62.12121212
}
]);
chart = anychart.stock();
chart.xScale('scatter');
var mappingLastPrice = table.mapAs({
'value': "last"
});
var series1 = chart.plot(0).line(mappingLastPrice);
series1.stroke('red','1', '2 10');
series1.markers(true);
series1.markers().fill('blue');
series1.name("Last Price");
chart.container('container').draw();
});
html, body, #container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-base.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-stock.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-ui.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-exports.min.js"></script>
<link href="https://cdn.anychart.com/releases/8.1.0/css/anychart-ui.min.css" rel="stylesheet"/>
<div id="container"></div>