Google Maps API：为什么不能使用相对图标路径设置标记的图标？

Question

These are my marker options

var markerOptions = {
                clickable: true,
                draggable: false,
                flat: true,
                map: map,
                icon: 'food.png',
                optimized: true,
                position: pos,
                title: name,
                visible: true,
                animation:google.maps.Animation.DROP,
            };

'food.png' is in the same folder of the javascript file. However it doesn't work.

If I use the full http path it works fine. For example

http://localhost/javascript/food.png

is it possible to avoid this?

Answer 1

The icon image needs to be in the same directory as the HTML page it is being referenced from, not the same directory as the javascript.

Update: as webaware pointed out a relative path to the icon should be relative to the directory containing the HTML document.

The example from the documentation works fine both on the Google site and locally on my machine.