search

blacklabel / annotations

Annotations plugin for Highstock by Black Label
http://blacklabel.github.io/annotations/
Other
22 stars 16 forks source link

Responsive #73

Open Josephdias92 opened 7 years ago

Josephdias92 commented 7 years ago

the shapes are not rendered properly if the screen width changes. any quick fix for this issue?

pawelfus commented 7 years ago

Could you create a jsFiddle with this issue? I am not sure what do you mean by "not rendered properly".

Demo: https://jsfiddle.net/7m3Mr/359/ - as expected, some of the annotations are linked to x/y values, and their positions are the same as values (eg "drag me horizontaly"). Other annotations are rendered using pixels positions and those positions are not changed (eg "drag me anywhere").

Josephdias92 commented 7 years ago

when i create some annotation and save them in my database. then go to some other device with difference screen resolution then annotations dont get rendered properly.

pawelfus commented 7 years ago

Could you show me an example of that saved annotation? I mean the configuration object.

Josephdias92 commented 7 years ago

[{"xAxis":0, "yAxis":0, "shape":{ "type":null }, "anchorX":"left", "anchorY":"top", "events":{

}, "xValue":1447006742694.0344, "yValue":276.40449438202245, "allowDragX":true, "allowDragY":true, "title":{ "style":{ "color":"rgba(255, 0, 0, 0.6)", "fontSize":"1em" }, "text":"dsd" } }, { "xAxis":0, "yAxis":0, "shape":{ "params":{ "stroke":"rgba(204, 0, 0, 0.6)", "fill":"rgba(0,0,0,0)", "stroke-width":2, "width":110, "height":91, "x":0, "y":0 }, "type":"rect" }, "anchorX":"left", "anchorY":"top", "events":{

}, "xValue":1447006634336.28, "yValue":264.60674157303373, "allowDragX":true, "allowDragY":true }, { "xAxis":0, "yAxis":0, "shape":{ "params":{ "stroke":"rgba(204, 0, 0, 0.6)", "fill":"rgba(0,0,0,0)", "stroke-width":2, "d":[ "M", 0, 0, "L", -73.0000001744504, 137 ] }, "type":"path" }, "anchorX":"left", "anchorY":"top", "events":{

}, "xValue":1447006793297.6558, "yValue":278.3707865168539, "allowDragX":true, "allowDragY":true, "xValueEnd":1447006753144.7822, "yValueEnd":143.67977528089887 } ]

pawelfus commented 7 years ago

Thanks!

Here are two demos with different widths:

Both demos work looks the same on mac and mobile device. Could you update one of the demos above to reproduce the issue? Thanks!