Question

我正在尝试控制使用Google Maps API创建的自定义叠加层的不透明度。这里没什么新东西，所以我搜索了Stack Overflow并从this tutorial遇到this question。

我不是JavaScript专家，所以我遇到了一些麻烦。我查看了代码，并尝试使用我已有的代码进行调整，但到目前为止还没有运气。如果我在Firebug中检查错误消息，我会收到以下消息：Uncaught TypeError: Cannot read property 'length' of undefined

如果您查看我的JSFiddle here，就可以看到第8行的错误与var tileCount有关。我不确定如何调整这部分代码，使其与我所拥有的一样，这是一个单独的图像，而不是教程中的图块。

滑块...幻灯片，但不会更改不透明度。最初也缺少旋钮/手柄。

感谢您的帮助和指导。

P上。 S.是的，我知道自定义叠加层与地图背景并不完全一致，但这只是一个实验/学习过程。

P上。 P. S.我转发了这个问题，因为我意识到我插入了错误的链接。

Answer 1

您可以尝试使用jquery解决此问题。

以下是代码中的a quick fix。

只需几个新字符串：

TestOverlay.prototype.setOpacity = function (op) {
   //Set opacity to all layer's divs (range from 0.00 to 1.00)
  $("div.myLayer").css("opacity", op/100);
}

TestOverlay.prototype.onAdd = function () {
  ...
  //Set class name for opacity
  div.className = "myLayer";

  this.div_ = div;

  var panes = this.getPanes();
  panes.overlayLayer.appendChild(div);
};

不透明度范围介于0和1之间。示例中的滑块返回0 - 20.需要稍微调整一下。

使用Google地图上的滑块控制自定义叠加层的不透明度

1 个答案: