javascript - How to update kml file/layer dynamically? -

-

i using kml file displaying map custom boundary lines. kml file downloaded website. in file, inside placemark tag there no point tag display icons. eg:

<placemark>     <name>spot 2</name>     <description>.....</description>     <styleurl>....</styleurl>     <multigeometry><polygon><outerboundaryis><linearring><coordinates>     .........     </coordinates></linearring></outerboundaryis></polygon></multigeometry> </placemark>

that placemark tag contains in kml file. , need,

1) how can add point tag placemark tag. there way add dynamically?. kml file has 5000 , above placemarks. 2) point tag coordinates refers center of polygon.

i.e) need following

<placemark>     <name>spot 2</name>     <description>.....</description>     <styleurl>....</styleurl>     <multigeometry><polygon><outerboundaryis><linearring><coordinates>     .........     </coordinates></linearring></outerboundaryis></polygon></multigeometry>     <point>         <coordinates>144.253,-36.6632,0</coordinates>     </point> </placemark>

note:

i using geoxml3 parser display kml layer in google maps.

this html file,

<!doctype html> <html>   <head>     <meta name="viewport" content="initial-scale=1.0, user-scalable=no">     <meta charset="utf-8">     <title>kml layers</title>     <style>       html, body, #map-canvas {         height: 100%;         margin: 0px;         padding: 0px       }     </style>     <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>     <script type="text/javascript" src="http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js"></script>     <script type="text/javascript" src="http://geoxml3.googlecode.com/svn/trunk/projectedoverlay.js"></script>     <script> function initialize() {   var usa = new google.maps.latlng(41.875696,-87.624207);   var mapoptions = {     zoom: 4,     center: usa,     maptypeid: google.maps.maptypeid.hybrid   }   var map = new google.maps.map(document.getelementbyid('map-canvas'), mapoptions);  var myparser = new geoxml3.parser({     map: map   });     var kml = myparser.parse('http://localhost/test/dfwnorth.kml'); } google.maps.event.adddomlistener(window, 'load', initialize);     </script>   </head>   <body>     <div id="map-canvas"></div>   </body> </html>

this sample kml file,

<?xml version="1.0" encoding="utf-8"?> <kml xmlns="http://www.opengis.net/kml/2.2"   xmlns:gx="http://www.google.com/kml/ext/2.2"> <document>   <name>real estate portal usa parcels</name>   <open>1</open>    <style id="parcel">     <linestyle>       <color>ff48a7ff</color>       <width>1</width>     </linestyle>     <polystyle>       <outline>1</outline>       <color>00ffffff</color>     </polystyle>   </style>    <style id="hl_parcel">     <iconstyle>       <scale>0.3</scale>       <icon>         <href>http://bus.w.pw/r.png</href>       </icon>     </iconstyle>     <labelstyle>       <color>9900ffff</color>       <scale>1</scale>     </labelstyle>     <linestyle>       <color>ff00ffff</color>       <width>1.5</width>     </linestyle>     <polystyle>       <outline>1</outline>       <color>5f000000</color>     </polystyle>   </style>    <folder>     <open>1</open>     <name>selected parcels</name>     <placemark>       <name><![cdata[1100 n 27th ave]]></name>       <description> ............ </description>       <styleurl>#hl_parcel</styleurl>       <multigeometry>         <polygon>           <outerboundaryis>             <linearring>               <coordinates>-97.032117983752471,32.928768626517076 -97.024643584146915,32.923035186813181 -97.024619516424863,32.923056622674181 -97.023311876445746,32.922172553473487 -97.023027365973348,32.921986354508512 -97.022978167636879,32.921954156605246 -97.022101518923066,32.921458657105333 -97.021852382220004,32.921328433111441 -97.021603007761968,32.921212207649802 -97.021353262564418,32.921103685381986 -97.020040739077089,32.92059307329437 -97.019977072943703,32.920561642411542 -97.019978949582082,32.920357989560173 -97.019981935486342,32.920034178750491 -97.032338461906804,32.92018039810069 -97.03217983292177,32.928807043604458 -97.032117983752471,32.928768626517076</coordinates>             </linearring>           </outerboundaryis>         </polygon>     </multigeometry>     </placemark> ......... ...........

