Using the gem leaflet-rails
My initializer has the tile_layer and max_zoom
there is a height to the div: .mapid { height: 500px; }
Here is my html.erb
<% #imgData.each_with_index do |data, index| %>
<%=image_tag( data['images']["standard_resolution"]['url'] )%>
<div class="mapid" >
<%= map(:container_id => "map" + index.to_s, :center => {
:latlng => [data['location']['latitude'], data['location']['longitude']],
:zoom => 18
}) %>
</div>
When I hover on those links for the img src, they are valid and will lead me to a tile.
My tiles get loaded properly. There are no js errors, but nothing is being displayed... Any ideas?
You should give a height to the #map<nr> containers within that outer #mapid container, or you can do .leaflet-container { height:500px }.
Related
I referred this episode of railscasts
http://railscasts.com/episodes/182-cropping-images
But whenever I press on the crop button
I get an error
convert.exe: invalid argument for option `-crop': 'YYYxYYY+YYY+YYY'-auto-orient
# error/convert.c/ConvertImageCommand/1124.
Y being the values depending on the selected area.
Please suggest me to rectify this bug.
This is my controller code:
def crop_photo
#artist_profile=ArtistProfile.find(params[:id])
#artist_profile.update_attributes(params[:artist_profile])
if #artist_profile.save
format.js
end
My cropping view file :
<%= stylesheet_link_tag "jquery.Jcrop" %>
<%= javascript_include_tag "jquery.Jcrop" %>
<div style="max-width: 720px;">
<%= nested_form_for #artist_profile, :url => cropped_photo_path ,:html => { :method => :post } ,:remote => true do |f| %>
<%= image_tag #artist_profile.photo.url(:large), :id => "cropbox" %>
<%= hidden_field_tag "artist_profile_id", #artist_profile.id %>
<h4>Preview:</h4>
<div style="width:100px; height:100px; overflow:hidden">
<%= image_tag #artist_profile.photo.url(:thumb), :id => "preview_image" %>
</div>
<% for attribute in [:crop_x, :crop_y, :crop_w, :crop_h] %>
<%= f.hidden_field attribute, :id => attribute %>
<% end %>
<p><%= f.submit "Crop" %></p>
<% end %>
</div>
<script type="text/javascript" charset="utf-8">
$(function() {
$('#cropbox').Jcrop({
onChange: update_crop,
onSelect: update_crop,
setSelect: [0, 0, 500, 500],
aspectRatio: 1
});
});
function update_crop(coords) {
var rx = 100.00/coords.w;
var ry = 100.00/coords.h;
$('#preview_image').css({
width: Math.round(rx * <%= #artist_profile.photo_geometry(:large).width %>) + 'px',
height: Math.round(ry * <%= #artist_profile.photo_geometry(:large).height %>) + 'px',
marginLeft: '-' + Math.round(rx * coords.x) + 'px',
marginTop: '-' + Math.round(ry * coords.y) + 'px'
});
var ratio = <%= #artist_profile.photo_geometry(:original).width %> / <%= #artist_profile.photo_geometry(:large).width %>;
$("#crop_x").val(Math.round(coords.x * ratio));
$("#crop_y").val(Math.round(coords.y * ratio));
$("#crop_w").val(Math.round(coords.w * ratio));
$("#crop_h").val(Math.round(coords.h * ratio));
}
</script>
Looks like your system is either not sending or processing the required crop co-ordinates:
Javascript is not updating the hidden fields
JCrop is not capturing / processing the right data
Rails is not reading the params properly
JS
You may want to write your JS code like this:
var jCrop = function() {
$('#cropbox').Jcrop({
onChange: update_crop,
onSelect: update_crop,
setSelect: [0, 0, 500, 500],
aspectRatio: 1
});
};
$(document).ready(jCrop);
$(document).on("page:load", jCrop);
Your JCrop could be prevented from loading due to not loading correctly
JCrop
The other issue you may have is JCrop not capturing the right data
You need to make sure your hidden fields are actually getting populated with the data. Your update_crop code looks okay - so I would look at view_source > hidden fields
Rails
The likely problem here is probably Rails' processing of the params
You're passing your form_for var as #artist_profile
I would do this in your controller (considering you're using Rails 4):
def crop_photo
#artist_profile = ArtistProfile.find(params[:id])
#artist_profile.update_attributes(crop_params)
if #artist_profile.save
format.js
end
end
private
def crop_params
params.require(:artist_profile).permit(:crop_x, :crop_y, :crop_h, :crop_w)
end
I am developing an application using rails 3.2.0 and ruby 1.9 on a Mac
I have a very strange error when rendering an index view
Rails is rendering the characters us at the bottom of the screen, below an index table, and I cannot find these characters in the view.
This part of the view looks like
<section id="main">
<section id="group"></section>
<section id="content">
<section id="data_table_section">
<script>
us
</section>
</section>
The part from id=content is yield in a layout file
<section id='content'>
<%= yield %>
</section>
When I delete the content of the view template, i.e the the us is still there
When I delete <%= yield %> in the layout, the us disappears
When I search for the us in the view code it is not found
When I add my own extra characters in the bottom of the view template code, after tags the us is displayed after these characters
When I delete the layout template the us is still there
The only thing I can come up with is that us is generated by the yield function in some mysterious way, but that seems as a very strange explanation!
Anyone that has had this problem before?
Anyone that know how to find extra characters as us in the code ?
Could it be a bug in the rendering engine ?
Any advices would be great appreciated
Here follows my view code. I use tableastic gem and some other gems
<% if !#unit.nil?
header_text="Deltagarlista för #{#unit.class.model_name.human} #{#unit.name}"
else header_text='Deltagarlista för ST-Forum'
end %>
<section id='data_table_section'>
<article id='remote_clinic_article'></article>
<article id="users_article">
<%= table_for(#users) do |t| %>
<thead ><tr ><th id='table_header' colspan=17><%=header_text%></th></tr></thead>
<thead><tr style='text-align:center;' ><th colspan=15><%= render :partial=>'users/filter'%></th></tr></thead>
<% index=(params[:page].to_i-1)*#per_page%>
<%= t.data do
t.cell(:id, :heading => "Id") {|p| index+=1}
t.cell(:portrait, :heading => "Foto") {|p| image_tag(p.portrait_image,:height=>'24px')}
t.cell(:name,:heading => sort_to("Namn",users_url(:sort_field=>'surname', :sort=>#sort),#sort_field)) {|p| link_to(mark_search_hits(p.name,#search),user_path(p.id))}
t.cell(:clinic, :heading => sort_to("Arbetsplats",users_url(:sort_field=>'clinics.name', :sort=>#sort),#sort_field)) {|p| link_to(mark_search_hits(p.clinic.name,#search),clinic_path(p.clinic.id)) unless p.clinic.nil?}
t.cell(:email,:cell_html => {:class => "address"},
:heading => sort_to("Email",users_url(:sort_field=>'email', :sort=>#sort),#sort_field)) {|p| mail_to(mark_search_hits(truncate(p.email,:length =>20),#search))}
t.cell(:user_roles,:cell_html => {:style => "width:50px"},
:heading => sort_to("Roller",users_url(:sort_field=>'user_roles.role_index', :sort=>#sort),#sort_field)) {|p| mark_search_hits(p.roles(true).to_sentence,#search)}
t.cell(:groups, :heading => sort_to("Grupper",users_url(:sort_field=>'groups.name', :sort=>#sort),#sort_field)) {|p| mark_search_hits(to_sentence(p.groups),#search)}
t.cell(:forum, :heading => sort_to("ST-forum",users_url(:sort_field=>'forums.name', :sort=>#sort),#sort_field)) {|p| mark_search_hits(link_to(p.forum.name,clinic_path(p.forum.id)),#search) unless p.forum.nil?}
t.cell(:st_starts_on, :heading => sort_to("ST-start -- slut",users_url(:sort_field=>'employments.st_starts_on', :sort=>#sort),#sort_field)){|p| mark_search_hits(between_user_dates(p.employment.st_starts_on,p.employment.st_end_on),#search) unless p.employment.nil?}
t.cell(:legitimation_on,:heading => sort_to("Legitimation",users_url(:sort_field=>'employments.legitimation_on', :sort=>#sort),#sort_field)){|p| mark_search_hits(to_user_date(p.employment.legitimation_on),#search) unless p.employment.nil?}
t.cell(:employed_on,
:heading => sort_to("ST-kontrakt",users_url(:sort_field=>'employments.employed_on', :sort=>#sort),#sort_field)){|p| mark_search_hits(to_user_date(p.employment.employed_on),#search) unless p.employment.nil?}
t.cell(:last_visit,
:heading => sort_to("Inloggad senast",users_url(:sort_field=>'last_visit_at', :sort=>#sort),#sort_field)){|p| mark_search_hits(to_user_date(p.last_visit_at),#search) }
t.cell(:mail,
:heading => "Handledare / Handledd") {|p| if !p.supervisors.blank? then mail_supervisors(p) elsif !p.supervised.blank? then mail_supervised(p) end}
t.cell(:id, :cell_html => {:style => "width:30px"},:heading=>image_to('new.png',new_user_path,:class=>'no_class')) {|p| (image_to('destroy.png',user_path(p),:class=>'none',:method=>'delete', :id=>'destroy_button', :confirm => "Vill du verkligen radera vald kurs ",:title=>'Radera kurs')+' '+image_to('map.png', map_address_path(p.address.id),:method=>:get,:class=>'none', :remote=>true, :title=>'Visa en karta över bostadsområdet')).html_safe}
end%>
<tfoot>
<tr >
<td colspan="16" class='flickr_pagination'><%= will_paginate #users, :container => true %><span class="table_filter_text">
<% if #count_users==0 %>
<span class="table_filter_alert_text">
<%=" Inga användare tillgänglig för #{put_filter(#filterparams)}".html_safe%>
</span>
<%else%>
<span class="table_footer_text">
<%="Visar användare "+((params[:page].to_i-1)*#per_page+1).to_s+" till "+([(params[:page].to_i-1)*#per_page+#per_page,#count_users].min).to_s+" av #{#count_users.to_s} användare" .html_safe%>
<br/><%= "Med #{ put_filter(#filterparams)}".html_safe %>
</span>
<%end%>
</td>
</tr>
</tfoot>
<% end %>
</article>
</section>
<script>
$(document).ready(function() {
/* $('.pagination a').attr('data-remote', 'true');*/
jQuery(".best_in_place").best_in_place();
});
// Observe forum_field and filter group_options
$(document).ready(function(){
$("#forum_id").live('change',function () {
var forum = "";
forum=$("select#forum_id :selected").val()
if (forum=='') {forum=0}
jQuery.get('/users/'+forum+'/update_group_options', function(data){
$("#group_div").html(data);
})
return false;
})
.change();
$("#county_council_id").live('change',function () {
var county_council = "";
county_council=$("select#county_council_id :selected").val()
if (county_council=='') {county_council=0}
jQuery.get('/users/'+county_council+'/update_forum_options', function(data){
$("#forum_div").html(data);
})
return false;
})
.change();
});
</script>
I think the "us" is written by js.
May be you can double check the js.
I'm using Rails 3.0.9 version, and jquery.
I've been using this gem without a database. It is used only for map display, and display KML file on it. For this I used:
<div id='ajax_map'>
<% #kmlurl="http://mysite/file1.kml" %>
<%= gmaps( :kml => { :data => "[{ url: #{#kmlurl.inspect}}]" } ) %>
</div>
All great shows.
I want to do that after you change the links (# kmlurl), and click on the button, the map updated with this new KML file. I use a separate action js.erb with the following code:
$('#ajax_map').html('<%= #kmlurl="http://mysite/file2.kml" %>'+'<br />'+'<%= gmaps( :kml => { :data => "[{ url: #{#kmlurl.inspect}}]" } ) %>');
But he does not update the DIV. "js.erb" rendered normally, without using the method of gmaps () it normally returns # kmlurl. I tested this same code in the ". Html.erb" in the tags , it loads a new file, but, of course, just when the page loads.
How can I solve this problem?
Solved the problem as follows (in js.erb):
$('#ajax_map').html('<%= escape_javascript( gmaps({:last_map => false}) ) %>');
Gmaps.map = new Gmaps4RailsGoogle();
Gmaps.load_map = function() {
Gmaps.map.map_options.maxZoom = 15;
Gmaps.map.initialize();
Gmaps.map.kml = [{ url: '<%= "#{#kmlurl}" %>'}];
Gmaps.map.create_kml();
Gmaps.map.adjustMapToBounds();
Gmaps.map.callback();
};
Gmaps.loadMaps();
First I would refactor things just a bit.
Say that first bit of code were in your index page. I'd move the setting of #kmlurl into the corresponding controller action:
def index
#kmlurl = "http://mysite/file1.kml"
end
Then (assuming index?) your index view would be simply:
<div id="ajax_map">
<%= gmaps( :kml => { :data => "[{ url: #{#kmlurl}}]" } ) %>
</div>
Then to add a link that will update the map:
<%= link_to 'Other Map', '/othermap', :remote=>true %>
Now you'd create a route in routes.rb:
match '/othermap' => 'foo#othermap'
Then in foo_controller.rb:
def othermap
#kmlurl = "http://mysite/file2.kml"
end
Then create othermap.js.erb:
$('#ajax_map').html(
'<%=
escape_javascript(
gmaps( :kml => { :data => "[{ url: #{#kmlurl}}]" } )
)
%>'
)
That's a quick fix, but what I would REALLY do is strive to make your view code as simple as possible, and do all the real work in the controller. Ideally your view would just be:
<div id="ajax_map">
<%= gmaps( :kml => { :data => #mapdata } ) %>
</div>
set up #mapdata as appropriate in your controller. You've got too much stuff that really belongs in a controller embedded in your view code! Your othermap.js.erb should be equally simplified. i.e.
$('#ajax_map').html('<%= escape_javascript(gmaps( :kml => { :data => #mapdata } ))%>')
Am I missing something obvious? Map keeps loading #oldjson which I set in the controller and won't be replaced when I set it in the view.
View code:
<% #json = Map.find_by_id('39').to_gmaps4rails %>
<%= gmaps("markers" => {"data" => #oldjson, "options" => { "draggable" => true } } ) %>
<script>
Gmaps.map.replaceMarkers(<%= #json %>);
</script>
Thanks.
I guess you"re facing a js error with this current code.
The reason is the following:
the js used and created by gmaps4rails is put within the yield :scripts
so your additionnal js here is called before the map is created
Solution:
<% #json = Map.find_by_id('39').to_gmaps4rails %>
<%= gmaps("markers" => {"data" => #oldjson, "options" => { "draggable" => true } } ) %>
<% content_for :scripts do %>
<script>
Gmaps.map.replaceMarkers(<%= #json %>);
</script>
<% end %>
I'm not getting any undefined constant errors or anything, so I know the plugin is at least installed. The page shows up, but all there is is an empty div tag:
<div id="map" style="width:400px;height:300px" ></div>
...and no map.
Controller:
#user = User.find_by_email(session[:email])
#tickets = Ticket.find(:all, :origin => [#user.lat, #user.lng], :within => 60, :order => 'distance' )
#map = GMap.new("map")
#map.center_zoom_init([#user.lat, #user.lng], 5)
View (note: I'm not calling any javascript tags):
<%= #map.div(:width => 400, :height => 300) %>
From the view... debug(#map) (x's are actual numbers)
--- !ruby/object:Ym4r::GmPlugin::GMap
container: map
global_init: []
init: []
init_begin:
- !ruby/object:Ym4r::GmPlugin::Variable
variable: map.setCenter(new GLatLng("xxxxxxx","-xxxxx"),5)
init_end: []
variable: map
The config/gmaps_api_key.yml has a key generated from localhost:3000
Anyone know what I'm doing wrong?
Answered. For those searching through the archives, you need to make sure you have the following in the view:
<%= #map.to_html %>
<%= #map.div(:width => 600, :height => 400) %>
As well as:
<%= GMap.header %>
preferably in your header file.