Author Topic: Bing Maps radar page  (Read 1605 times)

0 Members and 1 Guest are viewing this topic.

Offline oh65WX

  • Member
  • *
  • Posts: 5
    • oh65 Weather
Bing Maps radar page
« on: January 12, 2021, 08:46:16 PM »
Greetings!  New guy, here.  The recent inconvenient changes happening with the NWS radar imagery left me searching for a replacement for the lite image, and my searches led me here.  Finding that there isn't a lot of love for the new NWS radar, I thought I would share my alternative solution, using Bing maps.  I'm not a huge fan of Microsoft, but a dev license is free, as long as you don't have a huge amount of traffic.   [tup]  Here are the license details...

https://www.microsoft.com/en-us/maps/licensing

I was searching for an alternative site long before the NWS changes, and came across a tutorial from Microsoft on how to use their maps to display various data sets. They have an interactive code builder, using radar data as an example.  As it turns out, it's not too bad.  I'm not a programmer, and I was able to piece together what I wanted.  The code builder produces Typescript, HTML, or JavaScript, which is what I used.  Here is the result...

https://www.oh65wx.com/radar/

Note that you can zoom in and out, or drag the map wherever you want.  Map controls are top right, including an a aerial view.  RADAR data age is top left, play/pause bottom left.  The page and data reloads every 5 minutes.  The data is from Iowa State University, but there are a bunch of other sources. 

Here is the tutorial site.  It's actually one several that I used, but this is where I started...

https://www.bing.com/api/maps/sdk/mapcontrol/isdk/weatherradarmap#JS

Please tell me what you think, because I have received zero feedback.  Here is my weather site.  The radar page is linked from the smaller radar image here...

https://www.oh65wx.com/

I intend to make a small version for the front page to replace the image there, but I haven't gotten around to finishing it.

Cheers!
Scott

Offline K6GKM

  • CamWX.com
  • Senior Member
  • **
  • Posts: 54
    • CamWX
Re: Bing Maps radar page
« Reply #1 on: January 12, 2021, 11:00:06 PM »
Very cool, Scott!  Neat find!  I'll need to play around with this...
Grant Miles - Camarillo, CA, USA
Owner/Admin - CamWX.com
SKYWARN Spotter
Davis Vantage Vue, WD, GRLevel3

Offline gwwilk

  • Southeast Lincoln Weather
  • Forecaster
  • *****
  • Posts: 2401
    • SouthEast Lincoln, NE Weather
Re: Bing Maps radar page
« Reply #2 on: January 13, 2021, 07:16:02 AM »
Very interesting find, Scott.  It's definitely worth exploring. [tup]
Regards, Jerry Wilkins
gwwilk@gmail.com

Offline ed_heaton

  • Contributor
  • ***
  • Posts: 113
    • Atglen Borough Weather Observatory
Re: Bing Maps radar page
« Reply #3 on: January 13, 2021, 07:16:37 AM »
Looks good Scott!

Offline tmabell

  • Forecaster
  • *****
  • Posts: 331
Re: Bing Maps radar page
« Reply #4 on: January 13, 2021, 07:54:52 AM »
This one uses ERSI base maps and radar data from Iowa State University.  https://mymishawakaweather.com/RegionalRadar2.php

The zoom level can be changed easily, as can the map center. No API key or license is needed.  I haven't investigated the use of single-site radar views but it may be possible.




Offline jonkjon

  • Senior Member
  • **
  • Posts: 66
    • K2mm Weather
Re: Bing Maps radar page
« Reply #5 on: January 16, 2021, 12:34:08 PM »
This one uses ERSI base maps and radar data from Iowa State University.  https://mymishawakaweather.com/RegionalRadar2.php

The zoom level can be changed easily, as can the map center. No API key or license is needed.  I haven't investigated the use of single-site radar views but it may be possible.

I am giving this a go and notice the array for the UTC update times doesn't seem to change. I'll keep looking and thanks for sharing this.

I believe I have this sorted. It seems the uriconstructor points to a file that is named based on how many minutes old the images are. I just added in a function to populate the array with the current time minus a minutes old variable (which is already done in your script via the "time" var) rather than the fixed times there now.

--Jon
« Last Edit: January 16, 2021, 04:56:20 PM by jonkjon »

Offline tmabell

  • Forecaster
  • *****
  • Posts: 331
