Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Responsive #73

Open
Josephdias92 opened this issue Apr 12, 2017 · 5 comments
Open

Responsive #73

Josephdias92 opened this issue Apr 12, 2017 · 5 comments

Comments

@Josephdias92
Copy link

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

@pawelfus
Copy link
Collaborator

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
Copy link
Author

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
Copy link
Collaborator

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

@Josephdias92
Copy link
Author

Josephdias92 commented Apr 12, 2017

[{"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
Copy link
Collaborator

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!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants