标签: zingchart
在ZingChart上自定义x轴
我想使用ZingChart绘制一个与此类似的图形:
直到现在我能做的最好的是:
资源:
{
"graphset": [{
"type": "line",
"series": [
{
"values":[[1,218.2], [2,121.7], [4,62.27], [8,34.37], [16,19.79], [20,16.52], [32,17.1], [40,16.11], [64,91.9]]
}
],
"scale-x":{
"values":[1,2,4,8,16,20,32,40,64]
}
}]
}
如何将x-ticks的位置固定为与x值相同？
推荐指数
解决办法
查看次数
我的Zingchart没有显示,有什么不对？
这是下面的代码,
首先我从数据库中获取数据:
<?php
//getDBConnect function
require 'dbfunction.php';
//Get ID from form
$id = $_GET['staffid'];
//connect to database
$con = getDBConnect();
if(!mysqli_connect_errno($con)){
$sqlQueryStr =
"SELECT a.ai_Name, r.duration " .
"FROM report AS r, academicinstitution AS a " .
"WHERE r.staff_Id = '$id' " .
"AND r.ai_Id = a.ai_Id ";
$result = mysqli_query($con,$sqlQueryStr);
mysqli_close($con);
} else {
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
//Get data into array
$emparray = array();
while ($row = mysqli_fetch_assoc($result)) {
$emparray[] = $row; …推荐指数
解决办法
查看次数
边界处的Zing散点图节点被切断
我在我的应用程序中使用zing chart with scatter&Line chart,一切正常,但唯一的问题是散点图节点圆圈在图表的最末端被切断.
尝试增加保证金,设置偏移量,z指数并且到目前为止没有任何效果,任何解决方案都表示赞赏.
此致,Smruti
推荐指数
解决办法
查看次数
如何在zingcharts-angularjs中渲染两个y轴？
我正在尝试使用zingcharts-angularjs指令制作具有双y轴的混合图表.
对于双Y轴,您遵循'scale-y-2'模式,但它在我的AngularJS应用程序中不起作用.有谁知道如何在zingcharts-angularjs中渲染两个y轴？
推荐指数
解决办法
查看次数
ZingChart JS - 获取可见节点
我使用ZingChart库创建了一个Graph ,一切都按预期工作.该图用于显示特定插座随时间的功耗.
加载图表后,系统会显示该时间段的kWh消耗量.
用户可以放大和缩小图形,当发生这种情况时,我想显示图表中显示的那段时间的功耗.
我正在使用缩放事件:
zingchart.render({
id:'chartDiv',
data:graphset,
height:500,
events:{
zoom:function(p){
console.log(p);
console.log(zingchart.exec(p.id, 'getseriesdata', {}));
console.log(zingchart.exec(p.id, 'getseriesvalues', {}));
console.log(zingchart.exec(p.id, "getplotvalues", {}));
}
},
width:"100%"
});
当我放大或缩小时,函数getseriesdata,getseriesvalues和getplotvalues总是返回完整的图形值,而不仅仅是可见的值.
p对象给出了新的x和y限制,但我找不到使用它们来获取可见值的方法.
有没有人这样做过？
很感谢任何形式的帮助.
谢谢!
推荐指数
解决办法
查看次数
ZingChart根据X-Scale更改绘图CSS
我正在使用ZingChart和AngularJS.
我有一个简单的图表,但我想我的情节是红色的,如果它是在过去(如果x尺度日期<当前日期).
我发现我可以设置一些规则
"plot":{
"rules":[
{
"rule":"%v 20 && %v < 30",
"line-color":"#f93",
"line-width":"8",
"line-style":"dashed"
},
]
如果情节值在20-30之间,哪个会改变css.我的问题是 - >如何更改绘图背景颜色依赖X刻度值？我无法在情节属性上引用x-scale propery ..
推荐指数
解决办法
查看次数
如何使用动态数据创建AngularJS图表
嗨我正在尝试一个显示政治推文情绪的网页.我正在尝试为情绪统计创建一个图表.我正在使用Zingchart,我能够创建静态数据,但我无法创建动态数据.
这是我用于插入带有数组chartdata的静态数据的代码.
<div class="row">
<div class="col-sm-12">
<div ng-init="chartdata = [[1167],[456],[990]]">
<zingchart id="chart-1" zc-values="chartdata" zc-json="myJson"
zc-width="100%" zc-height="568px"></zingchart>
</div>
</div>
</div>
它工作正常,但我想使用来自angularjs的数据而不是静态值.例如:我试图做这样的事情,但它不起作用
<div class="row">
<div class="col-sm-12">
<div ng-init="chartdata =[[{{politicianData.stats.total_positive}}],[{{politicianData.stats.total_negative}}],[{{politicianData.stats.total_neutral}}]]">
<zingchart id="chart-1" zc-values="chartdata" zc-json="myJson" zc-width="100%" zc-height="568px"></zingchart>
</div>
</div>
</div>
如何从角度控制器获取promise数组数据中的数据？
这是我的政治家 - 控制者:
angular.module('myapp')
.controller('PoliticianController', function($scope, PoliticianData, Politician, searchService, utilService) {
var politicianData = new Politician(PoliticianData);
politicianData.$promise.then(function (result) {
$scope.politicianData = result;
});
$scope.myJson = {
globals: {
shadow: false,
fontFamily: "Verdana",
fontWeight: "100"
},
type: "pie",
backgroundColor: "#fff",
legend: {
layout: …推荐指数
解决办法
查看次数
Zing饲料在1个图表中绘制多个系列
我想在ZingChart Feed中绘制2个系列数据.下面是我的脚本代码.
<script>
var chartData = {
"type":"line",
"refresh": {
"type": "feed",
"transport": "js",
"url": "feed()",
"interval": 1000
},
"series":[
{
"values":[]
},
{
"values":[]
}
]
};
window.onload = function() {
zingchart.render({
id: "chartDiv",
data: chartData,
height: 600,
width: "100%"
});
};
window.feed = function(callback) {
$.ajax({
type: "GET",
dataType: "json",
headers: {
Accept: "application/json",
"Access-Control-Allow-Origin": "*"
},
url: "/PerformanceMonitor/showProcessUsage/${processName}",
success: function (data) {
var mem = data.mem.size/100000;
var tick = {
plot0: parseInt(mem)
};
callback(JSON.stringify(tick));
var tick2 = …推荐指数
解决办法
查看次数
Zingchart - 将功能传递给工具提示
是否可以将函数传递给Zingchart Json中的工具提示键？
到目前为止我尝试了以下内容:
$scope.applyTooltip = function (timestamp) {
console.log(timestamp);
var tooltip = "<div>";
var data = {
timestamp1: {
param1: "bla",
param2: "foo,
},
...
}
for(var param in data){
console.log(param);
tooltip += param+": "+data[param]+"<br>";
}
tooltop += "</div>;
return tooltip;
}
$scope.graphoptions = {
//...
//just displaying the relevant options
plot: {
"html-mode": true,
tooltip: $scope.applyTooltip("%kt"),
}
}
}
但是函数得到字符串"%kt",而不是悬停的Plot所需的X值.那么如何在函数中传递X值呢？
推荐指数
解决办法
查看次数
如何使用ZingChart创建此图表
我正在尝试用ZingChart创建一个看起来像这样的图表.
我已经按照我能想到的方式调整了条形图,但我仍然没有接近.
ZingChart可以使用此图表吗？
推荐指数
解决办法
查看次数