Re: Bing Maps radar page
« Reply #6 on: January 17, 2021, 09:23:24 AM »
Glad you got it figured out.  Do you have it live yet?

Offline jonkjon

  • Senior Member
  • **
  • Posts: 66
    • K2mm Weather
Re: Bing Maps radar page
« Reply #7 on: January 17, 2021, 09:57:09 AM »
Still looking at some of the API but I am pretty happy with this...

http://www.k2mm.net/Weather/hartf/wxesri_radar.php

--Jon

Offline oh65WX

  • Member
  • *
  • Posts: 5
    • oh65 Weather
Re: Bing Maps radar page
« Reply #8 on: January 17, 2021, 11:22:32 AM »
This one uses ERSI base maps and radar data from Iowa State University.  https://mymishawakaweather.com/RegionalRadar2.php

The zoom level can be changed easily, as can the map center. No API key or license is needed.  I haven't investigated the use of single-site radar views but it may be possible.

That looks real good.  The map looks the same as the bing map, if you switch it to the aerial view.  I left the road map as default, because I think you can see the radar returns better on the white background, and I like the extra points of reference.  I made it full screen, because it works pretty well on my phone.  As for having to have a key, yeah, I'd rather not, but they make it painless.  It only took a few minutes, and I get a hit counter in return.  It's free use for not-for-profit sites, as long as you stay under 125,000 hits in a year.

It was all pretty easy to figure out, and there are a lot of options, like adding points on the map, and different map layers.  I need to look at changing the opacity of the data.  It blots out the map.  I'll get back to tweaking on it at some point, but by the time I got it to where it is, I was tired of messing with it for a while.  If anyone wants the code to play with, I'd be happy to share.   It's just one file, and it's not like I wrote it myself.  I'd love to see it polished up by someone that actually knows what they're doing.
« Last Edit: January 17, 2021, 11:37:12 AM by oh65WX »

Offline the beteljuice

  • the beteljuice
  • Senior Contributor
  • ****
  • Posts: 290
    • test site
Re: Bing Maps radar page
« Reply #9 on: January 17, 2021, 05:41:04 PM »
Why aren't you guys putting yourselves on the map ?

Code: [Select]
var marker = new L.marker([lat, lon],{title:"I am here"}).addTo(map);
Imagine what you will KNOW tomorrow !

Offline tmabell

  • Forecaster
  • *****
  • Posts: 331
Re: Bing Maps radar page
« Reply #10 on: January 17, 2021, 05:42:15 PM »
Good question!!  #-o

Offline jonkjon

  • Senior Member
  • **
  • Posts: 66
    • K2mm Weather
Re: Bing Maps radar page
« Reply #11 on: January 17, 2021, 06:08:52 PM »
Why aren't you guys putting yourselves on the map ?

Code: [Select]
var marker = new L.marker([lat, lon],{title:"I am here"}).addTo(map);

Trying this out but no marker image appears. Is there a resource I am missing?

Never mind....found it!

--Jon
« Last Edit: January 17, 2021, 06:15:52 PM by jonkjon »

Offline the beteljuice

  • the beteljuice
  • Senior Contributor
  • ****
  • Posts: 290
    • test site
Re: Bing Maps radar page
« Reply #12 on: January 17, 2021, 06:49:40 PM »
@Jon ...

Doesn't it work if you just add the line after ?
Code: [Select]
L.esri.basemapLayer('ImageryLabels').addTo(map);It shouldn't need to be in the (overlays) loop (I don't think)
Imagine what you will KNOW tomorrow !

Offline jonkjon

  • Senior Member
  • **
  • Posts: 66
    • K2mm Weather
Re: Bing Maps radar page
« Reply #13 on: January 17, 2021, 06:53:29 PM »
I forgot to move the images for the marker into the right directory....and thanks for pointing this option out!

--Jon

Offline the beteljuice

  • the beteljuice
  • Senior Contributor
  • ****
  • Posts: 290
    • test site
Re: Bing Maps radar page
« Reply #14 on: January 22, 2021, 04:50:53 PM »
the beteljuice thought "these tiles are for Mainland US, and you're using Leaflet" - Why not make more of it and create user variables for easy set up ?

