Es wird der erste Beitrag sein. Ich bin seit 4 Monaten ein Anfänger, seit ich mit dem Programmieren angefangen habe. Vielen Dank.
Es wurde geändert, um beim Erstellen eines Portfolios mithilfe von japanMap nach Ereignissen in 8 Regionen suchen zu können. Zu diesem Zeitpunkt hatte ich ein kleines Problem damit, willkürliche Parameter an die Links für jede Region zu übergeben, daher habe ich sie selbst zur Bestätigung gepostet.
Dieses Mal habe ich das japanMap-Programm in die Datei application.js geschrieben.
Unten ist der Code, den ich geschrieben habe.
application.js
//Suchseite Japan Karte
$(function(){
//Erstellen Sie Links in 8 Regionen
var areaLinks = {
1:"/user/index?sort=hokkaido",
2:"/user/index?sort=tohoku",
3:"/user/index?sort=kanto",
4:"/user/index?sort=chubu",
5:"/user/index?sort=kinki",
6:"/user/index?sort=chugoku_shikoku",
7:"/user/index?sort=kyusyu_okinawa",
};
//8 Ortsbezeichnung
var areas = [
{code : 1, name: "Hokkaido", color: "#ab86c4", hoverColor: "#dfcceb", prefectures: [1]},
{code : 2, name: "Tohoku", color: "#6d93d1", hoverColor: "#91b0e3", prefectures: [2,3,4,5,6,7]},
{code : 3, name: "Kanto", color: "#f5a164", hoverColor: "#f5c09a", prefectures: [8,9,10,11,12,13,14]},
{code : 4, name: "Chubu", color: "#77e077", hoverColor: "#adedad", prefectures: [15,16,17,18,19,20,21,22,23]},
{code : 5, name: "Kinki", color: "#ffe966", hoverColor: "#fff2a3", prefectures: [24,25,26,27,28,29,30]},
{code : 6, name: "China / Shikoku", color: "#e68ccc", hoverColor: "#f0b9e0", prefectures: [31,32,33,34,35,36,37,38,39]},
{code : 7, name: "Kyushu-Okinawa", color: "#de6474", hoverColor: "#f29da9", prefectures: [40,41,42,43,44,45,46,47]},
];
//Kartenanzeigeeinstellungen
$("#map-container").japanMap({
width: 600,
areas : areas,
selection : "area",
borderLineWidth: 0.25,
drawsBoxLine : false,
movesIslands : true,
showsAreaName : true,
font : "MS Mincho",
fontSize : 13,
fontColor :"#777",
fontShadowColor : "white",
onSelect : function(data){
location.href = areaLinks[data.area.code];
};
});
Dieser Teil oben ist der Link.
var areaLinks = {
1:"/user/index?sort=hokkaido",
2:"/user/index?sort=tohoku",
3:"/user/index?sort=kanto",
4:"/user/index?sort=chubu",
5:"/user/index?sort=kinki",
6:"/user/index?sort=chugoku_shikoku",
7:"/user/index?sort=kyusyu_okinawa",
};
Schreiben Sie in die Datei html.erb wie folgt
:○○.html.erb
<%= link_to '◯◯', ○◯_path(:sort => 'hokkaido') %>
Ich wusste nicht, wie ich link_to in die js.erb-Datei schreiben soll
php:○○.js.erb
1:"/user/index?sort=hokkaido"
Ich habe es so geschrieben. Dies ermöglichte es uns, beliebige Parameter [: sort] zu übergeben. Der Teil [? Sort = hokkaido] ist der Parameter.
○○_controller.rb
def index
if params[:sort] == 'hokkaido'
@events = Event.where(prefecture_code: "Hokkaido")
@events = @events.page(params[:page]).per(6).order("id DESC")
Das Obige ist Teil der Steuerung. Das Ereignis, das die Parameter unterscheidet und anzeigt, wird in der Beschreibung von [if params [: sort] == 'hokkaido'] geändert.
Es mag einige Fehler geben, die im ersten Beitrag schwer zu erkennen sind, aber danke, dass Sie bis zum Ende zugesehen haben.
Recommended Posts