RE: [OPEN LAYERS] Wczytywanie danych z MySQL - BIMSON - 09-02-2012
(08-02-2012, 19:57)Odoakr napisał(a): Usuń minScale i maxScale.
Zaciemnienie jest właśnie powodowane przez to, że skala mapy nie mieści się w przedziale miedzy minScale i maxScale. Jak ustawisz odpowiedni zoom to w LayerSwitcher warstwa się "rozjaśni".
Ta patrzę jeszcze na tego geojsona i tam jest chyba byk w ścieżce do fotki.
Usunąłem minScale i maxScale, faktycznie warstwę moge już włączać i wyłączać. Poprawiłem też plik geojson (miałem zamienione współrzędne i wogóle przekazywane jako string).
Jak teraz wyswietlic fotke w popup? W pliku geojson przekazuje ścieżkę do pliku na serwerze, jak to wyciągnąć w openlayer żeby foto się pojawiało? Mam juz popup ale wyswietla mi fotke z dysku. Ale jak podczytac dane z geojson?
Cytat:Ta patrzę jeszcze na tego geojsona i tam jest chyba byk w ścieżce do fotki.
Tak, ja też to zauważyłem i co ciekawe to w bazie mam dobrą ścieżkę (w załączeniu plik ze zrzutem ekranu). Najlepsze jest to że kiedy wpisze echo w moim pliku php co tworzy geojson to ścieżka również jest dobra
RE: [OPEN LAYERS] Wczytywanie danych z MySQL - Odoakr - 09-02-2012
1) Tworzysz Control, który obsłuży wybór obiektu (poniższy kod z przykładów OL):
Kod PHP: selectCtrl = new OpenLayers.Control.SelectFeature(vector, {clickout: true} ); map.addControl(selectCtrl); selectCtrl.activate();
2 A następnie event, który po kliknięciu w obiekt (select) się wykona.
Kod PHP: vector_oferty.events.on({ "featureselected": function(event) { var f = event.feature; var Y = f.geometry.y; var X = f.geometry.x; // adres fotki var foto = f.attributes.path; popup = new OpenLayers.Popup.FramedCloud("chicken", new OpenLayers.LonLat(X,Y), new OpenLayers.Size(200,200), "<img src="foto">" null, true ); map.addPopup(popup); } }); }, });
3. Albo prościej
Kod PHP: var selektor = new OpenLayers.Control.SelectFeature(map.layers, {onSelect:function(f){alert('adres fotki to '+f.attributes.path)}});
map.addControl(selektor);
selektor.activate();
4. W przykładach znajdziesz jak wystylizować popup
RE: [OPEN LAYERS] Wczytywanie danych z MySQL - BIMSON - 10-02-2012
Stworzyłem Control i działał. Jednak jak dodałem event to mapa
się nie wyświetla. Moje pomysły się skończyły. Prosze o pomoc.
Kod: var map;
var selectCtrl;
function init() {
map = new OpenLayers.Map('map');
var gphy = new OpenLayers.Layer.Google(
"Google Physical",
{type: google.maps.MapTypeId.TERRAIN}
);
var gmap = new OpenLayers.Layer.Google(
"Google Streets", // the default
{numZoomLevels: 20}
);
var ghyb = new OpenLayers.Layer.Google(
"Google Hybrid",
{type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20}
);
var gsat = new OpenLayers.Layer.Google(
"Google Satellite",
{type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}
);
var vectorlayer = new OpenLayers.Layer.Vector("geojson", {
strategies: [new OpenLayers.Strategy.Fixed()],
protocol: new OpenLayers.Protocol.HTTP({
url: "new.php",
format: new OpenLayers.Format.GeoJSON()
}),
// parametry opcjonalne
displayInLayerSwitcher: true
});
map.addLayers([gphy, gmap, ghyb, gsat, vectorlayer]);
selectCtrl = new OpenLayers.Control.SelectFeature([vectorlayer],
{clickout: true}
);
map.addControl(selectCtrl);
selectCtrl.activate();
map.addControl(new OpenLayers.Control.LayerSwitcher(), new
OpenLayers.Control.Navigation({
dragPanOptions: {
enableKinetic: true
}
}));
vectorlayer.events.on({
"featureselected": function(event) {
var f = event.feature;
var Y = f.geometry.y;
var X = f.geometry.x;
var foto = f.attributes.path;// adres fotki
popup = new
OpenLayers.Popup.FramedCloud("chicken",
new OpenLayers.LonLat(X,Y),
new OpenLayers.Size(200,200),
"<img src="foto">"
null,
true
);
map.addPopup(popup);
}
});
// Google.v3 uses EPSG:900913 as projection, so we have to
// transform our coordinates
map.setCenter(new OpenLayers.LonLat(10.2, 48.9).transform(
new OpenLayers.Projection("EPSG:4326"),
map.getProjectionObject()
), 5);
// add behavior to html
var animate = document.getElementById("animate");
animate.onclick = function() {
for (var i=map.layers.length-1; i>=0; --i) {
map.layers[i].animationEnabled = this.checked;
}
};
}
Natomiast jak zastosowałem twój prostszy pomysł z 3 punktu to
wyskakuje "adres fotki undenfined".
To oznacza że zapomniałem czegoś wcześniej zdefiniować ,czy źle się łącze z atrybutem ?
Próbowałem też tak :
Kod: selectControl = new OpenLayers.Control.SelectFeature(vectorlayer);
vectorlayer.events.on({
"featureselected": onFeatureSelect,
"featureunselected": onFeatureUnselect
});
map.addControl(selectControl);
selectControl.activate();
function onPopupClose(evt) {
selectControl.unselectAll();
}
function onFeatureSelect(event) {
var feature = event.feature;
var detail = feature.attributes['description'];
var content = "<div style='font-size:.8em; width:120px;'><strong>"+
feature.attributes.name + "</strong><hr />" + detail + "</div>";
popup = new OpenLayers.Popup.FramedCloud("chicken",
feature.geometry.getBounds().getCenterLonLat(),
new OpenLayers.Size(100,100),
content,
null, true, onPopupClose);
popup.border = '1px solid black';
popup.opacity = .7;
popup.panMapIfOutOfView = true;
feature.popup = popup;
map.addPopup(popup);
}
function onFeatureUnselect(event) {
var feature = event.feature;
if(feature.popup) {
map.removePopup(feature.popup);
feature.popup.destroy();
delete feature.popup;
}
}
Ale dostaje undefined
W załączniku plik.
Doszedłem do tego co jest źle --> plik geojson
to co przekazuje powinno byc w sekcji "properties" : {}
Wyświetla mi już co chce.
Została jedynie kwestia tego jak podmienić marker na własny i obrócić go o kąt podany w attributes pliku geojson
|