0

I am wondering how to change image size, available under the link in JSON file.

I base on the example:

http://www.gistechsolutions.com/leaflet/DEMO/baseball/BaseballPanel.html

which uses a links to the icon, based on the web. This is obviously fine, although the linked image must have a certain size like:

"Logo": "http:\/\/mlb.mlb.com\/mlb\/images\/team_logos\/logo_atl_79x76.jpg",
        "LeagueLogo": "http:\/\/mlb.mlb.com\/mlb\/images\/nl_75x75.png",

I have changed the link and put another one, so my JSON file (properties) currently looks like this:

"properties": {
    "name": "PE1 5RX",
    "MS_Ref": "REG/LYVELLYGDNS",
    "Owner": "Long Term Reversions (Dulwich) Limited",
    "Client_Ref": "LYVELLYGDNS",
    "Address": "The Keep, Lyvelly Gardens, Peterborough",
    "Postcode": "PE1 5RX",
    "Units": 18,
    "Logo": "https:\/\/www.cityfibre.com\/wp-content\/uploads\/2016\/09\/CF- 
logo-New-Green.png",
    "No_Under__H_Lease": 0,
    "FH_Title": "CB331893",
    "FH_Title_2": 0,
    "Possible_Query__over__availablity": "No"
  }

and attached logo is enormously big.

I tried to make sth like this:

"Logo": "<a href='https:\/\/www.cityfibre.com\/wp-content\/uploads\/2016\/09\/CF-logo-New-Green.png' width='100'></a>"

But it doesn't work at all.

To make the graph running i need a rough URL in the quote.

How to change the size of this image to make it more adjusted to the particular map/website? Unless it's necessary to upload the smaller image on the server first and next link it to the JSON?

The logo, which I am interested in is under the link below:

https://www.cityfibre.com/wp-content/uploads/2016/09/CF-logo-New-Green.pngenter image description here

closed as off-topic by IvanSanchez, Fran Raga, TomazicM, xunilk, Erik Sep 9 at 12:40

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "When seeking help to debug/write/improve code always provide the desired behavior, a specific problem/error and the shortest code (as formatted text, not pictures) needed to reproduce it in the question body. Providing a clear problem statement and a code attempt helps others to help you." – IvanSanchez, Fran Raga, TomazicM, xunilk, Erik
If this question can be reworded to fit the rules in the help center, please edit the question.

  • 1
    <img src=" + feature.properties.Logo +" style='width:120px;height:120px;'> Your logo is an image not a hyperlink, a hyperlinked image would open an html page. example...<a href="../html-link.htm"> <img src=" + feature.properties.Logo +" width="120" height="120"></a> – Bill Chappell Sep 6 at 17:09
1

In your example, add width and height attribute to img element like shown below.

//place attributes in panel table.
    var fieldA=document.getElementById('pict');
    fieldA.innerHTML='<img src="' +e.target.feature.properties.Logo +'">';

with

//place attributes in panel table.
    var fieldA=document.getElementById('pict');
    fieldA.innerHTML='<img src="' +e.target.feature.properties.Logo +'" width = 50 height = 50>';

Your solution of changing to

"Logo": "<a href='https:\/\/www.cityfibre.com\/wp-content\/uploads\/2016\/09\/CF-logo-New-Green.png' width='100'></a>"

will not work as in the code it is inside src attribute.

Not the answer you're looking for? Browse other questions tagged or ask your own question.