且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Google Maps with Meteor和一个反应性InfoWindow

更新时间:2023-11-18 13:48:58

我还是一个中级流星黑客,所以请原谅我。对于#1,创建一个克隆: content:$('。stats')。clone()[0]
对于#2,您需要创建一个依赖项。文档在解释它和解释它方面做得很好。在不知道您的反应性数据源催化剂的情况下,我不能提供太多的帮助(我假设这是例子中的Session var)。噢,如果它基于集合中的新条目,请查看 .observe()函数。

  Template.name.created = function(){
Session.set('stats',10);
statsDep = new Deps.Dependency();
};






  statsDep 。依靠(); 
var dropWindow = new google.maps.InfoWindow({
content:$('。stats')。clone()[0]
});






  statsDep .changed(); 


I have a google maps API v3 application for meteor that I'm currently working on. When a person clicks on a marker, it shows an infoWindow with some at-window-creation time static content.

What I would like to do is use a reactive template to render the infoWindow's contents, either directly as HTML which can change or by referring to a dom element that updates reactively.

I've verified that if I use an infoWindow to refer to a DOM element, and that element's contents change, the Maps API updates the on-screen window properly. However, I am having problems with two issues:

(1) Closing the window destroys the DOM element, so it would have to be re-created. This is possibly easy enough to handle with a "if it exists update it, else create it, insert it, and update it" process. (2) UI.render doesn't appear to be dynamic, so creating it, inserting it, and updating it is harder than it feels like it should be.

I am still an intermediate Meteor hacker, so forgive me if I'm making this too hard on myself.

For #1, make a clone: content: $('.stats').clone()[0] For #2, you'll need to create a dependency. The docs do a pretty good job of explaining it & without knowing your reactive data source catalyst I can't help too much more (I assume it's a Session var in the example). Oh, and if it's based on new entries from a collection, check out the .observe() function.

Template.name.created = function() {
  Session.set('stats',10);
  statsDep = new Deps.Dependency();
};


statsDep.depend();
var dropWindow = new google.maps.InfoWindow({
  content: $('.stats').clone()[0]
});


statsDep.changed();