geoxml3 parses kml native google.maps.polygon objects. can process polygons in afterparse function:

var myparser = new geoxml3.parser({   map: map,   afterparse: usethedata }); var kml = myparser.parse('kml/so_20150619a.kml'); function usethedata(doc) {   (var i=0; < doc[0].gpolygons.length; i++) {     var centroid = new google.maps.marker({map:map,position: get_polygon_centroid(doc[0].gpolygons[i].getpath().getarray())});   } }

to centroid of polygon:

// http://stackoverflow.com/questions/9692448/how-can-you-find-the-centroid-of-a-concave-irregular-polygon-in-javascript function get_polygon_centroid(pts) {    var first = pts[0], last = pts[pts.length-1];    if (first.lat() != last.lat() || first.lng() != last.lng()) pts.push(first);    var twicearea=0,    x=0, y=0,    npts = pts.length,    p1, p2, f;    ( var i=0, j=npts-1 ; i<npts ; j=i++ ) {       p1 = pts[i]; p2 = pts[j];       f = p1.lat()*p2.lng() - p2.lat()*p1.lng();       twicearea += f;                 x += ( p1.lng() + p2.lng() ) * f;       y += ( p1.lat() + p2.lat() ) * f;    }    f = twicearea * 3;    return new google.maps.latlng(y/f, x/f); }

note above "really works" regular polygons, irregular polygons concave edges center might not "in" polygon.

working example


Comments

Post a Comment

Popular posts from this blog

PHP DOM loadHTML() method unusual warning -

-
i had following code works fine on localhost: $document = new domdocument(); $document->loadhtml($p_result); $form = $document->getelementsbytagname('form')->item(0); // code continues using $form variable after same code updated on outside server, loadhtml() failed , issued warning. warning: domdocument::loadhtml() expects parameter 1 valid path, string given in path/name/to/script.php returned null instead of object code pretty gets fatal error. note contents of $p_result absolutely same on outside server , on localhost. but why displays kind of warning , why not work? doesn't loadhtml() expects argument 1 string in first place? why method expects parameter 1 valid path ? just make clear i'm not calling loadhtmlfile() , i'm calling loadhtml() . thanks. you're affected one of php bugs . issue present in php 5.6.8 , 5.6.9. have affected php version on server, , bug-free version on localhost. the bug forbids null
Read more

python - How to create jsonb index using GIN on SQLAlchemy? -

-
here's current code creating index jsonb. index("mytable_data_idx_id_key", mytable.data['id'].astext, postgresql_using='gin') but got error. sqlalchemy.exc.programmingerror: (psycopg2.programmingerror) data type text has no default operator class access method "gin" hint: must specify operator class index or define default operator class data type. [sql: "create index event_data_idx_id_key on event using gin ((data ->> 'id'))"] is there way create index on sqlalchemy? the postgresql specific sqlalchemy docs @ http://docs.sqlalchemy.org/en/latest/dialects/postgresql.html#operator-classes mention postgresql_ops dictionary provide "operator class" used postgresql, , provide example illustrating use: index('my_index', my_table.c.id, my_table.c.data, postgresql_ops={ 'data': 'text_pattern_ops',
Read more

c# - TransactionScope not rolling back although no complete() is called -

-
i'm using transactionscope rollback transaction fail bool errorreported = false; action<importerrorlog> newerrorcallback = e => { errorreported = true; errorcallback(e); }; using (var transaction = new transactionscope()) { foreach (importtaskdefinition task in taskdefinition) { loader.load(streamfile, newerrorcallback, task.destinationtable, processingtaskid); } if (!errorreported) transaction.complete(); } i'm sure there no transactionscope started ahead or after code. i'm using entity framework insert in db. regardless state of errorreported transaction never rolled in case of error. what missing ? transactionscope sets transaction.current . that's does. wants transacted must @ property. i believe ef each time connection opened reason. probably, connection open when scope installed. open connection inside of scope or enlist manually. ef has nasty "design decision": default opens
Read more