Tôi thuộc nhóm ZingChart và tôi rất vui được giúp bạn. Điều này chắc chắn có thể sử dụng các đối tượng đánh dấu kiểu "poly". Trong points mảng của các đối tượng đánh dấu, bạn cần phải xác định tất cả bốn điểm của hình chữ nhật, trong đó, hoàn toàn, sẽ giống như thế này:
[ [x1, y1], [x1, y2], [x2, y2], [x2, y1] ]
Bây giờ, nếu bạn đặt (x1, y1) giá trị của bạn và (x2, y2) đánh giá cao thành hai mảng, bạn có thể làm một cái gì đó như thế này để tạo ra các mảng cần thiết của 4 bộ tọa độ:
function getRectCoords(x1y1, x2y2){
var coordsArray = []; // Empty array to hold the 4 points
coordsArray.push(x1y1); // Push bottom left point, [x1, y1]
coordsArray.push( // Push top left point, [x1, y2]
[ x1y1[0], x2y2[1] ]
);
coordsArray.push(x2y2); // Push top right point, [x2, y2]
coordsArray.push( // Push bottom right point, [x2, y1]
[ x2y2[0], x1y1[1] ]
);
return coordsArray; // [ [x1, y1], [x1, y2], [x2, y2], [x2, y1] ]
}
Sau đó, trong ZingChart, bạn có thể gọi chức năng của bạn từ bên trong bảng xếp hạng JSON, như thế này:
...
"scale-y":{
"values":"0:10:1",
"markers":[
{
"type":"poly",
"background-color":"#EA212D",
"alpha":1.0,
"range":getRectCoords(first_x1y1, first_x2y2),
"value-range":true
}
]
}
...
Bạn có thể xem tất cả điều đó trong this demo.
Tôi không chắc dữ liệu của bạn trông như thế nào, nhưng bạn có thể thấy từ ví dụ trên rằng ZingChart khá linh hoạt và với một chút sáng tạo, bạn có thể thực hiện rất nhiều, đặc biệt khi bạn sử dụng JavaScript kết hợp với ZingChart.
Hãy cho tôi biết nếu tôi có thể làm bất cứ điều gì khác để trợ giúp!
