Question

当我对x轴上的日期进行缩放时，图表会卡住。

只有在我使用longs时才会发生这种情况。有了日期，它工作正常。我是zing排行榜的新人，我不确定我做错了什么

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

我的价值观是

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

更新

图表被卡住的原因是步骤，它没有scrollX

scaleX:{
label:{},
minValue:1425196800000,
step:"day",
  transform: {
    type: 'date',
  all:"%m/%d/%y"
  }
},

Answer 1

您没有提供与图表或图表配置相关的更多信息。根据你所说的，我正在猜测你在问什么。如果我错了，请感觉要跟进。

您缺少的是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>

ZingChart缩放日期问题

1 个答案: