I'm attempting to combine perl and Javascript to map IP address Lat/Long locations to a Google Map using the Google Maps API v3. What I'm getting back is in the marker, I'm getting the error: Uncaught Error: Invalid value for property <position>: 43.073052,-89.40123
My code is:
#!/usr/bin/perl -w
use CGI qw(:standard);
use CGI::Carp qw/fatalsToBrowser warningsToBrowser/;
use CGI::Session ( '-ip_match');
use SOAP::Lite;
use lib '/home/schreiber/perl5/lib/perl5';
use JSON qw(encode_json);
$session = CGI::Session->load();
$q = new CGI;
my $soap = SOAP::Lite
-> uri('http://v1.fraudlabs.com/')
-> proxy('http://v1.fraudlabs.com/ip2locationwebservice.asmx')
-> on_action(sub { join "/", "http://v1.fraudlabs.com", $_[1] });
$license = "<removed>";
#if($session->is_expired) {
# print $q->header(-cache_control=>"no-cache, no-store, must-revalidate");
# print "Your session has expired. Please login again.";
# print "<br/><a href=\"../login.html\">Login</a>";
#} elsif($session->is_empty) {
# print $q->header(-cache_control=>"no-cache, no-store, must-revalidate");
# print "You have not logged in";
#} else {
print $q->header(-cache_control=>"no-cache, no-store, must-revalidate");
open (IPF, "/home/access_log");
@incomingarray=<IPF>;
$i = 0;
foreach $pair(@incomingarray) {
($ip, $rest) = split(/ - - /, $pair);
$incomingarray[$i] = $ip;
chomp $ip;
$i++;
}
close (IPF);
my %hash = map { $_, 1 } @incomingarray;
my @distinctIP = keys %hash;
$j = 0;
my @iplocation;
foreach (@distinctIP) {
my $method = SOAP::Data->name('IP2Location')->attr({xmlns =>
'http://v1.fraudlabs.com/' });
my @params = SOAP::Data->name('inputdata' => \SOAP::Data->value(
SOAP::Data->name(IP=>$_),
SOAP::Data->name(LICENSE=>$license)
));
my $result = $soap->call($method => @params);
$lat = $result->valueof('//LATITUDE');
$long = $result->valueof('//LONGITUDE');
push(@iplocation, "$lat,$long");
}
my $json = encode_json(\@iplocation);
# print "Content-Type: text/html\n\n";
print '<html>
<head>
<script type="text/javascript">
function initialize() {
var myOptions = {
zoom: 8,
center: new google.maps.LatLng(44.49, -91.30),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById(\'map_canvas\'),
myOptions);
var coord_data = new Array();
coord_data = '.$json.';
var marker;
for (var i = 1; i < coord_data.length; i++) {
console.log(coord_data[i]);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(coord_data[i]),
map:map
});
marker.setMap(map);
}
}
function loadScript() {
var script = document.createElement(\'script\');
script.type = \'text/javascript\';
script.src = \'//maps.googleapis.com/maps/api/js?sensor=false&callback=initialize\';
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
</head>
<body>
<div id="map_canvas" style="width: 100%; height: 100%"></div>
</body>
</html>
';
#}
Any assistance would be greatly appreciated.
To fix that, copy the code directly from you IDE to some "Hidden Character" detector like this one https://www.soscisurvey.de/tools/view-chars.php ,delete the 'bad' characters and then save your code again without the bad characters.
The problem is that when you assign the position here --
marker = new google.maps.Marker({
position:coord_data[i],
map:map
});
-- you give it a raw JSON object, but it's expecting a google.maps.LatLng object. You will want to assign it like this--
position: new google.maps.LatLng(coord_data[i].lon,coord_data[i].lat)
See here also for some good samples of the Gmaps API usage: https://developers.google.com/maps/documentation/javascript/v2/examples/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With