So I'm trying to have Prism highlight the following Arduino code snippet on my site.
client.print(String(\'\'GET \'\') + url + \'\' HTTP/1.1\r\n\'\' +
\'\'Host: \'\' + host + \'\'\r\n\'\' +
\'\'Connection: close\r\n\r\n\'\');
I initially had to change all of the " to '' but now it interprets \r\n as a line break and displays it as such. Any thoughts?
Ok, actually just got it. Use \'\'\\r\'\' to express what will be interpreted as "\r".
New to leaflet, and basically everything programming related.
I am making a brewery map showing locations of breweries, distilleries, vineyards, etc around the state.
What I want to do is have a popup that gives:
Name, Address, URL to that specific website.
I've figured out the Name/Address part, but I just can't figure out how to pull the URL from the object's properties. I've tried many iterations, none work (or even partially work).
As well, my searches have been fruitless, but I can't be the only one who has tried to do this. Bad search skills?
//load GeoJSON from an external file
$.getJSON("breweries.geojson",function(data){
var pintGlass = L.icon({
iconUrl: 'glass.png',
iconSize: [24,48]
});
var popupMarker = L.geoJson(data,{
pointToLayer: function(feature,latlng){
var marker = L.marker(latlng,{icon: pintGlass});
marker.bindPopup("<strong>" + feature.properties.NAME + "</strong> </br/>" + feature.properties.STREETNUM
+ " " + feature.properties.STREET + ", " + feature.properties.CITY + <a href=feature.properties.URL>feature.properties.URL</a>);
return marker;
}
});
var clusters = L.markerClusterGroup();
clusters.addLayer(popupMarker);
map.addLayer(clusters);
});
The last bit of the marker.bindPopup is the trouble spot. I've tried single quotes, double quotes, no luck. I tried creating a variable to pull the object.properties.URL out and insert that variable into the with no luck.
The problem is exactly at the following point, where you are trying to create a String:
+ <a href=feature.properties.URL>feature.properties.URL</a>
which should be
+ "" + feature.properties.URL + ""
It appears that you a not enclosing your strings correctly.
Try this and let me know if it works:
marker.bindPopup("<strong>" + feature.properties.NAME + "</strong></br/>" + feature.properties.STREETNUM + " " + feature.properties.STREET + ", " + feature.properties.CITY + " " + feature.properties.URL + "");
I know you've got a couple of "working" answers but i'de like to point out a few things. At the moment your ending up with markup like this:
<a href=http://example.org>http://example.org</a>
But it's best practice in HTML to make sure attribute values are wrapped in double quotes like this:
http://example.org
To accomplish that you'll have to do the following:
"" + feature.properties.URL + ""
Notice the slashes proceding the double quotes, a slash escapes the following double quote so that it gets treated like a string. Things like this can get pretty ugly very quick. That's why it's best when you're concatenating HTML with javascript that you simply use single quotes:
'' + feature.properties.URL + ''
That way you won't have to escape any double quotes in your strings.
And i'de like to point out a thing that Leaflet users often overlook is the wonderful L.Util.template method:
Simple templating facility, accepts a template string of the form 'Hello {a}, {b}' and a data object like {a: 'foo', b: 'bar'}, returns evaluated string ('Hello foo, bar'). You can also specify functions instead of strings for data values — they will be evaluated passing data as an argument.
http://leafletjs.com/reference.html#util-template
Using that takes away a lot of the hassle of what you're doing now, for example:
var values = {
a: feature.properties.NAME,
b: feature.properties.STREETNUM,
c: feature.properties.STREET,
d: feature.properties.CITY,
e: feature.properties.URL
};
var templateString = '<strong>{a}</strong><br>{b} {c}, {d} {e}';
var htmlString = L.Util.template(templateString, values);
I'm using the Google maps V3 JavaScript API and I'm currently using the default directions formatting (because this is the easiest way to get the map pins and step icons integrated into the listing). I'm setting the text that is displayed for each 'address' for example:
var loc = 'The Old Ballpark Bar and Lounge';
var addr = '1234 Main st. Chicago, IL.';
...
route.legs[0].start_address = loc + ' - ' + addr;
I'd like to enhance the readability of this start_address in 2 ways:
I'd like to put the addr part on a separate line.
I'd like to highlight the loc part in bold
Since the text for this start_address is placed in a td (class="adp-text") within a table (class="adp-placemark"); I thought that putting a <br/> between the loc and addr would get me the newline I wanted; but it doesn't work, the api translates this into <br/>. Similarly, trying to put <b> before the loc part, gets translated into & lt;b& gt;.
I've tried escaping the markup code with quotes and backslashes, etc.; but can't find a way to do what I want. Is there any way to insert such mark up so as to get it past the Google code translators? Are there some lower-level CSS tags that might be used to accomplish this?
You must modify the elements after they have been inserted into the DOM.
assign the desired markup:
route.legs[0].start_address = '<div style="font-weight:bold">'+ loc + '</div>' + addr;
hide the panel(to avoid undesired effects)
//directionsDisplay is the google.maps.DirectionsRenderer-instance
directionsDisplay.getPanel().style.visibility='hidden';
set the direction:
directionsDisplay.setDirections(response);
wait a moment until you modify the elements:
setTimeout(function(){
//fetch the elements
var nodes=directionsDisplay.getPanel().querySelectorAll('td.adp-text');
for(var n=0;n<nodes.length;++n){
//assign the text-content of the element to the innerHTML-property
nodes[n].innerHTML=nodes[n].firstChild.data;
}
//show the panel
directionsDisplay.getPanel().style.visibility='visible';
},100);
I'm pretty new to the google maps API, but from what I understand about KML layers, this map probably uses one. However, I'm not sure how to find it. I looked at the javascript used in this web page, but I can't seem to find the KML. Please help.
Here's the link
Thanks!
One of the referenced .js files is http://maplarge.com/AidsMapV5.js. On line 2730 of that file is:
getTileUrl: function (level, row, col) {
return "http://api.maplarge.com/Tile/Tile?z=" + level + "&x=" + col + "&y=" + row +
"&layer=" + layerString + "&filter=" + filterString + "&shader=" + shaderString;
}
They're using an API called Map Large and that's where the layers come from.
I am a big time user of using double quotes in PHP so that I can interpolate variables rather than concatenating strings. As a result, when I am generating HTML I often use single quotes for setting tag fields. For example:
$html = "<input type='text' name='address' value='$address'>";
Now this is far more readable to me than either
$html = "<input type=\"text\" name=\"address\" value=\"$address\">";
or
$html = '<input type="text" name="address" values="' . $address . '">' ;
From brief searches I have heard people saying that single quotes for HTML fields is not recognized by EVERY browser. Thus I am wondering what browsers would have problems recognizing single quote HTML?
This is similar to When did single quotes in HTML become so popular?. Single quotes around attributes in HTML are and always have been permitted by the specification. I don't think any browsers wouldn't understand them.
As noted by PhiLho, although there is a widely spread belief that single quotes are not allowed for attribute values, that belief is wrong.
The XML standard permits both single and double quotes around attribute values.
The XHTML standard doesn't say anything to change this, but a related section which states that attribute values must be quoted uses double quotes in the example, which has probably lead to this confusion. This example is merely pointing out that attribute values in XHTML must meet the minimum standard for attribute values in XML, which means they must be quoted (as opposed to plain HTML which doesn't care), but does not restrict you to either single or double quotes.
Of course, it's always possible that you'll encounter a parser which isn't standards-compliant, but when that happens all bets are off anyway. So it's best to just stick to what the specification says. That's why we have specifications, after all.
I have heard people saying that single quotes for HTML fields is not recognized by EVERY browser
That person is wrong.
Don't believe everything you see on Internet...
Funnily, I just answered something similar to somebody declaring single quotes are not valid in XHTML...
Mmm, I look above while typing, and see that Adam N propagates the same belief. If he can back up his affirmation, I retract what I wrote... AFAIK, XML is agnostic and accepts both kinds of quote. I even tried and validated without problem an XHTML page with only single quotes.
As I was looking to find information on this in a much more recent version of the specification and it took me quite some time to find it, here it is:
From
HTML
Living Standard — Last Updated 17 September 2021
[...]
13.1.2.3 Attributes
Single-quoted attribute value syntax
The attribute name, followed by zero or more ASCII whitespace, followed by a single U+003D EQUALS SIGN character, followed by zero or more ASCII whitespace, followed by a single U+0027 APOSTROPHE character ('), followed by the attribute value, which, in addition to the requirements given above for attribute values, must not contain any literal U+0027 APOSTROPHE characters ('), and finally followed by a second single U+0027 APOSTROPHE character (').
In the following example, the type attribute is given with the single-quoted attribute value syntax:
<input type='checkbox'>
If an attribute using the single-quoted attribute syntax is to be followed by another attribute, then there must be ASCII whitespace separating the two.
https://html.spec.whatwg.org/#attributes-2
Only problem is data going into TEXT INPUT fields. Consider
<input value='it's gonna break'/>
Same with:
<input value="i say - "this is gonna be trouble" "/>
You can't escape that, you have to use htmlspecialchars.
I also tend to use single quotes in HTML and I have never experienced a problem.
I used single quotes in HTML pages and embedded JavaScripts into it and its works fine. Tested in IE9, Chrome and Firefox - seems working fine.
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<title>Bethanie Inc. data : geographically linked</title>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
<script src='https://maps.googleapis.com/maps/api/js?v=3.11&sensor=false' type='text/javascript'></script>
<script type='text/javascript'>
// check DOM Ready
$(document).ready(function() {
// execute
(function() {
/////////////// Addresses ///////////////////
var locations = new Array();
var i = 0;
locations[i++] = 'L,Riversea: Comp Site1 at Riversea,1 Wallace Lane Mosman Park WA 6012'
locations[i++] = 'L,Wearne: Comp Site2 at Wearne,1 Gibney St Cottesloe WA 6011'
locations[i++] = 'L,Beachside:Comp Site3 Beachside,629 Two Rocks Rd Yanchep WA 6035'
/////// Addresses/////////
var total_locations = i;
i = 0;
console.log('About to look up ' + total_locations + ' locations');
// map options
var options = {
zoom: 10,
center: new google.maps.LatLng(-31.982484, 115.789329),//Bethanie
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: true
};
// init map
console.log('Initialise map...');
var map = new google.maps.Map(document.getElementById('map_canvas'), options);
// use the Google API to translate addresses to GPS coordinates
//(See Limits: https://developers.google.com/maps/documentation/geocoding/#Limits)
var geocoder = new google.maps.Geocoder();
if (geocoder) {
console.log('Got a new instance of Google Geocoder object');
// Call function 'createNextMarker' every second
var myVar = window.setInterval(function(){createNextMarker()}, 700);
function createNextMarker() {
if (i < locations.length)
{
var customer = locations[i];
var parts = customer.split(','); // split line into parts (fields)
var type= parts.splice(0,1); // type from location line (remove)
var name = parts.splice(0,1); // name from location line(remove)
var address =parts.join(','); // combine remaining parts
console.log('Looking up ' + name + ' at address ' + address);
geocoder.geocode({ 'address': address }, makeCallback(name, type));
i++; // next location in list
updateProgressBar(i / total_locations);
} else
{
console.log('Ready looking up ' + i + ' addresses');
window.clearInterval(myVar);
}
}
function makeCallback(name,type)
{
var geocodeCallBack = function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var longitude = results[0].geometry.location.lng();
var latitude = results[0].geometry.location.lat();
console.log('Received result: lat:' + latitude + ' long:' + longitude);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(latitude, longitude),
map: map,
title: name + ' : ' + '\r\n' + results[0].formatted_address});// this is display in tool tip/ icon color
if (type=='E') {marker.setIcon('http://maps.google.com/mapfiles/ms/icons/green-dot.png')};
Recently i've experienced a problem with Google Search optimization. If has a single quotes, it doesn't seem to crawl linked pages.
... or just use heredocs. Then you don't need to worry about escaping anything but END.
Single Quotes are fine for HTML, but they don't make valid XHTML, which might be problematic if anybody was using a browser which supported only XHTML, but not HTML. I don't believe any such browsers exist, though there are probably some User-Agents out there that do require strict XHTML.