EDIT: - Revised and repaired.
Now truly shows all available animation frames.
Added (owner) options of just cloud or rain with lightning and cloud.
Code: [Select]
// user variables
var mylat = 37.557; // your latitude
var mylon = -76.5059; // your longitude
var showme = true; // true / false - produce location marker
var mytxt = "Here I am"; // together with showme = true, simple note displayed on marker mouse-over
var opaq = 0.5; // transparency of cloud overlay ( 0 > 1), 0 = never be seen, 1 = totally opaque

var aerial = false; // true / false - true = sat type tiles / false = streets tiles

var rain = true; // true / false, false = cloud / true = cloud with rain and lightning

var initial = true; // true / false - initial map, true = regional, false = national

var emphasize = true; // true / false - MUST have extra emboldened place names - AUTOMATIC if aerial = true

var framerate = 1000; // ms - speed of animation, don't try to make it too fast

// END user vars

beteljuice test Hartfield style (Rain, lightning, cloud)

beteljuice test Hartfield style (cloud only)

beteljuice test Mishawaka style (cloud only, opacity 0.7)

... and updates every 5 minute.


Edit: For Information Only
However this work uncovered several glitches and perhaps a misunderstanding of the data 'grab'

This is because the barebones URI cannot grab 'Now', only latest available - which is the same as -m10m.
This also means there is no -m5m.
The URI seems to be limited to max -m40m i.e. there can only be a max of 8 'frames' (40 min) for the animation.
This seems a little odd, but I could find no guide on Iowa SU for 'time' parameters for their products.
There is also a coding sequence where the wrong time slots are displayed.

 However; I did find Their Guide To Using Leaflet which gave me the URI of their RAIN Radar (using the same -m?m gave the same results  :sad:), but they also give A link to their Git Hub page which I haven't investigated.

Leaflet is very powerful and flexible, it can also be customised to your foolish hearts desire Edit: Broken link fixed  :oops:
« Last Edit: January 28, 2021, 06:47:09 AM by the beteljuice »
Imagine what you will KNOW tomorrow !

Offline jonkjon

  • Senior Member
  • **
  • Posts: 66
    • K2mm Weather
Re: Bing Maps radar page
« Reply #15 on: January 22, 2021, 07:10:19 PM »
This seems a little odd, but I could find no guide on Iowa SU for 'time' parameters for their products.

I can't remember where I found it, but the uri -mxxm portion was supposedly a reference to how many minutes old the data is. I'll try and find it again.

--Jon

Offline jonkjon

  • Senior Member
  • **
  • Posts: 66
    • K2mm Weather
Re: Bing Maps radar page
« Reply #16 on: January 22, 2021, 07:19:29 PM »
I think I was looking at https://mesonet.agron.iastate.edu/ogc/....I am pretty wrapped up with work stuff so I can't delve into this more but I sure do appreciate everything you have done on this!

--Jon

Offline the beteljuice

  • the beteljuice
  • Senior Contributor
  • ****
  • Posts: 290
    • test site
Re: Bing Maps radar page
« Reply #17 on: January 22, 2021, 10:32:25 PM »
That page definitely states -m5m > -m50m ....

... but it simply doesn't work like that  :roll:
   and no 'by hour' stuff either.

If you want a longer animation period you will have to find a different data source and rewrite the grab routine  :shock:
« Last Edit: January 22, 2021, 10:35:26 PM by the beteljuice »
Imagine what you will KNOW tomorrow !

Offline jmcmurry

  • Jim McMurry
  • Forecaster
  • *****
  • Posts: 495
  • Davis Vantage Pro 2 Plus Wireless.
    • Juneau County Weather
Re: Bing Maps radar page
« Reply #18 on: January 25, 2021, 05:36:10 PM »
Since member oh65WX titled this thread "Bing Maps radar page", here's a Bing version that incorporates some of the beteljuice's ideas. https://jcweather.us/mapbingtest.php 

-Jim

Forum Search and Google Can be Your Best Friends

Offline TraderGary

  • Active Stock Market Trader
  • Forecaster
  • *****
  • Posts: 366
  • Amateur Radio W9VJ
Re: Bing Maps radar page
« Reply #19 on: January 25, 2021, 05:53:41 PM »
Very interesting!
And welcome to the forum, Scott.
Davis Vantage Pro2 Plus 6163 (Wireless) | Davis WeatherLink Live 6100 | Meteobridge Pro Red
WU: KGALOGAN20 | Ambient Weather: Lake Carlton | AWEKAS: 16965 | Windy: pws-f05f9e6b | WeatherLink: Lake Carlton

