I believe this it will be dead soon if no updated version will appear.
There are plenty of people that wants click-and-go like in android :-). So
adding and reconfiguring mysql and additionally debugging js scripts can be
deterrent (plus to find updated script for new weewx :-))
I have already weewx as other people here but was looking for
almost-real-time data and found mesowx. To be honest failed at first time
and leaved it for about 3 days (that was problems with comments in json
file).
I'm a database programmer so for first look it looks complicated with
practically 4 languages php, py, js. but in fact - it is created with large
acknowledge.
Anyway You asked about shapes in legend, this should be modified in
{AbstractHigstockChart.js} default configuration real-time tooltip is
displayed as unmodified higcharts tooltip but others because of ranfe of
date presentation are displayed from tooltip formatted. So legend is
slightly different from real-time.
So there are two tasks:
1. Set legend same for all tabs.
2. Add shapes to default formater
1. to show same tooltip you must change in
AbstractHigstockChart.js
this:
// if chart is lazy, need to override the tooltip to display the
aggregation period
if(this._lazy) {
chartOptions.tooltip = {
useHTML : true,
formatter: this._createTooltipFormatter()
};
};
to this:
// if chart is lazy, need to override the tooltip to display the
aggregation period
//if(this._lazy) {
chartOptions.tooltip = {
useHTML : true,
borderRadius: 0,
borderWidth: 0,
formatter: this._createTooltipFormatter()
};
//};
now for any tooltip formatter is used.
2. to change formatter to display shapes you need to find
{AbstractHighstockChart.
prototype._createTooltipFormatter = function()} in the same file. I used
help from here :
http://stackoverflow.com/questions/25973920/how-to-display-highchart-series-line-marker-symbol-from-tooltip-formatter
Instead of this:
AbstractHighstockChart.prototype._createTooltipFormatter = function() {
var self = this;
return function() {
// flags
if(this.point && this.series.options.type == 'flags') {
var s = Highcharts.dateFormat(this.series.options.tooltip.
xDateFormat, this.x);
// TODO style the text a bit more (text is set when created)
s += '<br/>' + this.point.text;
return s;
} else if(this.points && this.points.length) {
var s = '';
if(self._currentDataAggregated) {
var unitDateTimeLabelFormats = self.
_groupDateTimeLabelFormats[self._currentGroupingInterval.unit];
if(self._currentGroupingInterval.interval == 1) {
s += Highcharts.dateFormat(unitDateTimeLabelFormats[
0], this.x);
} else {
s += Highcharts.dateFormat(unitDateTimeLabelFormats[
1], this.x);
s += Highcharts.dateFormat(unitDateTimeLabelFormats[
2], this.x + self._currentGroupingInterval.ms);
}
} else {
var unit = self._determineDateTimeLabelUnit(this.x);
var format = self._groupDateTimeLabelFormats[unit][0];
s += Highcharts.dateFormat(format, this.x);
}
s += '<table>';
this.points.forEach(function(point, index) {
s += '<tr><td style="color:' + point.series.color + '">'
+ point.series.name + '</td>' +.
'<td><b>' + point.y + '</b><small>' + point.series.
tooltipOptions.valueSuffix + '</small></td></tr>';
});
s += '</table>';
return s;
}
}
};
you need to replace it to this:
AbstractHighstockChart.prototype._createTooltipFormatter = function() {
var self = this;
var symbol;
return function() {
// flags
if(this.point && this.series.options.type == 'flags') {
var s = Highcharts.dateFormat(this.series.options.tooltip.
xDateFormat, this.x);
// TODO style the text a bit more (text is set when created)
s += '<br/>' + this.point.text;
return s;
} else if(this.points && this.points.length) {
var s = '';
if(self._currentDataAggregated) {
var unitDateTimeLabelFormats = self.
_groupDateTimeLabelFormats[self._currentGroupingInterval.unit];
if(self._currentGroupingInterval.interval == 1) {
s += Highcharts.dateFormat(unitDateTimeLabelFormats[
0], this.x);
} else {
s += Highcharts.dateFormat(unitDateTimeLabelFormats[
1], this.x);
s += Highcharts.dateFormat(unitDateTimeLabelFormats[
2], this.x + self._currentGroupingInterval.ms);
}
} else {
var unit = self._determineDateTimeLabelUnit(this.x);
var format = self._groupDateTimeLabelFormats[unit][0];
s += Highcharts.dateFormat(format, this.x);
}
this.points.forEach(function(point, index) {
switch ( point.series.symbol ) {
case 'circle':
symbol = '●';
break;
case 'diamond':
symbol = '◆';
break;
case 'square':
symbol = '■';
break;
case 'triangle':
symbol = '▲';
break;
case 'triangle-down':
symbol = '▼';
break;
}
s += '<div style="color:' + point.series.color + '">'+ symbol +' '+
point.series.name +
'<b>' + point.y + '</b><small>' + point.series.
tooltipOptions.valueSuffix + '</small></div>';
});
return s;
}
}
};
File is included
W dniu czwartek, 12 stycznia 2017 00:29:15 UTC+1 użytkownik Glenn McKechnie
napisał:
>
> Another success, it's always good to hear of them, at the very least it
> means that Mesowx isn't quite dead yet. :-)
>
> What was the magic required to change the markers in the pop-up? Any
> pointers to their location or a brief HowTo on the tuning required would
> certainly be appreciated from this end.
>
> That reminds me of another entry on the wishlist. I'd love to get the
> Hi/Lo flags to match their line colours. It's not a really big deal but
> when the graphs get a bit tight it would help to quickly zero in on the
> right one if they were colour matched.
>
>
> Cheers
> Glenn
>
> rorpi - read only raspberry pi + weewx: now with scripts
> <https://github.com/glennmckechnie/rorpi-raspberrypi>
>
> On 5 January 2017 at 19:17, laki1 <[email protected] <javascript:>> wrote:
>
>> Hi Guys,
>>
>> I want to report successful implementation on weewx 2.6.2 (nginx on rpi0
>> with 2 bme280).
>> Used raw_0.4.1-lh.py from Luc and highlights from Glenn - that was
>> useful.
>> My station is 'smaller' - only pressure,temperature,humidity are now
>> reported (light is also planned) , but after editing scripts it looks very
>> good.
>>
>> Meet two not obvious problems that someone can meet:
>> - In my particular case any comments from config.json needed to be
>> removed.
>> - Some time spent - like Glenn said - on parameters configuration. My
>> case was simpler because this is all about removing :-)
>> - Stuck on visualization problem with different tooltip on real time and
>> 24h and Archive view. Wanted to have marker symbol in legend like this
>>
>> It was some tuning but successful - i can provide additional information
>> if someone wish to have it.
>>
>> Cheers
>>
>>
>
--
You received this message because you are subscribed to the Google Groups
"weewx-user" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/d/optout.
--- /var/www/html/mesowx/meso/js/AbstractHighstockChart.js 2017-01-05 10:14:09.495079159 +0100
+++ /home/jareeq/mesowx-0.4.0/web/meso/js/AbstractHighstockChart.js 2014-05-10 04:41:43.000000000 +0200
@@ -636,14 +636,12 @@
}
};
// if chart is lazy, need to override the tooltip to display the aggregation period
- //if(this._lazy) {
+ if(this._lazy) {
chartOptions.tooltip = {
useHTML : true,
- borderRadius: 0,
- borderWidth: 0,
formatter: this._createTooltipFormatter()
};
- //};
+ };
chartOptions.plotOptions = {
line: {
lineWidth: 2,
@@ -744,7 +742,6 @@
*/
AbstractHighstockChart.prototype._createTooltipFormatter = function() {
var self = this;
- var symbol;
return function() {
// flags
if(this.point && this.series.options.type == 'flags') {
@@ -767,28 +764,12 @@
var format = self._groupDateTimeLabelFormats[unit][0];
s += Highcharts.dateFormat(format, this.x);
}
+ s += '<table>';
this.points.forEach(function(point, index) {
-switch ( point.series.symbol ) {
- case 'circle':
- symbol = '●';
- break;
- case 'diamond':
- symbol = '◆';
- break;
- case 'square':
- symbol = '■';
- break;
- case 'triangle':
- symbol = '▲';
- break;
- case 'triangle-down':
- symbol = '▼';
- break;
- }
-
- s += '<div style="color:' + point.series.color + '">'+ symbol +' '+ point.series.name +
- '<b>' + point.y + '</b><small>' + point.series.tooltipOptions.valueSuffix + '</small></div>';
+ s += '<tr><td style="color:' + point.series.color + '">' + point.series.name + '</td>' +
+ '<td><b>' + point.y + '</b><small>' + point.series.tooltipOptions.valueSuffix + '</small></td></tr>';
});
+ s += '</table>';
return s;
}
}
