javascript - Google map polygon not rendering correctly in IE (9 and 10) -


i hope question not confusing or complex. here go: i'm creating custom google map renders states polygon overlays "google.map.polygon' method. seems work in browsers shown in picture below, polygons in chrome,firefox,safari , opera

when "all browsers", chrome,firefox,safari , opera. when comes ie (9-10) polygon shapes seem brake in half , shrinks shown here:

polygons in ie (9-10)

like said before, i'm using google polygon method :

 var obj = new google.maps.polygon({     paths: coords,     strokecolor: scolor,     strokeopacity: sopacity,     strokeweight: sweight,     fillcolor: fcolor,     fillopacity: fopacity,     lat:clat,     lng:clng,     north_bound:cnorthbound,     south_bound:csouthbound,     name:name     });

and shape coordinates points come xml file : //i'm placing code give better idea how whole thing put together

<state name="louisiana" strokecolor="#d6d1cb" strokeopacity="1" strokeweight="2" fillcolor="#004e98" fillopacity="1" lat="31.2448234" lng="-92.1450245" north_bound="33.019544,-88.8162401" south_bound="28.9254296,-94.043352">    <point lat="33.0225" lng="-94.0430"/>    <point lat="33.0179" lng="-93.0048"/>    <point lat="33.0087" lng="-91.1646"/>    <point lat="32.9269" lng="-91.2209"/>    <point lat="32.8773" lng="-91.1220"/>    ..... etc

the problem not passing data or creating shape, rather the way renders in ie 9&10. have googled , tried several alternatives days on how fix issue, none of them worked, have tried far:

  • using ie compatibility mode ()
  • using ie backwards compatibility ()
  • using prefixer in case css/html5 issue ( used prefixer.js)
  • using excanvas ie compatibility
  • using modernizer (but shows ie supports canvas, don't know how extensive support may be.
  • using html5shiv, in case ie had issues html5 elements
  • changing css display block (including canvas tag)
  • checking in both firebug , ie tools console bugs, none detected.
  • check functions errors, none detected

if click on ie's compatibility button

ie compatibility button

the code changes from:

standard ie source code rendering

to:

compatibility source code

which view compatibility old browsers, suppose google map renders differently ( without canvas ) , shows polygons correctly brakes rest of html5 element , css in page. besides controlled user, not site.

enter image description here can see in in picture above.

so questions (possible solutions/thoughts) are:

  • is there way force google map render without canvas ie browsers only?
  • is related css attribute i'm not aware of?(it doesn't use css create states shapes, in case)
  • is there js fix type of issue?
  • is there i'm missing when comes google maps , ie?
  • any other thoughts guys may have?

thanks in advance input/help :)

i did take whole thing apart michael geary suggested, , turns out google maps in ie css inheritance might affect how polygon render on screen. individual polygon layers inheriting css "height:auto" 1 of it's parents , seems ie9&10 delicate this. so answer removing "height:auto" css file in parent element (container box).


Comments

Post a Comment

Popular posts from this blog

jquery - How can I dynamically add a browser tab? -

since using iframes house external pages are, accounts "not preferred method" , disallowed sites (flickr, one), want dynamically generate browser tabs. e.g., when user submits form, want dynamically generate tab on browser in response submitted. e.g., might want add new tab url like: http://www.bigsurgarrapata.com/contact how in jquery? you want form target attribute action attribute. http://www.w3schools.com/tags/att_form_target.asp browsers have ultimate control on result of target attribute open new tab value of _blank. <form action="contact_submit.php" target="_blank" method="post">
Read more

node.js - Getting the socket id,user id pair of a logged in user(s) -

i have web application done using node js , in it,i have authentication system requires users log in before can access pages. have 2 pages,the homepage , updates page. from read docs,a new socket id issued when user opens tab in browser. me being admin,i know socket id of logged in user , more so,the socket id,logged in user id pair logged in users. what method can use socket id,logged in user id pair make sure broadcast realtime info users online?.
Read more

keyboard - C++ GetAsyncKeyState alternative -

i using windows.h library's getasynckeystate function define key pushed on keyboard . here program returns int value of pushed key example. #include <iostream> #include <windows.h> using namespace std; int main (){ char i; for(i=8;i<190;i++){ if(getasynckeystate(i)== -32767){ cout<<int (i)<<endl; } } return 0; } but trying make opengl simple game , function appeared slow . there function not need cycle 180 times , if statement . thanks you're trying make opengl game, you're going use glfw. if that's case can away using glfwgetkey() such: if (glfwgetkey(glfw_key_up) == glfw_press) {...} if (glfwgetkey(glfw_key_down) == glfw_press) {...} that method nicely explained in tutorial 6 opengl-tutorial.org . should start first tutorial of beginners tutorials , later intermediate tutorials . if you're going make win32 window can listen wm_keydown or wm_keyup messages , virtua
Read more