Offline Bunty

  • Forecaster
  • *****
  • Posts: 2281
  • Stillwater, home of Oklahoma State University
    • Welcome to Stillwater Weather
Re: Bing Maps radar page
« Reply #20 on: January 25, 2021, 11:59:32 PM »
Here is my version of it:  https://stillwaterweather.com/newwxradar

« Last Edit: February 05, 2021, 01:56:51 AM by Bunty »

Also the 2nd home page using modified AltDashboard 6.95 at http://stillwaterweather.com/wx/2ndhome.php

Offline oh65WX

  • Member
  • *
  • Posts: 5
    • oh65 Weather
Re: Bing Maps radar page
« Reply #21 on: January 26, 2021, 02:06:36 AM »
Very nice!  It runs a lot smoother when not full screen.  I like it!

Offline the beteljuice

  • the beteljuice
  • Senior Contributor
  • ****
  • Posts: 290
    • test site
Re: Bing Maps radar page
« Reply #22 on: January 28, 2021, 06:42:33 AM »
First of all apologies for not revisiting this thread sooner.

@jmcmurry
Quote
here's a Bing version that incorporates some of the beteljuice's ideas.
Thank you ...
... and reviewing your code and different URI construct highlighted the dimming of the beteljuice eyes and brain  #-o
ie. I've repaired my Leaflet offering - more later.

BTW - running your example on my PC allows me to use your auth key ???? - Is that supposed to happen ?

Back to your Bing ... small cosmetics to make the "Time" stay put.
Code: [Select]
#messagePanel{
position: relative;
top: 20px;
left: 20px;
background-color:white;
padding:2px;
border-style:solid;
border-width:1px;
border-radius:15px;
border-color:black;
width:50px;
text-align:center;
font-family: arial verdana;
font-weight: bold;
z-index: 2000;
}

and html

<div>
<h3 style="text-align:center;"><button onClick="goNational()"><i>National</i></button>&nbsp;&nbsp;&nbsp;&nbsp;Weather Radar&nbsp;&nbsp;&nbsp;&nbsp;<button id= 'reg_btn' onClick="goRegional()"><i>Regional</i></button></h3>
<div id="myMap">
<div id="messagePanel"></div>
</div>
<br><br>
</div>


Meanwhile back with Leaflet a la beteljuice - Revised and repaired.
Now truly shows all available animation frames.
Added (owner) options of just cloud or rain with lightning and cloud.
Code: [Select]
// user variables
var mylat = 37.557; // your latitude
var mylon = -76.5059; // your longitude
var showme = true; // true / false - produce location marker
var mytxt = "Here I am"; // together with showme = true, simple note displayed on marker mouse-over
var opaq = 0.5; // transparency of cloud overlay ( 0 > 1), 0 = never be seen, 1 = totally opaque

var aerial = false; // true / false - true = sat type tiles / false = streets tiles

var rain = true; // true / false, false = cloud / true = cloud with rain and lightning

var initial = true; // true / false - initial map, true = regional, false = national

var emphasize = true; // true / false - MUST have extra emboldened place names - AUTOMATIC if aerial = true

var framerate = 1000; // ms - speed of animation, don't try to make it too fast

// END user vars

beteljuice test Hartfield style (Rain, lightning, cloud)

beteljuice test Hartfield style (cloud only)

beteljuice test Mishawaka style (cloud only, opacity 0.7)

... and the leaflet version updates every 5 minute.

Imagine what you will KNOW tomorrow !

Offline tmabell

  • Forecaster
  • *****
  • Posts: 331
Re: Bing Maps radar page
« Reply #23 on: January 28, 2021, 07:59:15 AM »
The beteljuice's version of my site's radar looks better than my own  =D&gt;

Offline jmcmurry

  • Jim McMurry
  • Forecaster
  • *****
  • Posts: 495
  • Davis Vantage Pro 2 Plus Wireless.
    • Juneau County Weather
Re: Bing Maps radar page
« Reply #24 on: January 29, 2021, 07:11:50 AM »
@the beteljuice,

Thanks for the time positioning help, great addition.  From what I can see, Bing Maps must not care about the authorization key anymore?  They ask for the url of the map it'll be used on, so one would expect that would be coded into the key.

- Jim

Forum Search and Google Can be Your Best Friends

 

anything