All geek questions in one place

ZingChart Release Date

When I increment the date on the x axis, the graph gets stuck.

This only happens when I work with long ones. It works great with dates. I'm new to zing diagrams and I'm not sure what I'm doing wrong

  zingchart.exec('myChart', 'zoomtovalues', {
       'xmin':1425312000000,
       'xmax':1425657600000,
 });

and my meanings

  "values": [
    [1425225600000,1],
    [1425312000000,1],
    [1425398400000,1],
    [1425484800000,1],
    [1425571200000,1],
    [1425657600000,1],
    [1425744000000,1],
    [1425826800000,1],
    [1425913200000,1],
    [1425999600000,1]
    ],

UPDATE

The reason the diagram was looping was a step, it works without scrollX

scaleX:{
label:{},
minValue:1425196800000,
step:"day",
  transform: {
    type: 'date',
  all:"%m/%d/%y"
  }
},
+4
source share
1 answer

You did not provide a lot of information regarding the configuration of the chart or chart. Based on what you say, I accept the wild assumption that you are asking. If I am wrong, I feel that I need to follow.

, scrollX. . - preview. .

, scrollX, preview zooming . https://www.zingchart.com/docs/tutorials/interactive-features/chart-zoom-pan-scroll/

https://www.zingchart.com/docs/api/json-configuration/graphset/scroll-x-scroll-y/

https://www.zingchart.com/docs/api/json-configuration/graphset/preview/

var myConfig = {
 	type: 'line', 
    title: {
      text: 'After 2 seconds call API method \`zoomtovalues\`'
    },
 	scaleX:{
 	  transform: {
 	    type: 'date',
 	  }
 	},
 	scrollX:{},
	series: [
		{
			values: [
        [1425225600000,1],
        [1425312000000,1],
        [1425398400000,1],
        [1425484800000,1],
        [1425571200000,1],
        [1425657600000,1],
        [1425744000000,1],
        [1425826800000,1],
        [1425913200000,1],
        [1425999600000,1]
      ],
		}
	]
};

setTimeout(function() {
 zingchart.exec('myChart', 'zoomtovalues', {
   'xmin':1425312000000,
   'xmax':1425657600000,
 });
}, 2000);

zingchart.render({ 
	id: 'myChart', 
	data: myConfig, 
	height: '100%', 
	width: '100%' 
});
html, body {
	height:100%;
	width:100%;
	margin:0;
	padding:0;
}
#myChart {
	height:100%;
	width:100%;
	min-height:150px;
}
.zc-ref {
	display:none;
}
<!DOCTYPE html>
<html>
	<head>
	<!--Assets will be injected here on compile. Use the assets button above-->
		<script src= "https://cdn.zingchart.com/zingchart.min.js"></script>
	</head>
	<body>
		<div id="myChart"><a class="zc-ref" href="https://www.zingchart.com">Powered by ZingChart</a></div>
	</body>
</html>
+4

Source: https://habr.com/ru/post/1665515/

More articles:


All Articles