I'm reading docs but there seems to be no parameters to do what i need: I have a plain bar chart and I need to make some bars blink depending on threshold configuration. Is there any plugin or secret parameter to obtain this?
As far as I understand, you want to have a blinking bar.
So what you can do is create the bar and then dynamically update its background-color from 'transparent' to the original color periodically using a timer.
This will create a blinking effect.
Ok, so if you want the first bar to blink:
let count = 0;
setInterval(() => {
if(count % 2 === 0) {
myChart.data.datasets[0].backgroundColor[0] = 'transparent';
myChart.update();
}
else {
myChart.data.datasets[0].backgroundColor[0] = '#FFC857';
myChart.update();
}
count++;
}, 2000);
I don't know if there is a better solution for it, but this is the first thing that came to my mind.
Related
I have this calendar I'm working on in jetpack compose. I have gotten some help with placement in rows and stuff like that using weight. The problem is though that I'm trying to make an item of a month in the calendar and place that in a LazyRow but i think it has to do with that lazy rows are scrollable so the weight function for the box with the text in it makes it so that no text shows up if the code looks like this...
fun CalendarRowItem(calendarSize: Int, initWeekday: Int, textColor: Color, clickedColor: Color){
var dayCounter: Int = 1
var week: Int = 1
var _initWeekday = initWeekday
Column() {
while(dayCounter <= calendarSize){
Row(modifier = Modifier.fillMaxWidth().padding(5.dp)) {
if(initWeekday > 0){
repeat(initWeekday){
Spacer(modifier = Modifier.weight(1f))
}
}
for (i in week..(7 - _initWeekday)){
if(dayCounter <= 31){
Box(
contentAlignment = Alignment.Center,
modifier = Modifier
.padding(10.dp)
.background(clickedColor, CircleShape)
.clickable { }
) {
Text(text = dayCounter++.toString(), color = textColor )
}
}else{
Spacer(modifier = Modifier.weight(1f))
}
_initWeekday = 0
}
}
}
}
}
but without the weight i cant place the dates correctly plus i have no clue how i would make it so that only one item is visible in the screen at once?
I think using HorizontalPager instead of LazyRow may suit better in this case: it has pagination, as you probably don't need your scroll to stop in between the month, and won't have such a problem out of the box, as same modifier as I suggest you below in applied by the component.
Below is a general answer to the problem, as you still may face it in other cases.
That indeed happens because the parent is horizontally scrollable.
In such case Modifier.fillMaxWidth, as well as Modifier.weight with fill parameter set to true (it's default value) has no effect, as parent width constraint is equal to infinity.
You need to restrict parent width. In this case Modifier.fillParentMaxWidth() can be used on the container: it'll make the view width be equal to the LazyRow width - the part of scroll view which takes exactly "one screen".
As this modifier is defined on LazyItemScope, you have two options to apply it:
Define CalendarRowItem on the scope, in this case CalendarRowItem will only be available to use from lazy view item.
fun LazyItemScope.CalendarRowItem(/* ... */) {
// ...
Column(Modifier.fillParentMaxWidth()) {
// ...
}
}
Add a modifier parameter for CalendarRowItem and pass Modifier.fillParentMaxWidth from item scope:
fun CalendarRowItem(/* ... */, modifier: Modifier) {
// ...
Column(modifier) {
// ...
}
}
items(yourItems) { item ->
CalendarRowItem(
/* ... */,
modifier = Modifier.fillParentMaxWidth()
)
}
I have a performance issue while displaying large amounts MapItems on a Map provided by the QML Location module. I already asked the question here (https://forum.qt.io/topic/79229/large-amount-of-qml-mapitems), but nobody could help me, so I wanted to try it here once. I also found this question (How to use the QML/QtLocation module for displaying a large amount of offline data on a map?), but before adding another dependency, I wanted to see if my code can be improved so that QML can handle this situation without any help.
I am currently trying to plot a large amount of items onto a QML Map (30,000 - 120,000 points). These items shall be updated dependent of the position of a QSlider. Performance decreases strongly from about 1,000 items upwards, when I use 30,000 it takes several minutes until the QML Map has all the data visualized and is responsive again. I have a machine which is absolutely capable of fulfilling this task in general, so I think the problem is QML. I am using Qt 5.8.
Is there any way to improve this performance or is it just not possible with a QML-map to plot so many MapItems at a time? I tried MapCircles, Polylines, Polygons and MapQuickItems with images, but for me it seems like the performance issue just arises from adding this amount of MapItems, as I could not see a significant difference in processing time between these types.
I have more data on the map visualized, which should not be refreshed every time the QSlider is moved. Even though I tried just to clear all MapItems and add the new ones for performance tests, but even this did not improve the performance.
My code (a bit abstracted) looks like this:
///-------------- Widget.cpp-----------------///
void ProcessInput(int qslider_pos) {
QVariantList lat_vec;
QVariantList lon_vec;
// Fill vectors with lateral and longitudinal positions
// ...
// Clean current points on map and draw new ones
SendToQmlFuncRemovePoints();
SendToQmlFuncAddPoints(lat_vec, lon_vec);
}
void QmlConnector::SendToQmlFuncRemovePoints()
{
QVariant returnedValue;
QMetaObject::invokeMethod(QmlMapSingleton::instance()->GetRoot(), "remove_points",
Q_RETURN_ARG(QVariant, returnedValue));
}
void QmlConnector::SendToQmlFuncAddPoints(QVariantList input_one, QVariantList input_two)
{
QVariant returnedValue;
QMetaObject::invokeMethod(QmlMapSingleton::instance()->GetRoot(), "add_points",
Q_RETURN_ARG(QVariant, returnedValue),
Q_ARG(QVariant, QVariant::fromValue(input_one)), Q_ARG(QVariant, QVariant::fromValue(input_two)));
}
.
///-------------- Map.qml -----------------///
Map {
anchors.fill: parent
property variant points: ({})
property int pointCounter: 0
Plugin
{
id: osmplugin
name: "osm"
PluginParameter { name: "osm.mapping.highdpi_tiles"; value: true }
}
Component.onCompleted: {
points = new Array();
}
id: map
plugin: osmplugin
//Javascript functions
function add_points(array_lat, array_lon) {
var myArray = new Array()
var component = Qt.createComponent("mapcircle.qml");
for (var i=0; i<array_lat.length; i++)
{
var object = component.createObject(map, { "center": QtPositioning.coordinate(array_lat[i], array_lon[i]})
map.addMapItem(object)
myArray.push(object)
}
map.points = myArray
}
function remove_points() {
var count = map.points.length
for (var i = 0; i<count; i++){
map.removeMapItem(map.points[i])
map.points[i].destroy()
}
map.points = []
}
}
.
///-------------- mapcircle.qml -----------------///
import QtQuick 2.0
import QtLocation 5.6
MapCircle {
radius: 1
border.width: 0
color: 'green'
}
Qt says that the performance decreases with the number of elements added to the map. Do you need all the points to be visible on the map in the same time, if not you can play around with visibility.
Can't you use QQuickPaintedItem to paint the points in C++ and wrap it into an MapQuickItem, if you have multiple polygonsfor e.g? But also there are some limitation, you cannot have to big images displayed.
If you need all the points maybe you can have different points based on the map zoom level and reduce the number of points added to the map at small zoom level, as was recommended on the other group ...
i'm making this game where a ninja is supposed to go up and down. I wrote a method for a button to do so but the problem is that when the ninja is at the top of the screen (landscape)
it still goes up when i touch the up button so, i did this
-(void)upPressed:(id)sender
{
if(CGPointEqualToPoint(ninja.position, ccp(0,280)))
{
id standStill = [CCMoveBy actionWithDuration:0 position:ccp(0,0)];
[ninja runAction:standStill];
}else
{
id moveUp = [CCMoveBy actionWithDuration:.1 position:ccp(0,80)];
[ninja runAction:moveUp];
}
}
and the problem still exists. any help?
i.e when the ninja is at (0,280), i want the up button to do nothing
You are testing for equality. This if condition will only be true if the ninja is exactly at {0, 200}.
Try this instead:
if (ninja.position.y < 280)
{
// no need to run an action for this
ninja.position = CGPointZero;
// but you should stop any potentially running (move) action
[ninja stopAllActions];
}
else ...
Hi I am using Raphael to generate a bar chart on my web and would like to attach an index to the bars following the replies in this page
https://stackoverflow.com/questions/4057035/raphaeljs-charts-bar-index-fetching?answertab=votes#tab-top.
In order to do this, I will need to fetch the value of bc.bars.length. However, no matter how many bars are in my bar chart, bc.bars.length always returning 1.
Here is my code:
//Create a bar chart using the values in the selected objects
r = Raphael("bar");
txtattr = { font: "12px arial" };
r.text(160, 10, "Title").attr(txtattr);
var bc = r.barchart(10, 10, 300, 220, [myData]).hover(fin, fout);
alert(bc.bars.length); //always returning 1
Anyone knows what is going wrong here? Thanks in advance.
this might be a little late, but for anyone out there, you know, I found myself in the same situation, so let me share my answer and the things I noticed:
(I'm using graphael 0.5.1)
-I noticed that when you use and array for the bars, it returns 1, like what you have:
var bc = r.barchart(10, 10, 300, 220, [myData])
alert(bc.bars.length); //always returning 1
-BUT if you put the values directly, like:
var bc = r.barchart(10, 10, 300, 220, [100,450,340,500])
alert(bc.bars.length); //seems to return 4
-BUT ! that doesn't work if you are getting dinamic data!
so THE SOLUTION I'VE FOUND IS THIS:
//after creating the barchart, let's loop it
var i = 1;
bc.each(function() {
i++;
console.log("bar: "+ i);
});
var total_bars=i-1;
console.log('total_bars: '+total_bars)
I hope this helps other people =), this is a nice library to chart, but it's a shame it's a little buggy with each new version, like the labels and such =(
http://shoes4school.project-x.me/get-involved.html
Can someone please tell me what i'm doing wrong the the jQuery column faux... I can not get it to work after trying several different methods...
The code i'm using is... my url is above
$j(".content-block").height(Math.max($("#right").height(), $(".content-block").height()));
How to faux columns on webpage
(function($){
// add a new method to JQuery
$.fn.equalHeight = function() {
// find the tallest height in the collection
// that was passed in (.column)
tallest = 0;
this.each(function(){
thisHeight = $(this).height();
if( thisHeight > tallest)
tallest = thisHeight;
});
// set each items height to use the tallest value found
this.each(function(){
$(this).height(tallest);
});
}
})(jQuery);
Firebug show this error :
preloadImages is not defined
preloadImages([